diff options
author | thingsym <thingsym@gmail.com> | 2020-11-22 10:34:46 +0300 |
---|---|---|
committer | thingsym <thingsym@gmail.com> | 2020-11-22 10:34:46 +0300 |
commit | 7f7d6115716b083c5d6d72b122d6b679987520c3 (patch) | |
tree | 86c9f32bf49a23a18e1585fd58434d66d960b706 /src/scss/_structure.scss | |
parent | 9ca28024bc70ca22e25d888b25e1a5f894c31c02 (diff) |
perf: replace scss from node-sass to dart-sass
Diffstat (limited to 'src/scss/_structure.scss')
-rw-r--r-- | src/scss/_structure.scss | 29 |
1 files changed, 19 insertions, 10 deletions
diff --git a/src/scss/_structure.scss b/src/scss/_structure.scss index a2f4c84..e58fab2 100644 --- a/src/scss/_structure.scss +++ b/src/scss/_structure.scss @@ -1,3 +1,12 @@ +// Built-In Modules +@use 'sass:map'; + +// Custom Modules +@use '../../node_modules/flexbox-grid-mixins/sass/flexbox-grid-mixins'; + +// Included Modules +@use 'variable'; + /*-----------------------* Structure *-----------------------*/ @@ -9,40 +18,40 @@ body { .container { width: 100%; height: 100%; - @include grid($flex-flow: column nowrap); + @include flexbox-grid-mixins.grid($flex-flow: column nowrap); margin: auto; } .content-container { - @include grid-col($flex-grow: 1, $flex-shrink: 0, $flex-basis: auto); - @include grid($justify-content: center); + @include flexbox-grid-mixins.grid-col($flex-grow: 1, $flex-shrink: 0, $flex-basis: auto); + @include flexbox-grid-mixins.grid($justify-content: center); } main { - @include grid-col($col: 9, $flex-shrink: 0, $max-width: 75%); + @include flexbox-grid-mixins.grid-col($col: 9, $flex-shrink: 0, $max-width: 75%); &:only-child { - @include grid-col($col: 12, $flex-shrink: 0, $max-width: 100%); + @include flexbox-grid-mixins.grid-col($col: 12, $flex-shrink: 0, $max-width: 100%); } } .sidebar { - @include grid-col($col: 3, $order: -1); + @include flexbox-grid-mixins.grid-col($col: 3, $order: -1); // position: fixed; // overflow-x: hidden; overflow-x: hidden; overflow-y: scroll; } -@media screen and (max-width: #{map-get($default-breakpoints, xs )} ) { +@media screen and (max-width: #{map.get(variable.$default-breakpoints, xs )} ) { .content-container { - @include grid($flex-flow: column nowrap); + @include flexbox-grid-mixins.grid($flex-flow: column nowrap); } main { - @include grid-col($col: none, $flex-shrink: 0, $min-width: 100%); + @include flexbox-grid-mixins.grid-col($col: none, $flex-shrink: 0, $min-width: 100%); } .sidebar { - @include grid-col($col: none, $order: 1); + @include flexbox-grid-mixins.grid-col($col: none, $order: 1); } } |