Resolve Sass deprecation warnings: color-functions & import (#2289)

* Fix for Sass breaking change: import
https://sass-lang.com/documentation/breaking-changes/import/

* Fix for Sass breaking change: color-functions
https://sass-lang.com/documentation/breaking-changes/color-functions/

Author: tylersticka

src/base/_fonts.scss

@@ -1,11 +1,13 @@
+@use 'sass:meta';
+
 @mixin _non-variable-font-face($name, $path, $parameter) {
   @font-face {
     font-display: swap;
     font-family: $name;
     src: url('../src/assets/fonts/#{$path}/#{$parameter}.woff2') format('woff2'),
       url('../src/assets/fonts/#{$path}/#{$parameter}.woff') format('woff');
 
-    @if type-of($parameter) == 'number' {
+    @if meta.type-of($parameter) == 'number' {
       font-weight: $parameter;
     } @else {
       font-style: $parameter;

src/vendor/highlight/_theme.scss

@@ -45,7 +45,8 @@
 .hljs-type {
   color: sasscolor.change(
     sasscolor.mix(color.$base-fuchsia-lighter, color.$base-orange-light),
-    $saturation: sasscolor.saturation(color.$base-fuchsia-lighter)
+    $saturation:
+      sasscolor.channel(color.$base-fuchsia-lighter, 'saturation', $space: hsl)
   );
 }
 
@@ -55,7 +56,8 @@
 .hljs-selector-pseudo {
   color: sasscolor.change(
     sasscolor.mix(color.$base-green-lighter, color.$base-blue-lighter),
-    $saturation: sasscolor.saturation(color.$base-green-lighter)
+    $saturation:
+      sasscolor.channel(color.$base-green-lighter, 'saturation', $space: hsl)
   );
 }