refactor: prefer use over import in scss

> Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
superhero-com · Dec 26, 2024 · cffbe85 · cffbe85
1 parent 6bcf737
commit cffbe85
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 10 deletions.
diff --git a/src/popup/components/TransactionSpeedPicker.vue b/src/popup/components/TransactionSpeedPicker.vue
@@ -58,7 +58,7 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
-@import '@/styles/typography';
+@use '@/styles/typography';
 
 .transaction-speed-picker {
   margin-top: 4px;

diff --git a/src/styles/fullscreen-message.scss b/src/styles/fullscreen-message.scss
@@ -1,4 +1,4 @@
-@import 'typography';
+@use 'typography';
 
 body {
   &,

diff --git a/src/styles/typography.scss b/src/styles/typography.scss
@@ -1,3 +1,5 @@
+@use 'variables';
+
 @import '~@fontsource/ibm-plex-sans/300.css';
 @import '~@fontsource/ibm-plex-sans/400.css';
 @import '~@fontsource/ibm-plex-sans/400-italic.css';
@@ -6,8 +8,6 @@
 
 @import '~@fontsource/ibm-plex-mono/500.css';
 
-@import 'variables';
-
 /**
  * Sans Serif
  */
@@ -127,42 +127,42 @@
  */
 
 %face-mono-16-medium {
-  font-family: $font-mono;
+  font-family: variables.$font-mono;
   font-weight: 500;
   font-size: 16px;
   line-height: 20px;
 }
 
 %face-mono-15-medium {
-  font-family: $font-mono;
+  font-family: variables.$font-mono;
   font-weight: 500;
   font-size: 15px;
   line-height: 24px;
 }
 
 %face-mono-14-medium {
-  font-family: $font-mono;
+  font-family: variables.$font-mono;
   font-weight: 500;
   font-size: 14px;
   line-height: 16px;
 }
 
 %face-mono-12-medium {
-  font-family: $font-mono;
+  font-family: variables.$font-mono;
   font-weight: 500;
   font-size: 12px;
   line-height: 16px;
 }
 
 %face-mono-11-medium {
-  font-family: $font-mono;
+  font-family: variables.$font-mono;
   font-weight: 500;
   font-size: 11px;
   line-height: 20px;
 }
 
 %face-mono-10-medium {
-  font-family: $font-mono;
+  font-family: variables.$font-mono;
   font-weight: 500;
   font-size: 10px;
   line-height: 16px;