Skip to content

Commit 65188e8

Browse files
achow101achow101
committed
sass: Resolve deprecated slash as division
1 parent 47e4aa4 commit 65188e8

File tree

8 files changed

+48
-31
lines changed

8 files changed

+48
-31
lines changed

‎_sass/grid.scss‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
Grid mixins
33
========================================================================== */
44

5+
@use "sass:math";
6+
57
/*
68
Define number of columns in the grid
79
Common values would be 12, 16 or 24
@@ -24,7 +26,7 @@ $margin: 0;
2426
@mixin grid($grid:$def_grid,$cols:'',$float:left,$display:inline){
2527
display:$display;
2628
float:$float;
27-
width:(100%/$grid * $cols) - ($margin * 2);
29+
width:(math.div(100%, $grid) * $cols) - ($margin * 2);
2830
}
2931

3032
/*
@@ -33,7 +35,7 @@ $margin: 0;
3335
========================================================================== */
3436

3537
@mixin prefix($grid:$def_grid,$cols:''){
36-
margin-left:(100%/$grid * $cols);
38+
margin-left:(math.div(100%, $grid) * $cols);
3739
}
3840

3941
/*
@@ -42,7 +44,7 @@ $margin: 0;
4244
========================================================================== */
4345

4446
@mixin suffix($grid:$def_grid,$cols:''){
45-
margin-right:(100%/$grid * $cols);
47+
margin-right:(math.div(100%, $grid) * $cols);
4648
}
4749

4850
/*
@@ -70,7 +72,7 @@ $margin: 0;
7072

7173
@mixin push($grid:$def_grid,$move:'') {
7274
position:relative;
73-
left:(100%/$grid * $move);
75+
left:(math.div(100%, $grid) * $move);
7476
}
7577

7678
/*
@@ -80,5 +82,5 @@ $margin: 0;
8082

8183
@mixin pull($grid:$def_grid,$move:''){
8284
position:relative;
83-
left:(100%/$grid * $move) * -1;
85+
left:(math.div(100%, $grid) * $move) * -1;
8486
}

‎_sass/mixins.scss‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
Utility mixins
33
========================================================================== */
44

5+
@use "sass:math";
6+
57
/*
68
Clearfix
79
For clearing floats like a boss h5bp.com/q
@@ -56,10 +58,10 @@
5658

5759
@mixin font-size($size) {
5860
font-size: 0px + $size;
59-
font-size: 0rem + $size / $doc-font-size;
60-
line-height: 0 + round($doc-line-height / $size*10000) / 10000;
61+
font-size: 0rem + math.div($size, $doc-font-size);
62+
line-height: 0 + math.div(round(math.div($doc-line-height, $size) * 10000), 10000);
6163
margin-bottom: 0px + $doc-line-height;
62-
margin-bottom: 0rem + ($doc-line-height / $doc-font-size);
64+
margin-bottom: 0rem + math.div($doc-line-height, $doc-font-size);
6365
}
6466

6567
/*
@@ -69,7 +71,7 @@
6971

7072
@mixin font-rem($size) {
7173
font-size: 0px + $size;
72-
font-size: 0rem + $size / $doc-font-size;
74+
font-size: 0rem + math.div($size, $doc-font-size);
7375
}
7476

7577
/*
@@ -79,8 +81,8 @@
7981

8082
@mixin font($size) {
8183
font-size: 0px + $size;
82-
font-size: 0rem + $size / $doc-font-size;
83-
line-height: 0 + round($doc-line-height / $size*10000) / 10000;
84+
font-size: 0rem + math.div($size, $doc-font-size);
85+
line-height: 0 + math.div(round(math.div($doc-line-height, $size) * 10000), 10000);
8486
}
8587

8688
/*
@@ -95,7 +97,7 @@
9597

9698
/* Indentation variable */
9799

98-
$indent-var: 0rem + ($doc-line-height / $doc-font-size);
100+
$indent-var: 0rem + math.div($doc-line-height, $doc-font-size);
99101

100102
/* ==========================================================================
101103
Gradient mixins

‎_sass/page.scss‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
Page layout
33
========================================================================== */
44

5+
@use "sass:math";
6+
57
body {
68
background-color: $bodycolor;
79
font-family: $base-font;
@@ -131,18 +133,18 @@ $button-size: 1.5rem;
131133
@mixin navicon-line() {
132134
display: inline-block;
133135
width: $button-size;
134-
height: $button-size/7;
136+
height: math.div($button-size, 7);
135137
// line color
136138
background: $white;
137-
border-radius: $button-size/14;
139+
border-radius: math.div($button-size, 14);
138140
transition: .3s;
139141
}
140142
.navicon-lines-button {
141-
padding: $button-size/4 $button-size/2;
143+
padding: math.div($button-size, 4) math.div($button-size, 2);
142144
transition: .3s;
143145
cursor: pointer;
144146
user-select: none;
145-
border-radius: $button-size/7;
147+
border-radius: math.div($button-size, 7);
146148
}
147149
.navicon-lines-button:hover {
148150
opacity: 1;
@@ -152,7 +154,7 @@ $button-size: 1.5rem;
152154
}
153155
.navicon-lines {
154156
margin-right: 10px;
155-
margin-bottom: $button-size/5;
157+
margin-bottom: math.div($button-size, 5);
156158
// create middle line
157159
@include navicon-line;
158160
position: relative;
@@ -163,17 +165,17 @@ $button-size: 1.5rem;
163165
position: absolute;
164166
left: 0;
165167
content: '';
166-
-webkit-transform-origin: $button-size/14 center;
167-
transform-origin: $button-size/14 center;
168+
-webkit-transform-origin: math.div($button-size, 14) center;
169+
transform-origin: math.div($button-size, 14) center;
168170
}
169-
&:before { top: $button-size/4; }
170-
&:after { top: -$button-size/4; }
171+
&:before { top: math.div($button-size, 4); }
172+
&:after { top: - math.div($button-size, 4); }
171173
}
172174
.navicon-lines-button:hover {
173175
opacity: 1;
174176
.navicon-lines {
175-
&:before { top: $button-size/3.5; }
176-
&:after { top: -$button-size/3.5; }
177+
&:before { top: math.div($button-size, 3.5); }
178+
&:after { top: - math.div($button-size, 3.5); }
177179
}
178180
}
179181
.navicon-lines-button.x.active .navicon-lines {
@@ -491,7 +493,7 @@ li.lang:hover {
491493
@include font-rem(20);
492494
&.link-post {
493495
margin-bottom: 0px + $doc-line-height;
494-
margin-bottom: 0rem + ($doc-line-height / $doc-font-size);
496+
margin-bottom: 0rem + math.div($doc-line-height, $doc-font-size);
495497
}
496498
}
497499
p {

‎_sass/vendor/font-awesome/_fixed-width.scss‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
// Fixed Width Icons
22
// -------------------------
3+
4+
@use "sass:math";
5+
36
.#{$fa-css-prefix}-fw {
4-
width: (18em / 14);
7+
width: math.div(18em, 14);
58
text-align: center;
69
}

‎_sass/vendor/font-awesome/_larger.scss‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
// Icon Sizes
22
// -------------------------
33

4+
@use "sass:math";
5+
46
/* makes the font 33% larger relative to the icon container */
57
.#{$fa-css-prefix}-lg {
6-
font-size: (4em / 3);
7-
line-height: (3em / 4);
8+
font-size: math.div(4em, 3);
9+
line-height: math.div(3em, 4);
810
vertical-align: -15%;
911
}
1012
.#{$fa-css-prefix}-2x { font-size: 2em; }

‎_sass/vendor/font-awesome/_list.scss‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
// List Icons
22
// -------------------------
33

4+
@use "sass:math";
5+
46
.#{$fa-css-prefix}-ul {
57
padding-left: 0;
68
margin-left: $fa-li-width;
@@ -11,9 +13,9 @@
1113
position: absolute;
1214
left: -$fa-li-width;
1315
width: $fa-li-width;
14-
top: (2em / 14);
16+
top: math.div(2em, 14);
1517
text-align: center;
1618
&.#{$fa-css-prefix}-lg {
17-
left: -$fa-li-width + (4em / 14);
19+
left: -$fa-li-width + math.div(4em, 14);
1820
}
1921
}

‎_sass/vendor/font-awesome/_variables.scss‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
// Variables
22
// --------------------------
33

4+
@use "sass:math";
5+
46
$fa-font-path: "../fonts" !default;
57
$fa-font-size-base: 14px !default;
68
$fa-line-height-base: 1 !default;
@@ -9,7 +11,7 @@ $fa-css-prefix: fa !default;
911
$fa-version: "4.5.0" !default;
1012
$fa-border-color: #eee !default;
1113
$fa-inverse: #fff !default;
12-
$fa-li-width: (30em / 14) !default;
14+
$fa-li-width: math.div(30em, 14) !default;
1315

1416
$fa-var-500px: "\f26e";
1517
$fa-var-adjust: "\f042";

‎_sass/vendor/magnific-popup/_settings.scss‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
// Settings //
33
////////////////////////
44

5+
@use "sass:math";
6+
57
// overlay
68
$mfp-overlay-color: $black; // Color of overlay screen
79
$mfp-overlay-opacity: 0.8; // Opacity of overlay screen
@@ -28,7 +30,7 @@ $mfp-include-iframe-type: true; // Enable Ifra
2830
$mfp-iframe-padding-top: 40px; // Iframe padding top
2931
$mfp-iframe-background: #000; // Background color of iframes
3032
$mfp-iframe-max-width: 900px; // Maximum width of iframes
31-
$mfp-iframe-ratio: 9/16; // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.)
33+
$mfp-iframe-ratio: math.div(9, 16); // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.)
3234

3335
// Image-type options
3436
$mfp-include-image-type: true; // Enable Image-type popups

0 commit comments

Comments
 (0)