From d5d57bff4514f5014f0d2224e8ad0bad021fd2bf Mon Sep 17 00:00:00 2001
From: Ryan Cao <70191398+ryanccn@users.noreply.github.com>
Date: Sun, 23 Jul 2023 12:18:30 +0800
Subject: [PATCH] fix(modrinth): style ad links as accent color

---
 styles/modrinth/catppuccin.user.css | 368 ++++++++++++++--------------
 1 file changed, 186 insertions(+), 182 deletions(-)

diff --git a/styles/modrinth/catppuccin.user.css b/styles/modrinth/catppuccin.user.css
index 2ee504fd30..7cab498e0e 100644
--- a/styles/modrinth/catppuccin.user.css
+++ b/styles/modrinth/catppuccin.user.css
@@ -13,192 +13,196 @@
 @var select darkFlavor "Dark Flavor" ["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 regexp(".*https:\\/\\/modrinth\\.com.*") {
+@-moz-document regexp(".*https:\\/\\/modrinth\\.com.*") {
+  @catppuccin: {
+    @latte: {
+      @rosewater: #dc8a78;
+      @flamingo: #dd7878;
+      @pink: #ea76cb;
+      @mauve: #8839ef;
+      @red: #d20f39;
+      @maroon: #e64553;
+      @peach: #fe640b;
+      @yellow: #df8e1d;
+      @green: #40a02b;
+      @teal: #179299;
+      @sky: #04a5e5;
+      @sapphire: #209fb5;
+      @blue: #1e66f5;
+      @lavender: #7287fd;
+      @text: #4c4f69;
+      @subtext1: #5c5f77;
+      @subtext0: #6c6f85;
+      @overlay2: #7c7f93;
+      @overlay1: #8c8fa1;
+      @overlay0: #9ca0b0;
+      @surface2: #acb0be;
+      @surface1: #bcc0cc;
+      @surface0: #ccd0da;
+      @base: #eff1f5;
+      @mantle: #e6e9ef;
+      @crust: #dce0e8;
+      @shadow: #dbdfef;
+    };
+    @frappe: {
+      @rosewater: #f2d5cf;
+      @flamingo: #eebebe;
+      @pink: #f4b8e4;
+      @mauve: #ca9ee6;
+      @red: #e78284;
+      @maroon: #ea999c;
+      @peach: #ef9f76;
+      @yellow: #e5c890;
+      @green: #a6d189;
+      @teal: #81c8be;
+      @sky: #99d1db;
+      @sapphire: #85c1dc;
+      @blue: #8caaee;
+      @lavender: #babbf1;
+      @text: #c6d0f5;
+      @subtext1: #b5bfe2;
+      @subtext0: #a5adce;
+      @overlay2: #949cbb;
+      @overlay1: #838ba7;
+      @overlay0: #737994;
+      @surface2: #626880;
+      @surface1: #51576d;
+      @surface0: #414559;
+      @base: #303446;
+      @mantle: #292c3c;
+      @crust: #232634;
+      @shadow: #010409;
+    };
+    @macchiato: {
+      @rosewater: #f4dbd6;
+      @flamingo: #f0c6c6;
+      @pink: #f5bde6;
+      @mauve: #c6a0f6;
+      @red: #ed8796;
+      @maroon: #ee99a0;
+      @peach: #f5a97f;
+      @yellow: #eed49f;
+      @green: #a6da95;
+      @teal: #8bd5ca;
+      @sky: #91d7e3;
+      @sapphire: #7dc4e4;
+      @blue: #8aadf4;
+      @lavender: #b7bdf8;
+      @text: #cad3f5;
+      @subtext1: #b8c0e0;
+      @subtext0: #a5adcb;
+      @overlay2: #939ab7;
+      @overlay1: #8087a2;
+      @overlay0: #6e738d;
+      @surface2: #5b6078;
+      @surface1: #494d64;
+      @surface0: #363a4f;
+      @base: #24273a;
+      @mantle: #1e2030;
+      @crust: #181926;
+      @shadow: #010409;
+    };
+    @mocha: {
+      @rosewater: #f5e0dc;
+      @flamingo: #f2cdcd;
+      @pink: #f5c2e7;
+      @mauve: #cba6f7;
+      @red: #f38ba8;
+      @maroon: #eba0ac;
+      @peach: #fab387;
+      @yellow: #f9e2af;
+      @green: #a6e3a1;
+      @teal: #94e2d5;
+      @sky: #89dceb;
+      @sapphire: #74c7ec;
+      @blue: #89b4fa;
+      @lavender: #b4befe;
+      @text: #cdd6f4;
+      @subtext1: #bac2de;
+      @subtext0: #a6adc8;
+      @overlay2: #9399b2;
+      @overlay1: #7f849c;
+      @overlay0: #6c7086;
+      @surface2: #585b70;
+      @surface1: #45475a;
+      @surface0: #313244;
+      @base: #1e1e2e;
+      @mantle: #181825;
+      @crust: #11111b;
+      @shadow: #010409;
+    };
+  };
 
-    @catppuccin: {
-      @latte: {
-        @rosewater: #dc8a78;
-        @flamingo: #dd7878;
-        @pink: #ea76cb;
-        @mauve: #8839ef;
-        @red: #d20f39;
-        @maroon: #e64553;
-        @peach: #fe640b;
-        @yellow: #df8e1d;
-        @green: #40a02b;
-        @teal: #179299;
-        @sky: #04a5e5;
-        @sapphire: #209fb5;
-        @blue: #1e66f5;
-        @lavender: #7287fd;
-        @text: #4c4f69;
-        @subtext1: #5c5f77;
-        @subtext0: #6c6f85;
-        @overlay2: #7c7f93;
-        @overlay1: #8c8fa1;
-        @overlay0: #9ca0b0;
-        @surface2: #acb0be;
-        @surface1: #bcc0cc;
-        @surface0: #ccd0da;
-        @base: #eff1f5;
-        @mantle: #e6e9ef;
-        @crust: #dce0e8;
-        @shadow: #dbdfef;
-      }
-      @frappe: {
-        @rosewater: #f2d5cf;
-        @flamingo: #eebebe;
-        @pink: #f4b8e4;
-        @mauve: #ca9ee6;
-        @red: #e78284;
-        @maroon: #ea999c;
-        @peach: #ef9f76;
-        @yellow: #e5c890;
-        @green: #a6d189;
-        @teal: #81c8be;
-        @sky: #99d1db;
-        @sapphire: #85c1dc;
-        @blue: #8caaee;
-        @lavender: #babbf1;
-        @text: #c6d0f5;
-        @subtext1: #b5bfe2;
-        @subtext0: #a5adce;
-        @overlay2: #949cbb;
-        @overlay1: #838ba7;
-        @overlay0: #737994;
-        @surface2: #626880;
-        @surface1: #51576d;
-        @surface0: #414559;
-        @base: #303446;
-        @mantle: #292c3c;
-        @crust: #232634;
-        @shadow: #010409;
-      }
-      @macchiato: {
-        @rosewater: #f4dbd6;
-        @flamingo: #f0c6c6;
-        @pink: #f5bde6;
-        @mauve: #c6a0f6;
-        @red: #ed8796;
-        @maroon: #ee99a0;
-        @peach: #f5a97f;
-        @yellow: #eed49f;
-        @green: #a6da95;
-        @teal: #8bd5ca;
-        @sky: #91d7e3;
-        @sapphire: #7dc4e4;
-        @blue: #8aadf4;
-        @lavender: #b7bdf8;
-        @text: #cad3f5;
-        @subtext1: #b8c0e0;
-        @subtext0: #a5adcb;
-        @overlay2: #939ab7;
-        @overlay1: #8087a2;
-        @overlay0: #6e738d;
-        @surface2: #5b6078;
-        @surface1: #494d64;
-        @surface0: #363a4f;
-        @base: #24273a;
-        @mantle: #1e2030;
-        @crust: #181926;
-        @shadow: #010409;
-      }
-      @mocha: {
-        @rosewater: #f5e0dc;
-        @flamingo: #f2cdcd;
-        @pink: #f5c2e7;
-        @mauve: #cba6f7;
-        @red: #f38ba8;
-        @maroon: #eba0ac;
-        @peach: #fab387;
-        @yellow: #f9e2af;
-        @green: #a6e3a1;
-        @teal: #94e2d5;
-        @sky: #89dceb;
-        @sapphire: #74c7ec;
-        @blue: #89b4fa;
-        @lavender: #b4befe;
-        @text: #cdd6f4;
-        @subtext1: #bac2de;
-        @subtext0: #a6adc8;
-        @overlay2: #9399b2;
-        @overlay1: #7f849c;
-        @overlay0: #6c7086;
-        @surface2: #585b70;
-        @surface1: #45475a;
-        @surface0: #313244;
-        @base: #1e1e2e;
-        @mantle: #181825;
-        @crust: #11111b;
-        @shadow: #010409;
-      }
-    }
+  .light-mode {
+    #catppuccin(@lightFlavor, @accentColor);
+  }
 
-    .light-mode {
-      #catppuccin(@lightFlavor, @accentColor);
-    }
+  .dark-mode {
+    #catppuccin(@darkFlavor, @accentColor);
+  }
 
-    .dark-mode {
-      #catppuccin(@darkFlavor, @accentColor);
-    }
+  #catppuccin(@lookup, @accent) {
+    @rosewater: @catppuccin[@@lookup][@rosewater];
+    @flamingo: @catppuccin[@@lookup][@flamingo];
+    @pink: @catppuccin[@@lookup][@pink];
+    @mauve: @catppuccin[@@lookup][@mauve];
+    @red: @catppuccin[@@lookup][@red];
+    @maroon: @catppuccin[@@lookup][@maroon];
+    @peach: @catppuccin[@@lookup][@peach];
+    @yellow: @catppuccin[@@lookup][@yellow];
+    @green: @catppuccin[@@lookup][@green];
+    @teal: @catppuccin[@@lookup][@teal];
+    @sky: @catppuccin[@@lookup][@sky];
+    @sapphire: @catppuccin[@@lookup][@sapphire];
+    @blue: @catppuccin[@@lookup][@blue];
+    @lavender: @catppuccin[@@lookup][@lavender];
+    @text: @catppuccin[@@lookup][@text];
+    @subtext1: @catppuccin[@@lookup][@subtext1];
+    @subtext0: @catppuccin[@@lookup][@subtext0];
+    @overlay2: @catppuccin[@@lookup][@overlay2];
+    @overlay1: @catppuccin[@@lookup][@overlay1];
+    @overlay0: @catppuccin[@@lookup][@overlay0];
+    @surface2: @catppuccin[@@lookup][@surface2];
+    @surface1: @catppuccin[@@lookup][@surface1];
+    @surface0: @catppuccin[@@lookup][@surface0];
+    @base: @catppuccin[@@lookup][@base];
+    @mantle: @catppuccin[@@lookup][@mantle];
+    @crust: @catppuccin[@@lookup][@crust];
+    @shadow: @catppuccin[@@lookup][@shadow];
+    @accent-Color: @catppuccin[@@lookup][@@accent];
 
-    #catppuccin(@lookup, @accent) {
-      @rosewater: @catppuccin[@@lookup][@rosewater];
-      @flamingo: @catppuccin[@@lookup][@flamingo];
-      @pink: @catppuccin[@@lookup][@pink];
-      @mauve: @catppuccin[@@lookup][@mauve];
-      @red: @catppuccin[@@lookup][@red];
-      @maroon: @catppuccin[@@lookup][@maroon];
-      @peach: @catppuccin[@@lookup][@peach];
-      @yellow: @catppuccin[@@lookup][@yellow];
-      @green: @catppuccin[@@lookup][@green];
-      @teal: @catppuccin[@@lookup][@teal];
-      @sky: @catppuccin[@@lookup][@sky];
-      @sapphire: @catppuccin[@@lookup][@sapphire];
-      @blue: @catppuccin[@@lookup][@blue];
-      @lavender: @catppuccin[@@lookup][@lavender];
-      @text: @catppuccin[@@lookup][@text];
-      @subtext1: @catppuccin[@@lookup][@subtext1];
-      @subtext0: @catppuccin[@@lookup][@subtext0];
-      @overlay2: @catppuccin[@@lookup][@overlay2];
-      @overlay1: @catppuccin[@@lookup][@overlay1];
-      @overlay0: @catppuccin[@@lookup][@overlay0];
-      @surface2: @catppuccin[@@lookup][@surface2];
-      @surface1: @catppuccin[@@lookup][@surface1];
-      @surface0: @catppuccin[@@lookup][@surface0];
-      @base: @catppuccin[@@lookup][@base];
-      @mantle: @catppuccin[@@lookup][@mantle];
-      @crust: @catppuccin[@@lookup][@crust];
-      @shadow: @catppuccin[@@lookup][@shadow];
-      @accent-Color: @catppuccin[@@lookup][@@accent];
+    & {
+      --color-bg: @crust;
+      --color-ad-raised: @surface2;
+      --color-ad: @surface1;
+      --color-brand-green: @accent-Color;
+      --color-button-bg-active: @overlay0;
+      --color-button-bg-hover: @surface2;
+      --color-button-bg: @surface1;
+      --color-button-text-hover: @text;
+      --color-button-text: @subtext1;
+      --color-divider: @surface0;
+      --color-heading: @yellow;
+      --color-icon: @text;
+      --color-link-active: @teal;
+      --color-link-hover: @sky;
+      --color-link: @sapphire;
+      --color-raised-bg: @base;
+      --color-special-blue: @sapphire;
+      --color-special-orange: @peach;
+      --color-special-purple: @mauve;
+      --color-special-red: @red;
+      --color-text: @subtext1;
+      --color-text-inactive: @overlay1;
+      --color-brand-inverted: @shadow;
+      --color-text-dark: @text;
+      --color-table-alternate-row: @crust;
+      --color-table-border: @overlay0;
+    }
 
-      & {
-        --color-bg: @crust;
-        --color-ad-raised: @surface2;
-        --color-ad: @surface1;
-        --color-brand-green: @accent-Color;
-        --color-button-bg-active: @overlay0;
-        --color-button-bg-hover: @surface2;
-        --color-button-bg: @surface1;
-        --color-button-text-hover: @text;
-        --color-button-text: @subtext1;
-        --color-divider: @surface0;
-        --color-heading: @yellow;
-        --color-icon: @text;
-        --color-link-active: @teal;
-        --color-link-hover: @sky;
-        --color-link: @sapphire;
-        --color-raised-bg: @base;
-        --color-special-blue: @sapphire;
-        --color-special-orange: @peach;
-        --color-special-purple: @mauve;
-        --color-special-red: @red;
-        --color-text: @subtext1;
-        --color-text-inactive: @overlay1;
-        --color-brand-inverted: @shadow;
-        --color-text-dark: @text;
-        --color-table-alternate-row: @crust;
-        --color-table-border: @overlay0;
-      }
+    .BDVE3s9MFQttmbMUeYup-2 a b,
+    .BDVE3s9MFQttmbMUeYup-2 a strong {
+      color: @accent-Color;
     }
   }
+}