#23 Updated the colour of the send button

src/app.html

@@ -85,16 +85,6 @@
 				color: var(--header);
 			}
 
-			.button {
-				color: var(--fg);
-				background-color: var(--accent);
-				transition: all 0.2s;
-			}
-
-			.button:hover {
-				box-shadow: .3em .3em .3em var(--header);    
-			}
-
 			.container {
 				max-width: 90%;
 				margin: auto;

src/lib/components/Cards/Card.svelte

@@ -23,8 +23,9 @@
         box-shadow: .25em .25em .5em var(--hover);
     }
 
-    .card:hover {
+    .card:hover, .card:focus-within {
         box-shadow: .5em .5em .5em var(--hover);
+        transform: scale(1.02);
     }
 
     .card .card-header :global(div) {

src/routes/contact/+page.svelte

@@ -21,6 +21,7 @@
         flex-wrap: wrap;
         flex: 2 1;
         align-items: center;
+        justify-content: center;
         margin: 1em;
         gap: 1em 3em;
     }
@@ -38,6 +39,16 @@
         font-size: .8em;
     }
 
+    .button {
+        background-color: var(--fg);
+        color: var(--bg);
+        transition: all 0.2s ease-in-out;
+    }
+
+    .button:hover {
+        transform: scale(1.01);
+    }
+
     textarea {
         min-height: 12em;
     }

static/themes/stormy-blue.css

@@ -1,18 +0,0 @@
-:root {
-    --bg: #1e2426; /* Dark blue-grey */
-    --bg-secondary: #283033; /* Deep slate */
-    --accent: #7c9197; /* Muted blue-grey */
-
-    --header: #a4b3b7; /* Softer light blue-grey */
-    --fg: #d2d9dc; /* Pale blue-grey for readability */
-    
-    --input: #323a3d; /* Dark neutral input background */
-    
-    --link: #85a1a8; /* Muted cool teal */
-    --glow: #627277; /* Soft cool-toned glow */
-    --hover: #95b2b8; /* Pastel blue-grey hover */
-
-    --green: #79a48c; /* Muted forest green */
-    --red: #d18088; /* Soft warm red */
-    --blue: #789fa7; /* Medium desaturated blue */
-}