refactor: moved tree scoped style to new file.

src/components/tree.vue

@@ -78,42 +78,3 @@ export default {
   },
 };
 </script>
-
-<style lang="scss">
-@import './src/css/helper';
-
-.view-tree {
-  @include make-responsive-height();
-  -ms-overflow-style: none;
-  overflow-y: scroll;
-  scrollbar-width: none;
-
-  .q-tree__node-collapsible .q-tree__children {
-    >.q-tree__node--parent {
-      >.q-tree__node-header {
-        background-color: $light;
-        left: 0;
-        position: sticky;
-        top: 0;
-        z-index: 999;
-
-        @media (prefers-color-scheme: dark) {
-          background-color: $grey-9;
-        }
-      }
-    }
-  }
-
-  .q-tree__node-header-content.col.row.no-wrap.items-center {
-    z-index: 99;
-  }
-
-  .q-tree__children {
-    cursor: pointer;
-  }
-}
-
-.view-tree::-webkit-scrollbar {
-  display: none;
-}
-</style>

src/css/style.scss

@@ -3,3 +3,4 @@
 @import './quasar.variables';
 @import './helper';
 @import './global';
+@import './tree';

src/css/tree.scss

+.view-tree {
+  @include make-responsive-height();
+  -ms-overflow-style: none;
+  overflow-y: scroll;
+  scrollbar-width: none;
+
+  .q-tree__node-collapsible .q-tree__children {
+    >.q-tree__node--parent {
+      >.q-tree__node-header {
+        background-color: $light;
+        left: 0;
+        position: sticky;
+        top: 0;
+        z-index: 999;
+
+        @media (prefers-color-scheme: dark) {
+          background-color: $grey-9;
+        }
+      }
+    }
+  }
+
+  .q-tree__node-header-content.col.row.no-wrap.items-center {
+    z-index: 99;
+  }
+
+  .q-tree__children {
+    cursor: pointer;
+  }
+}
+
+.view-tree::-webkit-scrollbar {
+  display: none;
+}