Reintroduce/Improve rainbow threads, fixes, nuke dead code (#385)

* missing vars, higher specificity, themed inlines

mod is modifier alpha not solid

* rainbow threads

fix: start cycle on red
fix: cycle past the 6th iteration
fix: don't rely on aria-label (only works on english)
fix: use nth-of-type so divs (spineBorder_) or such don't mess up the cycle

feat: missing vars
feat: use a mixin

note: mauve/6th iteration can pass 0 or 6 to the mixin or just not have the `+ $n` on it. but for readability pass 6

feat: colour the thread spine as a rainbow

note: the rainbow gradient function can have additional computation but (* 0) and (* 1) don't really have a perf impact
```
// @if $index == 0 {$start: 0px; $end: var(--step) }
// @if $index == 1 {$start: var(--step) }
```
see inline comments for further explanation

* nuke dead code

* organization

use frappe instead of mocha for latte dark areas

* singular threads are brand coloured

* drop secondary

* rainbow threads toggleability

by placing `--ctp-rainbow-thread-disabled: ;` in their usercss, users can disable rainbow threads

rainbow thread readme toggle note

Author: Covkie

README.md

@@ -88,6 +88,14 @@
   (prefers-color-scheme: light);
   ```
 
+- Q: **_"Can I disable Rainbow Threads"_**
+- A: Yes, by placing the following in your QuickCSS threads will be the same colour as typical channels. *note: please respect the `space` between the colon and semi-colon*
+  ```css
+  :root {
+    --ctp-rainbow-thread-disabled: ;
+  }
+  ```
+
 ## 💝 Thanks to
 
 - [GlowingUmbreon](https://github.com/glowingumbreon)

src/_theme.scss

@@ -16,20 +16,11 @@
 
 @import "components/variables";
 
-@import "components/icons-bgImg";
-@import "components/icons-imgContent";
-@import "components/icons-svgBg";
-@import "components/icons-svgColor";
+@import "components/icons/bgImg";
+@import "components/icons/imgContent";
+@import "components/icons/svgBg";
+@import "components/icons/svgColor";
 
-// @import "components/buttons";
-
-// @import "components/pages";
-
-// @import "components/navbar";
-// @import "components/sidebar";
-
-// @import "components/chat";
-
-// @import "components/popouts";
+@import "components/sidebar";
 
 @import "components/details";

src/catppuccin-frappe.theme.scss

@@ -17,7 +17,7 @@
 .visual-refresh .theme-dark {
   $brand: $blue;
 
-  @import "components/contrast-dark";
+  @import "components/tweaks/dark";
   @import "theme";
 
   @include theme.highlights("frappe");
@@ -29,6 +29,6 @@
   @import "@catppuccin/palette/scss/latte";
   $brand: $blue;
 
-  @import "components/tweak-light";
+  @import "components/tweaks/light";
   @import "theme";
 }

src/catppuccin-latte.theme.scss

@@ -15,10 +15,10 @@
 .theme-dark,
 .visual-refresh.theme-dark,
 .visual-refresh .theme-dark {
-  @import "@catppuccin/palette/scss/mocha";
+  @import "@catppuccin/palette/scss/frappe";
   $brand: $blue;
 
-  @import "components/contrast-dark";
+  @import "components/tweaks/dark";
   @import "theme";
 }
 
@@ -27,7 +27,7 @@
 .visual-refresh .theme-light {
   $brand: $blue;
 
-  @import "components/tweak-light";
+  @import "components/tweaks/light";
   @import "theme";
 
   @include theme.highlights("latte");

src/catppuccin-macchiato.theme.scss

@@ -17,7 +17,7 @@
 .visual-refresh .theme-dark {
   $brand: $blue;
 
-  @import "components/contrast-dark";
+  @import "components/tweaks/dark";
   @import "theme";
 
   @include theme.highlights("macchiato");
@@ -29,6 +29,6 @@
   @import "@catppuccin/palette/scss/latte";
   $brand: $blue;
 
-  @import "components/tweak-light";
+  @import "components/tweaks/light";
   @import "theme";
 }

src/catppuccin-mocha.theme.scss

@@ -17,7 +17,7 @@
 .visual-refresh .theme-dark {
   $brand: $blue;
 
-  @import "components/contrast-dark";
+  @import "components/tweaks/dark";
   @import "theme";
 
   @include theme.highlights("mocha");
@@ -29,6 +29,6 @@
   @import "@catppuccin/palette/scss/latte";
   $brand: $blue;
 
-  @import "components/tweak-light";
+  @import "components/tweaks/light";
   @import "theme";
 }