Documentation:
- Google Drive includes presentation, content docs, documentation, etc.
- Figma file contains lo-fi, mid-fi, and hi-fi prototypes; color scheme/branding guide
Please contact me if you need access to any of these files!
Notice there are two html files: navBar.html and footer.html. The CSS of each webpage only works when the website is hosted LIVE, not when testing locally. This is done through jquery.
The reason the code is designed this way is so if future developers want to modify either the navBar or the footer (ie: add a new company for the search bar), they would not have to copy and paste those changes onto every webpage.
If you are testing changes internally, you must copy and paste the code inside the head and body tags of both navBar.html and footer.html onto each webpage to view that webpage. In addition, in the webpage, you must comment out the jquery refactor link, the div containing id "nav-placeholder", and the div containing id "footer-placeholder"- as well the script tags associated with those divs.
Attached in the repository is a file: "GHPagesTutorial" which gives instructions on how to host websites on github. When hosted, you can see changes made on the website live rather than locally. You can also bypass the jquery code refactoring issue mentioned above.
Here are some additional sources:
Reuse navigation bars on multiple pages (code refactoring): https://www.mackenziesoftware.com/2020/06/reuse-navigation-bar-on-multiple-pages.html
Building a Javascript search bar: https://www.jamesqquick.com/blog/build-a-javascript-search-bar
Slick slider options and settings: https://kenwheeler.github.io/slick/