From 7dcf21d61bb40641800e7dc3fad20b88756220c4 Mon Sep 17 00:00:00 2001
From: Pedro Lamas <pedrolamas@gmail.com>
Date: Thu, 7 Dec 2023 00:28:22 +0000
Subject: [PATCH] fix(style): use variables where appropriate

Signed-off-by: Pedro Lamas <pedrolamas@gmail.com>
---
 src/components/common/ManualProbeDialog.vue               | 1 +
 src/components/layout/AppBar.vue                          | 1 +
 src/components/layout/AppNotificationMenu.vue             | 1 +
 src/components/settings/VersionInformationDialog.vue      | 1 +
 src/components/ui/AppBtnGroup.vue                         | 1 +
 src/components/ui/AppCodeView.vue                         | 1 +
 src/components/ui/AppColorPicker.vue                      | 1 +
 src/components/ui/AppNavItem.vue                          | 1 +
 src/components/widgets/filesystem/FileSystemBrowser.vue   | 1 +
 src/components/widgets/job-queue/JobQueueBrowser.vue      | 1 +
 src/components/widgets/thermals/TemperatureTargets.vue    | 1 +
 src/components/widgets/toolhead/ToolheadControlCircle.vue | 1 +
 src/scss/global.scss                                      | 2 +-
 13 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/components/common/ManualProbeDialog.vue b/src/components/common/ManualProbeDialog.vue
index 01d2825d4b..231d05a1d7 100644
--- a/src/components/common/ManualProbeDialog.vue
+++ b/src/components/common/ManualProbeDialog.vue
@@ -187,6 +187,7 @@ export default class ManualProbeDialog extends Mixins(StateMixin, ToolheadMixin)
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   .bysect-row > .col {
diff --git a/src/components/layout/AppBar.vue b/src/components/layout/AppBar.vue
index 1086759dab..49f96548ec 100644
--- a/src/components/layout/AppBar.vue
+++ b/src/components/layout/AppBar.vue
@@ -434,6 +434,7 @@ export default class AppBar extends Mixins(StateMixin, ServicesMixin, FilesMixin
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   .toolbar-logo {
diff --git a/src/components/layout/AppNotificationMenu.vue b/src/components/layout/AppNotificationMenu.vue
index ae21747c22..ef7c5c91b9 100644
--- a/src/components/layout/AppNotificationMenu.vue
+++ b/src/components/layout/AppNotificationMenu.vue
@@ -250,6 +250,7 @@ export default class AppNotificationMenu extends Mixins(BrowserMixin) {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   :deep(.app-notifications .v-list-item__action.notification-suffix),
diff --git a/src/components/settings/VersionInformationDialog.vue b/src/components/settings/VersionInformationDialog.vue
index fde1f430df..7cab0884e7 100644
--- a/src/components/settings/VersionInformationDialog.vue
+++ b/src/components/settings/VersionInformationDialog.vue
@@ -120,6 +120,7 @@ export default class VersionInformationDialog extends Vue {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   ol.commit-history {
diff --git a/src/components/ui/AppBtnGroup.vue b/src/components/ui/AppBtnGroup.vue
index 67b92e26fb..70a16475ef 100644
--- a/src/components/ui/AppBtnGroup.vue
+++ b/src/components/ui/AppBtnGroup.vue
@@ -28,6 +28,7 @@ export default class AppBtnGroup extends Vue {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   @include theme(app-btn-group) using ($material) {
diff --git a/src/components/ui/AppCodeView.vue b/src/components/ui/AppCodeView.vue
index 67f4d06164..05b1d2793d 100644
--- a/src/components/ui/AppCodeView.vue
+++ b/src/components/ui/AppCodeView.vue
@@ -64,6 +64,7 @@ export default class AppCodeView extends Vue {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   .theme--light .code-view {
diff --git a/src/components/ui/AppColorPicker.vue b/src/components/ui/AppColorPicker.vue
index cb68b68eeb..e0bb5c04bd 100644
--- a/src/components/ui/AppColorPicker.vue
+++ b/src/components/ui/AppColorPicker.vue
@@ -336,6 +336,7 @@ export default class AppColorPicker extends Vue {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   .color-input div {
diff --git a/src/components/ui/AppNavItem.vue b/src/components/ui/AppNavItem.vue
index aa4cfa4188..1c7d43943c 100644
--- a/src/components/ui/AppNavItem.vue
+++ b/src/components/ui/AppNavItem.vue
@@ -71,6 +71,7 @@ export default class AppNavItem extends Mixins(StateMixin, BrowserMixin) {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   button {
diff --git a/src/components/widgets/filesystem/FileSystemBrowser.vue b/src/components/widgets/filesystem/FileSystemBrowser.vue
index 619b45c9ea..53a983251c 100644
--- a/src/components/widgets/filesystem/FileSystemBrowser.vue
+++ b/src/components/widgets/filesystem/FileSystemBrowser.vue
@@ -535,6 +535,7 @@ export default class FileSystemBrowser extends Mixins(FilesMixin) {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   // Lighten up dark mode checkboxes.
diff --git a/src/components/widgets/job-queue/JobQueueBrowser.vue b/src/components/widgets/job-queue/JobQueueBrowser.vue
index 96aec92ad9..d2b717d9df 100644
--- a/src/components/widgets/job-queue/JobQueueBrowser.vue
+++ b/src/components/widgets/job-queue/JobQueueBrowser.vue
@@ -121,6 +121,7 @@ export default class JobQueueBrowser extends Mixins(StateMixin) {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   // Lighten up dark mode checkboxes.
diff --git a/src/components/widgets/thermals/TemperatureTargets.vue b/src/components/widgets/thermals/TemperatureTargets.vue
index 8b99a0dc16..4275951f07 100644
--- a/src/components/widgets/thermals/TemperatureTargets.vue
+++ b/src/components/widgets/thermals/TemperatureTargets.vue
@@ -336,6 +336,7 @@ export default class TemperatureTargets extends Mixins(StateMixin) {
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   .theme--light :deep(.v-data-table.temperature-table > .v-data-table__wrapper > table) {
diff --git a/src/components/widgets/toolhead/ToolheadControlCircle.vue b/src/components/widgets/toolhead/ToolheadControlCircle.vue
index d83b275f55..c7cdc0bced 100644
--- a/src/components/widgets/toolhead/ToolheadControlCircle.vue
+++ b/src/components/widgets/toolhead/ToolheadControlCircle.vue
@@ -924,6 +924,7 @@ export default class ToolheadControlCircle extends Mixins(StateMixin, ToolheadMi
 </script>
 
 <style lang="scss" scoped>
+  @import '@/scss/variables';
   @import 'vuetify/src/styles/styles.sass';
 
   @include theme(app-circle-control) using ($material) {
diff --git a/src/scss/global.scss b/src/scss/global.scss
index e81995b79a..425d368d77 100644
--- a/src/scss/global.scss
+++ b/src/scss/global.scss
@@ -1,5 +1,5 @@
-@import 'vuetify/src/styles/styles.sass';
 @import './variables';
+@import 'vuetify/src/styles/styles.sass';
 
 /* Import our fonts */
 @import "@fontsource/roboto/300.css";