Merge pull request #30 from chrisrhymes/29-import-deprecation-warning

Update @import to @use statements

Author: chrisrhymes

changelog.txt

@@ -1,3 +1,9 @@
+# 1.1.0
+* Update from @import to @use statements for future Sass compatibility
+
+# 1.0.0
+* Upgrade to Bulma v1
+
 # 0.6
 * Upgrade to Bulma 0.9.3
 

docs/docs.css

@@ -1,27 +1,27 @@
 {
-    "name": "bulma-block-list",
-    "version": "1.0.0",
-    "description": "A simple scss package extending Bulma with block style list elements",
-    "homepage": "https://github.com/chrisrhymes/bulma-block-list#readme",
-    "bugs": {
-        "url": "https://github.com/chrisrhymes/bulma-block-list/issues"
-    },
-    "main": "src/block-list.scss",
-    "scripts": {
-        "dev": "sass --load-path=node_modules src/docs.scss docs/docs.css"
-    },
-    "keywords": [
-        "Bulma",
-        "List",
-        "BlockList",
-        "Unordered List"
-    ],
-    "author": "chrisrhymes",
-    "license": "MIT",
-    "dependencies": {
-        "bulma": "^1.0.0"
-    },
-    "devDependencies": {
-        "sass": "^1.75.0"
-    }
+  "name": "bulma-block-list",
+  "version": "1.1.0",
+  "description": "A simple scss package extending Bulma with block style list elements",
+  "homepage": "https://github.com/chrisrhymes/bulma-block-list#readme",
+  "bugs": {
+    "url": "https://github.com/chrisrhymes/bulma-block-list/issues"
+  },
+  "main": "src/block-list.scss",
+  "scripts": {
+    "dev": "sass --load-path=node_modules src/docs.scss docs/docs.css"
+  },
+  "keywords": [
+    "Bulma",
+    "List",
+    "BlockList",
+    "Unordered List"
+  ],
+  "author": "chrisrhymes",
+  "license": "MIT",
+  "dependencies": {
+    "bulma": "^1.0.0"
+  },
+  "devDependencies": {
+    "sass": "^1.75.0"
+  }
 }

docs/docs.css.map

@@ -1,9 +1,9 @@
 @charset "utf-8";
 
-@use "sass:math";
+@use 'sass:math';
 
-@import "bulma/sass/utilities/initial-variables.scss";
-@import "bulma/sass/utilities/derived-variables.scss";
+@use 'bulma/sass/utilities/initial-variables.scss';
+@use 'bulma/sass/utilities/derived-variables.scss';
 
 $block-list-separator: 0.25rem !default;
 $block-list-highlight-width: 5px !default;
@@ -19,7 +19,7 @@ $block-list-highlight-width: 5px !default;
   list-style: none;
 
   li {
-    padding: math.div($gap, 2);
+    padding: math.div(initial-variables.$gap, 2);
     background: var(--bulma-body-background-color);
     margin-bottom: $block-list-separator;
   }
@@ -41,23 +41,23 @@ $block-list-highlight-width: 5px !default;
 
   li.is-small,
   &.is-small > li {
-    font-size: $size-7;
-    padding: math.div($gap, 3);
+    font-size: initial-variables.$size-7;
+    padding: math.div(initial-variables.$gap, 3);
   }
 
   li.is-normal,
   &.is-normal > li {
-    font-size: $size-6;
+    font-size: initial-variables.$size-6;
   }
 
   li.is-large,
   &.is-large > li {
-    font-size: $size-5;
+    font-size: initial-variables.$size-5;
   }
 
   li.has-radius,
   &.has-radius > li {
-    border-radius: $radius;
+    border-radius: initial-variables.$radius;
   }
 
   li.is-highlighted,
@@ -73,7 +73,7 @@ $block-list-highlight-width: 5px !default;
 
   li.is-outlined,
   &.is-outlined > li {
-    @include outlined("light");
+    @include outlined('light');
   }
 
   li.has-icon {
@@ -98,7 +98,7 @@ $block-list-highlight-width: 5px !default;
     }
   }
 
-  @each $name, $pair in $colors {
+  @each $name, $pair in derived-variables.$colors {
     li.is-#{$name},
     &.is-#{$name} > li {
       background: var(--bulma-#{$name});

package.json

@@ -1,5 +1,5 @@
 @charset "utf-8";
 
-@use "bulma/sass";
+@use 'bulma/sass';
 
-@import "block-list";
+@use 'block-list';