Happy to provide further info, but if you update everything you should see the below
VITE v5.4.3 ready in 362 ms
➜ Local: http://127.0.0.1:5173/
➜ press h + enter to show help
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.
More info: https://sass-lang.com/d/mixed-decls
109 │ ┌ .menu-icon {
110 │ │ color: $icon-mini-active-color-white;
111 │ │ }
│ └─── nested rule
... │
113 │ color: $text-color-none-hover-white;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/white-theme.scss 113:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 4:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.
More info: https://sass-lang.com/d/mixed-decls
127 │ ┌ &.activeClass::before {
128 │ │ background-color: $text-active-color-white;
129 │ │ }
│ └─── nested rule
130 │ overflow: hidden;
│ ^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/white-theme.scss 130:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 4:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.
More info: https://sass-lang.com/d/mixed-decls
127 │ ┌ &.activeClass::before {
128 │ │ background-color: $text-active-color-white;
129 │ │ }
│ └─── nested rule
... │
133 │ color: $text-color-none-hover-white;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/white-theme.scss 133:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 4:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.
More info: https://sass-lang.com/d/mixed-decls
106 │ ┌ .menu-icon {
107 │ │ color: $icon-mini-active-color-dark;
108 │ │ }
│ └─── nested rule
... │
110 │ color: $text-color-none-hover-dark;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/dark-theme.scss 110:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 5:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.
More info: https://sass-lang.com/d/mixed-decls
123 │ ┌ &.activeClass::before {
124 │ │ background-color: $text-active-color-dark;
125 │ │ }
│ └─── nested rule
126 │ overflow: hidden;
│ ^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/dark-theme.scss 126:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 5:9 @import
src/App.vue 3:9 root stylesheet
Warning: 4 repetitive deprecation warnings omitted.
Happy to provide further info, but if you update everything you should see the below
VITE v5.4.3 ready in 362 ms
➜ Local: http://127.0.0.1:5173/
➜ press h + enter to show help
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in
& {}.More info: https://sass-lang.com/d/mixed-decls
109 │ ┌ .menu-icon {
110 │ │ color: $icon-mini-active-color-white;
111 │ │ }
│ └─── nested rule
... │
113 │ color: $text-color-none-hover-white;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/white-theme.scss 113:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 4:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in
& {}.More info: https://sass-lang.com/d/mixed-decls
127 │ ┌ &.activeClass::before {
128 │ │ background-color: $text-active-color-white;
129 │ │ }
│ └─── nested rule
130 │ overflow: hidden;
│ ^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/white-theme.scss 130:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 4:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in
& {}.More info: https://sass-lang.com/d/mixed-decls
127 │ ┌ &.activeClass::before {
128 │ │ background-color: $text-active-color-white;
129 │ │ }
│ └─── nested rule
... │
133 │ color: $text-color-none-hover-white;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/white-theme.scss 133:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 4:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in
& {}.More info: https://sass-lang.com/d/mixed-decls
106 │ ┌ .menu-icon {
107 │ │ color: $icon-mini-active-color-dark;
108 │ │ }
│ └─── nested rule
... │
110 │ color: $text-color-none-hover-dark;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/dark-theme.scss 110:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 5:9 @import
src/App.vue 3:9 root stylesheet
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in
& {}.More info: https://sass-lang.com/d/mixed-decls
123 │ ┌ &.activeClass::before {
124 │ │ background-color: $text-active-color-dark;
125 │ │ }
│ └─── nested rule
126 │ overflow: hidden;
│ ^^^^^^^^^^^^^^^^ declaration
╵
node_modules/vue-awesome-sidebar/src/scss/themes/dark-theme.scss 126:7 @import
node_modules/vue-awesome-sidebar/src/scss/vue-awesome-sidebar.scss 5:9 @import
src/App.vue 3:9 root stylesheet
Warning: 4 repetitive deprecation warnings omitted.