Skip to content

Commit

Permalink
fix(styling): address latest dart-sass math division deprecation warning
Browse files Browse the repository at this point in the history 
- latest version of dart-sass started adding deprecation warnings for math utilities (only division for now but more of them in the future)
  • Loading branch information
@ghiscoding
ghiscoding committed May 31, 2021
1 parent b1881c5 commit b7317d8
Show file tree
Hide file tree
Showing 5 changed files with 23 additions and 21 deletions.
4 changes: 2 additions & 2 deletions examples/webpack-demo-vanilla-bundle/package.json
View file
Expand Up @@ -46,7 +46,7 @@
"html-webpack-plugin": "5.3.1",
"mini-css-extract-plugin": "^1.6.0",
"rxjs": "^7.0.1",
"sass": "~1.32.13",
"sass": "^1.34.0",
"sass-loader": "^11.1.1",
"style-loader": "^2.0.0",
"ts-loader": "^9.2.0",
Expand All @@ -56,4 +56,4 @@
"webpack-cli": "^4.7.0",
"webpack-dev-server": "^3.11.2"
}
}
}
18 changes: 9 additions & 9 deletions packages/common/package.json
View file
Expand Up @@ -29,19 +29,19 @@
"delete:dist": "cross-env rimraf --maxBusyTries=10 dist",
"package:add-browser-prop": "cross-env node ../change-package-browser.js --add-browser=true --folder-name=common",
"package:remove-browser-prop": "cross-env node ../change-package-browser.js --remove-browser=true --folder-name=common",
"sass-build-task:scss-compile:bootstrap": "sass src/styles/slickgrid-theme-bootstrap.scss dist/styles/css/slickgrid-theme-bootstrap.css --style=compressed",
"sass-build-task:scss-compile:bootstrap": "sass src/styles/slickgrid-theme-bootstrap.scss dist/styles/css/slickgrid-theme-bootstrap.css --style=compressed --quiet-deps",
"postsass-build-task:scss-compile:bootstrap": "postcss --no-map --use autoprefixer --output dist/styles/css/slickgrid-theme-bootstrap.css dist/styles/css/slickgrid-theme-bootstrap.css --style=compressed",
"sass-build-task:scss-compile:material": "sass src/styles/slickgrid-theme-material.scss dist/styles/css/slickgrid-theme-material.css --style=compressed",
"sass-build-task:scss-compile:material": "sass src/styles/slickgrid-theme-material.scss dist/styles/css/slickgrid-theme-material.css --style=compressed --quiet-deps",
"postsass-build-task:scss-compile:material": "postcss --no-map --use autoprefixer --output dist/styles/css/slickgrid-theme-material.css dist/styles/css/slickgrid-theme-material.css --style=compressed",
"sass-build-task:scss-compile:material-bare": "sass src/styles/slickgrid-theme-material.bare.scss dist/styles/css/slickgrid-theme-material.bare.css --style=compressed",
"sass-build-task:scss-compile:material-bare": "sass src/styles/slickgrid-theme-material.bare.scss dist/styles/css/slickgrid-theme-material.bare.css --style=compressed --quiet-deps",
"postsass-build-task:scss-compile:material-bare": "postcss --no-map --use autoprefixer --output dist/styles/css/slickgrid-theme-material.bare.css dist/styles/css/slickgrid-theme-material.bare.css --style=compressed",
"sass-build-task:scss-compile:material-lite": "sass src/styles/slickgrid-theme-material.lite.scss dist/styles/css/slickgrid-theme-material.lite.css --style=compressed",
"sass-build-task:scss-compile:material-lite": "sass src/styles/slickgrid-theme-material.lite.scss dist/styles/css/slickgrid-theme-material.lite.css --style=compressed --quiet-deps",
"postsass-build-task:scss-compile:material-lite": "postcss --no-map --use autoprefixer --output dist/styles/css/slickgrid-theme-material.lite.css dist/styles/css/slickgrid-theme-material.lite.css --style=compressed",
"sass-build-task:scss-compile:salesforce": "sass src/styles/slickgrid-theme-salesforce.scss dist/styles/css/slickgrid-theme-salesforce.css --style=compressed",
"sass-build-task:scss-compile:salesforce": "sass src/styles/slickgrid-theme-salesforce.scss dist/styles/css/slickgrid-theme-salesforce.css --style=compressed --quiet-deps",
"postsass-build-task:scss-compile:salesforce": "postcss --no-map --use autoprefixer --output dist/styles/css/slickgrid-theme-salesforce.css dist/styles/css/slickgrid-theme-salesforce.css --style=compressed",
"sass-build-task:scss-compile:salesforce-bare": "sass src/styles/slickgrid-theme-salesforce.bare.scss dist/styles/css/slickgrid-theme-salesforce.bare.css --style=compressed",
"sass-build-task:scss-compile:salesforce-bare": "sass src/styles/slickgrid-theme-salesforce.bare.scss dist/styles/css/slickgrid-theme-salesforce.bare.css --style=compressed --quiet-deps",
"postsass-build-task:scss-compile:salesforce-bare": "postcss --no-map --use autoprefixer --output dist/styles/css/slickgrid-theme-salesforce.bare.css dist/styles/css/slickgrid-theme-salesforce.bare.css --style=compressed",
"sass-build-task:scss-compile:salesforce-lite": "sass src/styles/slickgrid-theme-salesforce.lite.scss dist/styles/css/slickgrid-theme-salesforce.lite.css --style=compressed",
"sass-build-task:scss-compile:salesforce-lite": "sass src/styles/slickgrid-theme-salesforce.lite.scss dist/styles/css/slickgrid-theme-salesforce.lite.css --style=compressed --quiet-deps",
"postsass-build-task:scss-compile:salesforce-lite": "postcss --no-map --use autoprefixer --output dist/styles/css/slickgrid-theme-salesforce.lite.css dist/styles/css/slickgrid-theme-salesforce.lite.css --style=compressed",
"sass:build": "run-p sass-build-task:scss-compile:*",
"presass:copy": "cross-env copyfiles -f src/styles/*.png dist/styles/css",
Expand Down Expand Up @@ -86,10 +86,10 @@
"postcss": "^8.2.15",
"postcss-cli": "^8.3.1",
"rimraf": "^3.0.2",
"sass": "~1.32.13"
"sass": "^1.34.0"
},
"engines": {
"node": ">=14.15.0",
"npm": ">=6.14.8"
}
}
}
7 changes: 4 additions & 3 deletions packages/common/src/styles/sass-utilities.scss
View file
@@ -1,3 +1,4 @@
@use 'sass:math';
$svg-icon-vertical-align: bottom !default;

@function encodecolor($string) {
Expand All @@ -10,9 +11,9 @@ $svg-icon-vertical-align: bottom !default;
}

@mixin recolor($color: #000, $opacity: 1) {
$r: red($color) / 255;
$g: green($color) / 255;
$b: blue($color) / 255;
$r: math.div(red($color), 255);
$g: math.div(green($color), 255);
$b: math.div(blue($color), 255);
$a: $opacity;

// grayscale fallback if SVG from data url is not supported
Expand Down
7 changes: 4 additions & 3 deletions packages/common/src/styles/slick.layout.scss
View file
@@ -1,8 +1,9 @@
@use 'sass:math';

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width : 768px) {
@for $i from 1 through 12 {
$width: ($i / 12) * 100%;
$width: math.div($i, 12) * 100%;
.slick-col-medium-#{$i} {
flex-basis: $width;
}
Expand All @@ -12,7 +13,7 @@
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width : 992px) {
@for $i from 1 through 12 {
$width: ($i / 12) * 100%;
$width: math.div($i, 12) * 100%;
.slick-col-large-#{$i} {
flex-basis: $width;
}
Expand All @@ -22,7 +23,7 @@
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
@for $i from 1 through 12 {
$width: ($i / 12) * 100%;
$width: math.div($i, 12) * 100%;
.slick-col-xlarge-#{$i} {
flex-basis: $width;
}
Expand Down
8 changes: 4 additions & 4 deletions yarn.lock
View file
Expand Up @@ -10234,10 +10234,10 @@ sass-loader@^11.1.1:
klona "^2.0.4"
neo-async "^2.6.2"

sass@~1.32.13:
version "1.32.13"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.32.13.tgz#8d29c849e625a415bce71609c7cf95e15f74ed00"
integrity sha512-dEgI9nShraqP7cXQH+lEXVf73WOPCse0QlFzSD8k+1TcOxCMwVXfQlr0jtoluZysQOyJGnfr21dLvYKDJq8HkA==
sass@^1.34.0:
version "1.34.0"
resolved "https://registry.yarnpkg.com/sass/-/sass-1.34.0.tgz#e46d5932d8b0ecc4feb846d861f26a578f7f7172"
integrity sha512-rHEN0BscqjUYuomUEaqq3BMgsXqQfkcMVR7UhscsAVub0/spUrZGBMxQXFS2kfiDsPLZw5yuU9iJEFNC2x38Qw==
dependencies:
chokidar ">=3.0.0 <4.0.0"

Expand Down

0 comments on commit b7317d8

Please sign in to comment.