diff --git a/docs/utilities/sizing-and-positioning.md b/docs/utilities/sizing.md similarity index 100% rename from docs/utilities/sizing-and-positioning.md rename to docs/utilities/sizing.md diff --git a/scss/_utilities.scss b/scss/_utilities.scss index c63e50600dd8d1d073153694f3797f9ea8d3491e..7d08ff2f8ca0c158ff8abaeaa99ab927c6453c72 100644 --- a/scss/_utilities.scss +++ b/scss/_utilities.scss @@ -5,7 +5,9 @@ @import "utilities/display"; @import "utilities/flex"; @import "utilities/float"; +@import "utilities/position"; @import "utilities/screenreaders"; +@import "utilities/sizing"; @import "utilities/spacing"; @import "utilities/text"; @import "utilities/visibility"; diff --git a/scss/utilities/_position.scss b/scss/utilities/_position.scss new file mode 100644 index 0000000000000000000000000000000000000000..2cf08bfa013d9a9bdd4c0a852ba2f380e68ccd78 --- /dev/null +++ b/scss/utilities/_position.scss @@ -0,0 +1,23 @@ +// Positioning + +.fixed-top { + position: fixed; + top: 0; + right: 0; + left: 0; + z-index: $zindex-fixed; +} + +.fixed-bottom { + position: fixed; + right: 0; + bottom: 0; + left: 0; + z-index: $zindex-fixed; +} + +.sticky-top { + position: sticky; + top: 0; + z-index: $zindex-sticky; +} diff --git a/scss/utilities/_sizing.scss b/scss/utilities/_sizing.scss new file mode 100644 index 0000000000000000000000000000000000000000..a7dc3e49b8e1c9f280ae7815c4ae02ef63dbacf7 --- /dev/null +++ b/scss/utilities/_sizing.scss @@ -0,0 +1,10 @@ +// Width and height + +@each $prop, $abbrev in (width: w, height: h) { + @each $size, $length in $sizes { + .#{$abbrev}-#{$size} { #{$prop}: $length !important; } + } +} + +.mw-100 { max-width: 100% !important; } +.mh-100 { max-height: 100% !important; } diff --git a/scss/utilities/_spacing.scss b/scss/utilities/_spacing.scss index 208212d5219de9bfa589c44c88c468aad00bb70f..6056e2b7e27fbdb401a61832b32499dc352c62b3 100644 --- a/scss/utilities/_spacing.scss +++ b/scss/utilities/_spacing.scss @@ -1,14 +1,3 @@ -// Width and height - -@each $prop, $abbrev in (width: w, height: h) { - @each $size, $length in $sizes { - .#{$abbrev}-#{$size} { #{$prop}: $length !important; } - } -} - -.mw-100 { max-width: 100% !important; } -.mh-100 { max-height: 100% !important; } - // Margin and Padding @each $breakpoint in map-keys($grid-breakpoints) { @@ -52,13 +41,3 @@ } } } - -// Positioning - -.pos-f-t { - position: fixed; - top: 0; - right: 0; - left: 0; - z-index: $zindex-navbar-fixed; -}