chore: Minor design tweaks

src/app.postcss

@@ -17,7 +17,7 @@
     --primary-foreground: 255 20% 15%;
     --secondary: 210 40% 96.1%;
     --secondary-foreground: 222.2 47.4% 11.2%;
-    --muted: 210 40% 96.1%;
+    --muted: 228 24% 96%;
     --muted-foreground: 215.4 16.3% 46.9%;
     --accent: 340 100% 44%;
     --accent-foreground: 210 40% 98%;

src/lib/components/ui/toggle/toggle.svelte

@@ -2,7 +2,7 @@
   import { type VariantProps, tv } from 'tailwind-variants';
 
   export const toggleVariants = tv({
-    base: 'hover:bg-muted hover:text-muted-foreground focus-visible:ring-ring data-[state=on]:bg-primary data-[state=on]:text-primary-foreground inline-flex items-center justify-center gap-1 rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-5 [&_svg]:shrink-0',
+    base: 'hover:bg-muted hover:text-muted-foreground focus-visible:ring-ring data-[state=on]:bg-primary data-[state=on]:text-primary-foreground inline-flex items-center justify-center gap-1 rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0',
     variants: {
       variant: {
         default: 'bg-transparent',

src/lib/util/promos/January2025.svelte

@@ -137,7 +137,7 @@
         in:fade={{ delay: 800 }}
         out:fade={{ duration: 1000 }}>
         <span class="text-sm tracking-wider text-white">{currentTagline.label}</span>
-        <Button size="sm" class="font-semibold tracking-wider">Try now</Button>
+        <Button size="sm" class="bg-background font-semibold tracking-wider">Try now</Button>
       </a>
     {/key}
   </div>

src/routes/edit/+page.svelte

@@ -21,7 +21,7 @@
   import { stateStore, updateCodeStore, urlsStore } from '$/util/state';
   import { initHandler } from '$/util/util';
   import { onMount } from 'svelte';
-  import CodeIcon from '~icons/material-symbols/code-blocks-outline';
+  import CodeIcon from '~icons/custom/code';
   import HistoryIcon from '~icons/material-symbols/history';
   import GearIcon from '~icons/material-symbols/settings-outline-rounded';
 

static/icons/code.svg

@@ -0,0 +1,13 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="terminal">
+<mask id="mask0_13660_101033" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24">
+<rect id="Bounding box" width="24" height="24" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_13660_101033)">
+<g id="terminal_2">
+<path d="M3 21C2.45 21 1.97917 20.8042 1.5875 20.4125C1.19583 20.0208 1 19.55 1 19V5C1 4.45 1.19583 3.97917 1.5875 3.5875C1.97917 3.19583 2.45 3 3 3H21C21.55 3 22.0208 3.19583 22.4125 3.5875C22.8042 3.97917 23 4.45 23 5V19C23 19.55 22.8042 20.0208 22.4125 20.4125C22.0208 20.8042 21.55 21 21 21H3ZM3 19H21V7H3V19ZM16.675 13L14.775 11.1C14.575 10.9 14.4792 10.6667 14.4875 10.4C14.4958 10.1333 14.6 9.9 14.8 9.7C15 9.51667 15.2333 9.42083 15.5 9.4125C15.7667 9.40417 16 9.5 16.2 9.7L18.8 12.3C19 12.5 19.1 12.7333 19.1 13C19.1 13.2667 19 13.5 18.8 13.7L16.2 16.3C16.0167 16.4833 15.7875 16.5792 15.5125 16.5875C15.2375 16.5958 15 16.5 14.8 16.3C14.6167 16.1167 14.525 15.8833 14.525 15.6C14.525 15.3167 14.6167 15.0833 14.8 14.9L16.675 13ZM6 14C5.71667 14 5.47917 13.9042 5.2875 13.7125C5.09583 13.5208 5 13.2833 5 13C5 12.7167 5.09583 12.4792 5.2875 12.2875C5.47917 12.0958 5.71667 12 6 12H8C8.28333 12 8.52083 12.0958 8.7125 12.2875C8.90417 12.4792 9 12.7167 9 13C9 13.2833 8.90417 13.5208 8.7125 13.7125C8.52083 13.9042 8.28333 14 8 14H6Z" fill="#1E1A2E"/>
+<path d="M11 14C10.7167 14 10.4792 13.9042 10.2875 13.7125C10.0958 13.5208 10 13.2833 10 13C10 12.7167 10.0958 12.4792 10.2875 12.2875C10.4792 12.0958 10.7167 12 11 12H13C13.2833 12 13.5208 12.0958 13.7125 12.2875C13.9042 12.4792 14 12.7167 14 13C14 13.2833 13.9042 13.5208 13.7125 13.7125C13.5208 13.9042 13.2833 14 13 14H11Z" fill="#1E1A2E"/>
+</g>
+</g>
+</g>
+</svg>

vite.config.js

@@ -1,4 +1,5 @@
 import { sveltekit } from '@sveltejs/kit/vite';
+import { FileSystemIconLoader } from 'unplugin-icons/loaders';
 import Icons from 'unplugin-icons/vite';
 import { defineConfig } from 'vitest/config';
 
@@ -18,7 +19,10 @@ export default defineConfig({
   plugins: [
     sveltekit(),
     Icons({
-      compiler: 'svelte'
+      compiler: 'svelte',
+      customCollections: {
+        custom: FileSystemIconLoader('./static/icons')
+      }
     }),
     alwaysFullReload
   ],