prashantsani / single-page-bootstrap-grid

A single Page website built using bootstrap grid

single-page-bootstrap-grid

A single Page website built using bootstrap grid

• You can find a live version of the code on this link.

• For Grids, A customised grid for bootstrap has been used. Each column is 85px, gutter is 15px (So, 85 * 12 + 15 * 11 = 1,185px). These units have been derived from the InVision Link

• jQuery Not used

• SCSS used

• To Compile CSS, cd to the CSS folder and type in sass --watch main.scss:style.css --style compressed command

• Optimised images used, <picture> tag used to serve WEBP images. There are many ways to serve WEBP images, using <picture> tag is one of the most standards complaint way.

• Entire website code is optimised

---

Resources

• A very resourceful website for writing DOM operations on vanilla JS: http://youmightnotneedjquery.com/

• Bootstrap 4 documentation: https://getbootstrap.com/docs/4.1/

• Used a custom build of Bootstrap 4: https://getbootstrap.com/docs/4.1/getting-started/build-tools/

• Bootstrap 4 Flex Documentation: https://getbootstrap.com/docs/4.0/utilities/flex/

• Writing Media Queries with SCSS https://itnext.io/writing-media-queries-with-sass-mixins-3ea591ea3ea4

---

Website developed by Prashant Sani

---

Thank You!