fixed sass warning messages using deprecated code

Author: garrettlchow

src/app/styles/components/_actionComponent.scss

@@ -117,7 +117,7 @@
 }
 
 .current-snap {
-  font-weight: 900;
+  font-weight: 800;
   border: none;
   background: transparent;
   font-size: 1rem;

src/app/styles/components/_buttons.scss

@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
-
 .play-button {
   display: flex;
   align-items: center;
@@ -12,7 +10,6 @@
   border: none;
   background-color: #1f2937;
   color: white;
-  font-family: 'Outfit', sans-serif;
   font-size: 14px;
   font-weight: 500;
   cursor: pointer;

src/app/styles/components/_performanceVisx.scss

@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
-
 .saveSeriesContainer {
   display: flex;
   align-items: center;

src/app/styles/components/d3graph.css

@@ -1,4 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
 /* Base node styling */
 .node {
   cursor: pointer;
@@ -40,7 +39,6 @@
 }
 
 .node--internal text {
-  font-family: 'Outfit', sans-serif;
   font-size: 14px;
   font-weight: 500;
   fill: #374151;

src/app/styles/components/diff.css

@@ -1,13 +1,10 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
 .jsondiffpatch-delta {
-  font-family: 'Outfit', sans-serif;
   font-size: 14px;
   margin: 0;
   padding: 0;
   display: inline-block;
 }
 .jsondiffpatch-delta pre {
-  font-family: 'Outfit', sans-serif;
   font-size: 14px;
   margin: 0;
   padding: 0;

src/app/styles/layout/_buttonsContainer.scss

@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
-
 .buttons-container {
   display: flex;
   align-items: center;

src/app/styles/layout/_errorContainer.scss

@@ -1,16 +1,10 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
-* {
-  font-family: 'Outfit', sans-serif;
-}
-
 .error-container {
   height: 100%;
   background-color: #f9fafb;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  font-family: 'Outfit', sans-serif;
 }
 
 .error-logo {

src/app/styles/main.scss

@@ -1,4 +1,23 @@
-@charset 'UTF-8';
+@use 'base/helpers';
+
+@use 'layout/mainContainer';
+@use 'layout/bodyContainer';
+@use 'layout/actionContainer';
+@use 'layout/errorContainer';
+@use 'layout/stateContainer';
+@use 'layout/travelContainer';
+@use 'layout/buttonsContainer';
+
+@use 'components/buttons';
+@use 'components/actionComponent';
+@use 'components/performanceVisx';
+@use 'components/componentMap';
+@use 'components/ax';
+
+@use './components/rc-slider';
+@use './components/d3graph';
+@use './components/diff';
+
 @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');
 
 * {
@@ -17,18 +36,3 @@ body {
   padding: 0;
   height: 100%;
 }
-
-@import 'base/helpers';
-
-@import 'layout/mainContainer', 'layout/bodyContainer', 'layout/actionContainer',
-  'layout/errorContainer', 'layout/stateContainer', 'layout/travelContainer',
-  'layout/buttonsContainer';
-
-@import 'components/buttons', 'components/actionComponent', 'components/performanceVisx',
-  'components/componentMap', 'components/ax';
-
-@import './components/rc-slider';
-
-@import './components/d3graph';
-
-@import './components/diff';