Styling reorganization

scss/colors.scss

@@ -0,0 +1,16 @@
+.path-local-treestudyplan, .features-treestudyplan
+ {
+    /* we can override these colors in the :root field if needed */
+    --less-light: color-mix(in srgb, var(--light) 80%, #ccc);
+    --highlight-mix: 10%;
+    --highlight: var(--info);
+    --past: var(--purple);
+    --present: var(--blue);
+    --future: var(--gray);
+    --coursecat-list: var(--blue);
+    --course-list: var(--green);
+    --excellent: var(--blue);
+    --pending: var(--gray);
+    --incomplete: var(--gray);
+ 
+}

scss/generic.scss

@@ -0,0 +1,15 @@
+.path-local-treestudyplan {
+    div.tab-pane:target {
+        margin-top: 0px;
+    }
+
+    [v-cloak] {
+        visibility: hidden;
+    }
+
+    .vue-loader {
+        width: 32px;
+        margin: auto;
+    }
+
+}

scss/invitemanager.scss

@@ -1,21 +1,3 @@
-/* stylelint-disable length-zero-no-unit, color-hex-case, color-hex-length*/
-
-.path-local-treestudyplan {
-    div.tab-pane:target {
-        margin-top: 0px;
-    }
-
-    [v-cloak] {
-        visibility: hidden;
-    }
-
-    .vue-loader {
-        width: 32px;
-        margin: auto;
-    }
-
-}
-
 /*******************
 *
 * Invite manager

scss/readme-moodle.txt

@@ -0,0 +1,20 @@
+The amount of css rules required for this plugin is quite high. To accomodate the 
+moodle plugin practice of plugin specific css selectors, this makes the css rules 
+quite hard to maintain.
+
+Unfortunately, moodle does not extend the sass/scss compiler support to plugins
+that are not a theme.
+
+To alleviate this, this plugin includes it's own scss compiler script that compiles
+all scss files in this directory into one css file - css/devstyles.css
+
+This files is used instead of styles.css in order to avoid having to clear the theme
+cache every time a style rule is changed during development.
+
+Once I devise a method to use styles.css in production environtments and css/devstyles.css
+production environments, the compiler will compile it into both css/devstyles.css 
+and styles.css
+
+Call the plugin's scss compiler by running scssbuild.sh in the plugin's root.
+
+

scss/studyplan.scss

@@ -1,19 +1,6 @@
-/* stylelint-disable length-zero-no-unit, color-hex-case, color-hex-length, no-eol-whitespace, unit-blacklist, block-no-empty */
 
-.path-local-treestudyplan, .block_mytreestudyplan
+.path-local-treestudyplan, .features-treestudyplan
  {
-    /* we can override these colors in the :root field if needed */
-    --less-light: color-mix(in srgb, var(--light) 80%, #ccc);
-    --highlight-mix: 10%;
-    --highlight: var(--info);
-    --past: var(--purple);
-    --present: var(--blue);
-    --future: var(--gray);
-    --coursecat-list: var(--blue);
-    --course-list: var(--green);
-    --excellent: var(--blue);
-    --pending: var(--gray);
-    --incomplete: var(--gray);
 
     .t-toolbox-preface {
         margin: 10px;