From 1fef936f9aa24bfd0fa679162b8422676e1717e3 Mon Sep 17 00:00:00 2001 From: Michael Tremer Date: Tue, 17 Jul 2018 11:38:51 +0100 Subject: [PATCH] Drop Bootstrap Notes Signed-off-by: Michael Tremer --- src/scss/Bootstrap Notes.txt | 169 ----------------------------------- 1 file changed, 169 deletions(-) delete mode 100644 src/scss/Bootstrap Notes.txt diff --git a/src/scss/Bootstrap Notes.txt b/src/scss/Bootstrap Notes.txt deleted file mode 100644 index f492b167..00000000 --- a/src/scss/Bootstrap Notes.txt +++ /dev/null @@ -1,169 +0,0 @@ -Bootstap Media Breakpoints: - -@include media-breakpoint-up(xs) { ... } -@include media-breakpoint-up(sm) { ... } -@include media-breakpoint-up(md) { ... } -@include media-breakpoint-up(lg) { ... } -@include media-breakpoint-up(xl) { ... } - -// Example usage: -@include media-breakpoint-up(sm) { - .some-class { - display: block; - } -} - -@include media-breakpoint-down(xs) { ... } -@include media-breakpoint-down(sm) { ... } -@include media-breakpoint-down(md) { ... } -@include media-breakpoint-down(lg) { ... } - -@include media-breakpoint-only(xs) { ... } -@include media-breakpoint-only(sm) { ... } -@include media-breakpoint-only(md) { ... } -@include media-breakpoint-only(lg) { ... } -@include media-breakpoint-only(xl) { ... } - - - -GRID - -$grid-columns: 12; -$grid-gutter-width-base: 30px; - -$grid-gutter-widths: ( - xs: $grid-gutter-width-base, // 30px - sm: $grid-gutter-width-base, // 30px - md: $grid-gutter-width-base, // 30px - lg: $grid-gutter-width-base, // 30px - xl: $grid-gutter-width-base // 30px -) - -$grid-breakpoints: ( - // Extra small screen / phone - xs: 0, - // Small screen / phone - sm: 576px, - // Medium screen / tablet - md: 768px, - // Large screen / desktop - lg: 992px, - // Extra large screen / wide desktop - xl: 1200px -); - -$container-max-widths: ( - sm: 540px, - md: 720px, - lg: 960px, - xl: 1140px -); - -// Creates a wrapper for a series of columns -@mixin make-row($gutters: $grid-gutter-widths) { - display: flex; - flex-wrap: wrap; - - @each $breakpoint in map-keys($gutters) { - @include media-breakpoint-up($breakpoint) { - $gutter: map-get($gutters, $breakpoint); - margin-right: ($gutter / -2); - margin-left: ($gutter / -2); - } - } -} - -// Make the element grid-ready (applying everything but the width) -@mixin make-col-ready($gutters: $grid-gutter-widths) { - position: relative; - // Prevent columns from becoming too narrow when at smaller grid tiers by - // always setting `width: 100%;`. This works because we use `flex` values - // later on to override this initial width. - width: 100%; - min-height: 1px; // Prevent collapsing - - @each $breakpoint in map-keys($gutters) { - @include media-breakpoint-up($breakpoint) { - $gutter: map-get($gutters, $breakpoint); - padding-right: ($gutter / 2); - padding-left: ($gutter / 2); - } - } -} - -@mixin make-col($size, $columns: $grid-columns) { - flex: 0 0 percentage($size / $columns); - width: percentage($size / $columns); - // Add a `max-width` to ensure content within each column does not blow out - // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari - // do not appear to require this. - max-width: percentage($size / $columns); -} - -// Get fancy by offsetting, or changing the sort order -@mixin make-col-offset($size, $columns: $grid-columns) { - margin-left: percentage($size / $columns); -} - -@mixin make-col-push($size, $columns: $grid-columns) { - left: if($size > 0, percentage($size / $columns), auto); -} - -@mixin make-col-pull($size, $columns: $grid-columns) { - right: if($size > 0, percentage($size / $columns), auto); -} - -.container { - max-width: 60em; - @include make-container(); -} -.row { - @include make-row(); -} -.content-main { - @include make-col-ready(); - - @media (max-width: 32em) { - @include make-col(6); - } - @media (min-width: 32.1em) { - @include make-col(8); - } -} -.content-secondary { - @include make-col-ready(); - - @media (max-width: 32em) { - @include make-col(6); - } - @media (min-width: 32.1em) { - @include make-col(4); - } -} - -// NAVBAR - - \ No newline at end of file -- 2.47.3