fix(vercel): update variables and classes (#122)

styles/vercel/catppuccin.user.css

@@ -1,20 +1,16 @@
 /* ==UserStyle==
 @name           Vercel Catppuccin
 @namespace      github.com/catppuccin/userstyles/styles/vercel
-@homepageURL	https://github.com/catppuccin/userstyles/tree/main/styles/vercel
 @version        0.0.4
 @description    Soothing pastel theme for Vercel
 @author         Catppuccin
 @updateURL      https://github.com/catppuccin/userstyles/raw/main/styles/vercel/catppuccin.user.css
-@license 		MIT
-
-@preprocessor  less
-@var select flavor "Flavor" ["latte:Latte", "frappe:Frappe", "macchiato:Macchiato", "mocha:Mocha*"]
+@preprocessor   less
+@var select Theme "Theme" ["latte:Latte", "frappe:Frappe", "macchiato:Macchiato", "mocha:Mocha*"]
 ==/UserStyle== */
 @-moz-document domain("vercel.com") {
-
   :root {
-    #catppuccin(@flavor);
+    #catppuccin(@Theme);
   }
 
   @catppuccin: {
@@ -45,7 +41,7 @@
       @base: #eff1f5;
       @mantle: #e6e9ef;
       @crust: #dce0e8;
-    }
+    };
     @frappe: {
       @rosewater: #f2d5cf;
       @flamingo: #eebebe;
@@ -73,7 +69,7 @@
       @base: #303446;
       @mantle: #292c3c;
       @crust: #232634;
-    }
+    };
     @macchiato: {
       @rosewater: #f4dbd6;
       @flamingo: #f0c6c6;
@@ -101,7 +97,7 @@
       @base: #24273a;
       @mantle: #1e2030;
       @crust: #181926;
-    }
+    };
     @mocha: {
       @rosewater: #f5e0dc;
       @flamingo: #f2cdcd;
@@ -129,8 +125,8 @@
       @base: #1e1e2e;
       @mantle: #181825;
       @crust: #11111b;
-    }
-  }
+    };
+  };
 
   #catppuccin(@lookup) {
     @rosewater: @catppuccin[@@lookup][@rosewater];
@@ -175,29 +171,21 @@
     --geist-success: @blue;
     --geist-error: @red;
     --geist-cyan: @teal;
-    --_1psdadq8: @overlay0;
-    --_1psdadq1n: @maroon;
 
-    & when (Theme = "Latte") {
-      div.jsx-138561840.menu > div.item.hover:hover {
-        background-color: var(--accents-2) !important;
-      }
+    --ds-background-100: @base;
+    --ds-background-200: @surface0;
+    --ds-gray-100: @base;
+    --ds-gray-200: @surface0;
+    --ds-gray-300: @surface1;
+    --ds-gray-1000: @text;
+    --ds-gray-900: @subtext0;
+    --ds-gray-800: @subtext1;
 
-      div.jsx-138561840.menu > div.item.active {
-        background-color: transparent !important;
-      }
-    }
+    --ds-red-800: @red;
+    --ds-red-900: lighten(@red, 5%);
 
     svg {
       --geist-stroke: var(--geist-background) !important;
     }
-
-    .button_ghost__sBWMh {
-      --lighten-color: transparent !important;
-    }
-
-    .feedback-input_geist-feedback-input__PxEnJ:hover .feedback-input_feedback-wrapper__mCwSO .feedback-input_placeholder__ZKdJ6 {
-      color: var(--geist-foreground);
-    }
   }
-}
+}