SCSSコンパイルエラーの修正

このコミットが含まれているのは:
守矢諏訪子 2021-12-23 13:19:36 +09:00
コミット 5c08682a54
4個のファイルの変更37行の追加34行の削除

ファイルの表示

@ -1,6 +1,9 @@
// Fonts
@charset "UTF-8";
// Module
@use 'sass:math';
// Fonts
@import url('https://fonts.googleapis.com/css?family=Nunito');
// Variables

ファイルの表示

@ -34,5 +34,5 @@ $_duration: 0.3s !default;
// base spacing
$_white-space: 1.7rem !default;
$_white-space--small: ($_white-space / 2) !default;
$_white-space--small: math.div($_white-space, 2) !default;
$_white-space--large: ($_white-space * 2) !default;

ファイルの表示

@ -46,7 +46,7 @@ Modifierは以下のとおりです。
```
*/
$_layout-gutter: $_white-space !default;
$_layout-gutter-small: ($_layout-gutter / 2) !default;
$_layout-gutter-small: math.div($_layout-gutter, 2) !default;
$_layout-gutter-large: ($_layout-gutter * 2) !default;
.c-layout {
@ -121,55 +121,55 @@ $_layout-gutter-large: ($_layout-gutter * 2) !default;
*/
@include _responsive('.c-layout--col2') {
> .c-layout__item {
width: percentage(1 / 2);
width: percentage(math.div(1, 2));
}
}
@include _responsive('.c-layout--col3') {
> .c-layout__item {
width: percentage(1 / 3);
width: percentage(math.div(1, 3));
}
}
@include _responsive('.c-layout--col4') {
> .c-layout__item {
width: percentage(1 / 4);
width: percentage(math.div(1, 4));
}
}
@include _responsive('.c-layout--col2and10') {
> .c-layout__item:nth-child(odd) {
width: percentage(2 / 12);
width: percentage(math.div(2, 12));
}
> .c-layout__item:nth-child(even) {
width: percentage(10 / 12);
width: percentage(math.div(1, 12));
}
}
@include _responsive('.c-layout--col3and9') {
> .c-layout__item:nth-child(odd) {
width: percentage(3 / 12);
width: percentage(math.div(3, 12));
}
> .c-layout__item:nth-child(even) {
width: percentage(9 / 12);
width: percentage(math.div(9, 12));
}
}
@include _responsive('.c-layout--col4and8') {
> .c-layout__item:nth-child(odd) {
width: percentage(4 / 12);
width: percentage(math.div(4, 12));
}
> .c-layout__item:nth-child(even) {
width: percentage(8 / 12);
width: percentage(math.div(8, 12));
}
}
@include _responsive('.c-layout--col5and7') {
> .c-layout__item:nth-child(odd) {
width: percentage(5 / 12);
width: percentage(math.div(5, 12));
}
> .c-layout__item:nth-child(even) {
width: percentage(7 / 12);
width: percentage(math.div(7, 12));
}
}

ファイルの表示

@ -26,23 +26,23 @@ categories: [utility]
</div>
```
*/
.u-percent5 { width: percentage(5 / 100) !important; }
.u-percent10 { width: percentage(10 / 100) !important; }
.u-percent15 { width: percentage(15 / 100) !important; }
.u-percent20 { width: percentage(20 / 100) !important; }
.u-percent25 { width: percentage(25 / 100) !important; }
.u-percent30 { width: percentage(30 / 100) !important; }
.u-percent35 { width: percentage(35 / 100) !important; }
.u-percent40 { width: percentage(40 / 100) !important; }
.u-percent45 { width: percentage(45 / 100) !important; }
.u-percent50 { width: percentage(50 / 100) !important; }
.u-percent55 { width: percentage(55 / 100) !important; }
.u-percent60 { width: percentage(60 / 100) !important; }
.u-percent65 { width: percentage(65 / 100) !important; }
.u-percent70 { width: percentage(70 / 100) !important; }
.u-percent75 { width: percentage(75 / 100) !important; }
.u-percent80 { width: percentage(80 / 100) !important; }
.u-percent85 { width: percentage(85 / 100) !important; }
.u-percent90 { width: percentage(90 / 100) !important; }
.u-percent95 { width: percentage(95 / 100) !important; }
.u-percent100 { width: percentage(100 / 100) !important; }
.u-percent5 { width: percentage(math.div(5, 100)) !important; }
.u-percent10 { width: percentage(math.div(10, 100)) !important; }
.u-percent15 { width: percentage(math.div(15, 100)) !important; }
.u-percent20 { width: percentage(math.div(20, 100)) !important; }
.u-percent25 { width: percentage(math.div(25, 100)) !important; }
.u-percent30 { width: percentage(math.div(30, 100)) !important; }
.u-percent35 { width: percentage(math.div(35, 100)) !important; }
.u-percent40 { width: percentage(math.div(40, 100)) !important; }
.u-percent45 { width: percentage(math.div(45, 100)) !important; }
.u-percent50 { width: percentage(math.div(50, 100)) !important; }
.u-percent55 { width: percentage(math.div(55, 100)) !important; }
.u-percent60 { width: percentage(math.div(60, 100)) !important; }
.u-percent65 { width: percentage(math.div(65, 100)) !important; }
.u-percent70 { width: percentage(math.div(70, 100)) !important; }
.u-percent75 { width: percentage(math.div(75, 100)) !important; }
.u-percent80 { width: percentage(math.div(80, 100)) !important; }
.u-percent85 { width: percentage(math.div(85, 100)) !important; }
.u-percent90 { width: percentage(math.div(90, 100)) !important; }
.u-percent95 { width: percentage(math.div(95, 100)) !important; }
.u-percent100 { width: percentage(math.div(100, 100)) !important; }