refactor(site): migrate site SCSS from @import to @use

Replace @import with @use ... as * in site style files. The site
_variables.scss uses @forward to re-export component variables to
downstream files.

Author: wangdicoder

site/src/_variables.scss

@@ -1,4 +1,4 @@
-@import "../../components/style/variables";
+@forward "../../components/style/variables";
 
 $main-color: #6E41BF;
 $header-height: 60px;

site/src/components/code-block/code-block.scss

@@ -1,4 +1,4 @@
-@import '../../variables';
+@use '../../variables' as *;
 
 .code-block {
   &__container {

site/src/components/doc-footer/component-page.scss

@@ -1,4 +1,4 @@
-@import '../../variables';
+@use '../../variables' as *;
 
 .component-page {
   min-height: calc(100vh - #{$header-height});

site/src/components/feature-block/feature-block.scss

@@ -1,4 +1,4 @@
-@import '../../variables';
+@use '../../variables' as *;
 
 @keyframes fadeInUp {
   from {

site/src/components/header/header.scss

@@ -1,4 +1,4 @@
-@import '../../variables';
+@use '../../variables' as *;
 
 .header {
   position: fixed;

site/src/components/markdown-tag/md-tag.scss

@@ -1,4 +1,4 @@
-@import '../../variables';
+@use '../../variables' as *;
 
 .markdown {
   &__layout {

site/src/components/sidebar-menu/sidebar-menu.scss

@@ -1,4 +1,4 @@
-@import '../../variables';
+@use '../../variables' as *;
 
 .sidebar-menu {
   width: 250px;

site/src/containers/home/home.scss

@@ -1,4 +1,4 @@
-@import '../../variables';
+@use '../../variables' as *;
 
 @keyframes fadeInUp {
   from {

site/src/index.scss

@@ -1,4 +1,4 @@
-@import './variables';
+@use './variables' as *;
 
 body {
   margin: 0;