The website is composed of 4 pages showcasing 4 different concepts:
- Basic HTML -> this shows you ordered lists, unordered lists and tables. Note the unique CSS.
- Media Query -> an example of a media query adjusting to smart phones when resized.
- Bootstrap examples -> shows 2-column, 3-column staggered and 3-column with Bootstrap cards.
- SCSS example -> shows SCSS being compiled to CSS. Where the SCSS is syntax highlighting for SCSS.
What files to look at for the above:
- Basic HTML -> basic.html and styles.css (see CSS rules here)
- Media Query -> media.html and media.css (contains media query)
- Bootstrap examples -> bootstrap.html and supporting CDNS
- SCSS example -> scss.html, scss.scss (pre-compiled SASS) and scss.css (compiled css)
Some notes about each section regarding sources:
- Basic HTML -> I based this on memory as this is pretty easy. Googled a bit on W3C schools for selectors.
- Media Query -> Googled something on W3C schools and added my own CSS properties.
- Bootstrap examples -> I went to the official tutorial, repurposed the navbar and copied 3 examples from the tutorial. I then modified them to make them unique.
- SCSS example -> I went through the tutorial really quickly, just repurposed them for syntax highlighting.
Think the above is good enough explanation. Sorry I'm not that original regarding assignments.
Picture Content sourced from the below:
Pokemon pictures are based on this: https://www.pastemagazine.com/articles/2017/02/the-top-100-pokemon-of-all-time.html
Computer/Cellphone picture: Googled and found at these urls: Computer Picture: https://www.cio.com/article/3018771/top-10-millennial-stories-of-2015.html Cellphone Picture: https://www.frugal-millennial.com/how-to-get-the-most-cash-for-your-old-cell-phone/.
Chris Kottmyer