fix: add auto colouring & allows functioning on newer libreddit platforms (#108)

styles/libreddit/catppuccin.user.css

@@ -1,12 +1,14 @@
 /* ==UserStyle==
 @name           Libreddit Catppuccin
 @namespace      github.com/catppuccin/userstyles/styles/libreddit
-@version        2.0.3
+@version        2.0.4
 @description    Soothing pastel theme for Libreddit
 @author         Catppuccin
 @updateURL      https://github.com/catppuccin/userstyles/raw/main/styles/libreddit/catppuccin.user.css
+
 @preprocessor less
-@var select Theme "Theme" ["latte:Latte", "frappe:Frappe", "macchiato:Macchiato", "mocha:Mocha*"]
+@var select lightTheme "Light Theme" ["latte:Latte*", "frappe:Frappe", "macchiato:Macchiato", "mocha:Mocha"]
+@var select darkTheme "Dark Theme" ["latte:Latte", "frappe:Frappe", "macchiato:Macchiato", "mocha:Mocha*"]
 @var select accentColor  "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve", "red:Red*", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
 ==/UserStyle== */
 @-moz-document domain("libredd.it"),
@@ -186,8 +188,14 @@ domain("l.opnxng.com") {
   }
 
   .light,
+  .gruvboxlight {
+    #catppuccin(@lightTheme, @accentColor);
+  }
+
   .dark,
   .black,
+  .doomone,
+  .gruvboxdark,
   .dracula,
   .gold,
   .laserwave,
@@ -195,7 +203,7 @@ domain("l.opnxng.com") {
   .rosebox,
   .violet,
   :root {
-    #catppuccin(@Theme, @accentColor);
+    #catppuccin(@darkTheme, @accentColor);
   }
 
   #catppuccin(@lookup, @accent) {
@@ -225,23 +233,23 @@ domain("l.opnxng.com") {
     @base: @catppuccin[@@lookup][@base];
     @mantle: @catppuccin[@@lookup][@mantle];
     @crust: @catppuccin[@@lookup][@crust];
-    @accent-Color: @catppuccin[@@lookup][@@accent];
+    @accent-color: @catppuccin[@@lookup][@@accent];
 
     & {
-      --accent: @accent-Color;
-      --green: @green;
-      --text: @text;
-      --foreground: @crust;
-      --background: @base;
-      --outside: @mantle;
-      --post: @mantle;
-      --panel-border: none;
-      --highlighted: @surface0;
-      --visited: @overlay0;
-      --shadow: 0 5px 15px 0 transparent;
+      --accent: @accent-color !important;
+      --green: @green !important;
+      --text: @text !important;
+      --foreground: @crust !important;
+      --background: @base !important;
+      --outside: @mantle !important;
+      --post: @mantle !important;
+      --panel-border: none !important;
+      --highlighted: @surface0 !important;
+      --visited: @overlay0 !important;
+      --shadow: 0 5px 15px 0 transparent !important;
 
-      --nsfw: @peach;
-      --admin: @maroon;
+      --nsfw: @peach !important;
+      --admin: @maroon !important;
     }
   }
 }