Update scss to remove @import rules #2359
Description
Dependency
Overview
I'm seeing some deprecation warning when running the client code in docker. It has to do with the @import rule being deprecated. I made the fix.
Action Items
- make the fix. Transition to using @use rule
-
figure out how to see the deprecation messages when running on localhostit's because of the sass version being used. see comment below about node versions - figure out if this allows us to use a higher sass version and which one is stable.
- make PR ready for review
Resources/Instructions
-
Output of deprecation warnings
click to expand
client-1 | VITE v6.2.5 ready in 311 ms
client-1 |
client-1 | ➜ Local: http://localhost:3000/
client-1 | ➜ Network: http://172.21.0.3:3000/
client-1 | DEPRECATION WARNING [import]: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
client-1 |
client-1 | More info and automated migrator: https://sass-lang.com/d/import
client-1 |
client-1 | ╷
client-1 | 2 │ @import "./reset.scss";
client-1 | │ ^^^^^^^^^^^^^^
client-1 | ╵
client-1 | src/styles/App.scss 2:9 root stylesheet
client-1 |
client-1 | DEPRECATION WARNING [import]: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
client-1 |
client-1 | More info and automated migrator: https://sass-lang.com/d/import
client-1 |
client-1 | ╷
client-1 | 3 │ @import "_variables.scss";
client-1 | │ ^^^^^^^^^^^^^^^^^
client-1 | ╵
client-1 | src/styles/App.scss 3:9 root stylesheet
client-1 |
client-1 | DEPRECATION WARNING [import]: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
client-1 |
client-1 | More info and automated migrator: https://sass-lang.com/d/import
client-1 |
client-1 | ╷
client-1 | 191 │ @import "./AuthForms.scss"; // Login and Register components
client-1 | │ ^^^^^^^^^^^^^^^^^^
client-1 | ╵
client-1 | src/styles/App.scss 191:9 root stylesheet
client-1 |
client-1 | DEPRECATION WARNING [import]: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
client-1 |
client-1 | More info and automated migrator: https://sass-lang.com/d/import
client-1 |
client-1 | ╷
client-1 | 1 │ @import "./_variables_ladot.scss";
client-1 | │ ^^^^^^^^^^^^^^^^^^^^^^^^^
client-1 | ╵
client-1 | src/styles/_variables.scss 1:9 @import
client-1 | src/styles/App.scss 3:9 root stylesheet