Merge pull request #3 from ketexon/main

Separated Catppuccin themes
NotNeelPatel · Sep 1, 2024 · 5b8438e · 5b8438e
2 parents ccc8240 + 2653d72
commit 5b8438e
Show file tree

Hide file tree

Showing 3 changed files with 125 additions and 30 deletions.
diff --git a/assets/style.css b/assets/style.css
@@ -53,6 +53,11 @@ hr.body {
     max-width: 75%;
 }
 
+.theme-buttons {
+    max-width: 75%;
+    margin: auto;
+}
+
 button {
     font-family: "Inconsolata", monospace;
     background-color: #333;
@@ -148,4 +153,4 @@ footer {
 
 footer a {
     color: #777
-}
+}
diff --git a/assets/themes.json b/assets/themes.json
@@ -84,29 +84,114 @@
     38,139,210,
     42,161,152,
     133,153,0],
-"Catppuccin":[
-    22,19,32,
-    26,24,38,
-    30,30,46,
-    48,45,65,
-    87,82,104,
-    110,108,126,
-    152,139,162,
-    195,186,198,
-    217,224,238,
-    201,203,255,
-    245,224,220,
-    242,205,205,
-    221,182,242,
-    245,194,231,
-    232,162,175,
-    242,143,173,
-    248,189,150,
-    250,227,176,
-    171,233,179,
-    181,232,224,
-    150,205,251,
-    137,220,235],
+"Catppuccin Latte":[
+    220, 138, 120,
+    221, 120, 120,
+    234, 118, 203,
+    136, 57, 239,
+    210, 15, 57,
+    230, 69, 83,
+    254, 100, 11,
+    223, 142, 29,
+    64, 160, 43,
+    23, 146, 153,
+    4, 165, 229,
+    32, 159, 181,
+    30, 102, 245,
+    114, 135, 253,
+    76, 79, 105,
+    92, 95, 119,
+    108, 111, 133,
+    124, 127, 147,
+    140, 143, 161,
+    156, 160, 176,
+    172, 176, 190,
+    188, 192, 204,
+    204, 208, 218,
+    239, 241, 245,
+    230, 233, 239,
+    220, 224, 232],
+"Catppuccin Frappe":[
+    242, 213, 207,
+    238, 190, 190,
+    244, 184, 228,
+    202, 158, 230,
+    231, 130, 132,
+    234, 153, 156,
+    239, 159, 118,
+    229, 200, 144,
+    166, 209, 137,
+    129, 200, 190,
+    153, 209, 219,
+    133, 193, 220,
+    140, 170, 238,
+    186, 187, 241,
+    198, 208, 245,
+    181, 191, 226,
+    165, 173, 206,
+    148, 156, 187,
+    131, 139, 167,
+    115, 121, 148,
+    98, 104, 128,
+    81, 87, 109,
+    65, 69, 89,
+    48, 52, 70,
+    41, 44, 60,
+    35, 38, 52],
+"Catppuccin Macchiato":[
+    244, 219, 214,
+    240, 198, 198,
+    245, 189, 230,
+    198, 160, 246,
+    237, 135, 150,
+    238, 153, 160,
+    245, 169, 127,
+    238, 212, 159,
+    166, 218, 149,
+    139, 213, 202,
+    145, 215, 227,
+    125, 196, 228,
+    138, 173, 244,
+    183, 189, 248,
+    202, 211, 245,
+    184, 192, 224,
+    165, 173, 203,
+    147, 154, 183,
+    128, 135, 162,
+    110, 115, 141,
+    91, 96, 120,
+    73, 77, 100,
+    54, 58, 79,
+    36, 39, 58,
+    30, 32, 48,
+    24, 25, 38],
+"Catppuccin Mocha":[
+    245, 224, 220,
+    242, 205, 205,
+    245, 194, 231,
+    203, 166, 247,
+    243, 139, 168,
+    235, 160, 172,
+    250, 179, 135,
+    249, 226, 175,
+    166, 227, 161,
+    148, 226, 213,
+    137, 220, 235,
+    116, 199, 236,
+    137, 180, 250,
+    180, 190, 254,
+    205, 214, 244,
+    186, 194, 222,
+    166, 173, 200,
+    147, 153, 178,
+    127, 132, 156,
+    108, 112, 134,
+    88, 91, 112,
+    69, 71, 90,
+    49, 50, 68,
+    30, 30, 46,
+    24, 24, 37,
+    17, 17, 27],
 "Dracula":[
     40,42,54,
     68,71,90,

diff --git a/index.html b/index.html
@@ -40,12 +40,17 @@ <h3 id = "loading">Select a theme</h3>
         </div>
         <hr class="body"/>
 
-        <button class = "theme-button" type="button" onclick="changeTheme('Gruvbox')">Gruvbox</button>
-        <button class = "theme-button" type="button" onclick="changeTheme('Nord')">Nord</button>
-        <button class = "theme-button" type="button" onclick="changeTheme('Solarized')">Solarized</button>
-        <button class = "theme-button" type="button" onclick="changeTheme('Catppuccin')">Catppuccin</button>
-        <button class = "theme-button" type="button" onclick="changeTheme('Dracula')">Dracula</button>
-        <button class = "theme-button" type="button" onclick="changeTheme('Everforest')">Everforest</button>
+        <div class="theme-buttons">
+          <button class = "theme-button" type="button" onclick="changeTheme('Gruvbox')">Gruvbox</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Nord')">Nord</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Solarized')">Solarized</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Catppuccin Latte')">Catppuccin Latte</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Catppuccin Frappe')">Catppuccin Frappe</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Catppuccin Macchiato')">Catppuccin Macchiato</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Catppuccin Mocha')">Catppuccin Mocha</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Dracula')">Dracula</button>
+          <button class = "theme-button" type="button" onclick="changeTheme('Everforest')">Everforest</button>
+        </div>
       <br/>
       <hr class="body"/>