- 031 Sass nesting
- 032 7-1 architecture
natours/v5-2/css/style.css
natours/v5-2/img/all-image-files
natours/v5-2/sass/main.scss
natours/v5-2/sass/abstracts/_functions.scss
natours/v5-2/sass/abstracts/_mixins.scss
natours/v5-2/sass/abstracts/_variables.scss
natours/v5-2/sass/base/_animations.scss
natours/v5-2/sass/base/_base.scss
natours/v5-2/sass/base/_typography.scss
natours/v5-2/sass/base/_utilities.scss
natours/v5-2/sass/components/_button.scss
natours/v5-2/sass/layout/_header.scss
natours/v5-2/sass/pages/_home.scss
- 034 grid system
-
natours/v5-3
/index.html
natours/v5-3/package.json
natours/v5-3/css/style.css
natours/v5-3/img/all-image-files
natours/v5-3/sass/main.scss
natours/v5-3/sass/abstracts/_functions.scss
natours/v5-3/sass/abstracts/_mixins.scss
natours/v5-3/sass/abstracts/_variables.scss
natours/v5-3/sass/base/_animations.scss
natours/v5-3/sass/base/_base.scss
natours/v5-3/sass/base/_typography.scss
natours/v5-3/sass/base/_utilities.scss
natours/v5-3/sass/components/_button.scss
natours/v5-3/sass/layout/_header.scss
natours/v5-3/sass/layout/_grid.scss
-
Problem Set
- buttons-v2/index.html
- buttons-v2/package.json
- buttons-v2/css/style.css
- buttons-v2/sass/main.scss
- buttons-v2/sass/all-the-different-7-1-folders/and-the-partials
- buttons-v2/sass/abstracts/_functions.scss
- buttons-v2/sass/abstracts/_mixins.scss
- buttons-v2/sass/abstracts/_variables.scss
- buttons-v2/sass/base/_animations.scss
- buttons-v2/sass/base/_base.scss
- buttons-v2/sass/base/_typography.scss
- buttons-v2/sass/base/_utilities.scss
- buttons-v2/sass/components/_button.scss
- buttons-v2/sass/layout/_header.scss
- buttons-v2/sass/pages/_home.scss
Blogging Question
The :not() pseudo-selector, selects everything that you pass as a parameter except the last child of it. In the tutorials, we used the not selector when creating the grid system, the not selector was used to give everything except the last child a margin-bottom.
lastly, the calc() method allows developers to do math functions. in the tutorials, we used the calc function when creating the grid system.
&:not(:last-child) { margin-bottom: $gutter-vertical; } width: calc((100% - #{$gutter-horizontal}) / 2);