style: update names & color

index.html

@@ -12,10 +12,14 @@
     <link href="/fonts.css?1" rel="stylesheet">
     <style>
       html {
+        --col-accent: blue;
+        --col-background: #fff;
+        --col-foreground: #111;
+
         font-family: 'Urbanist', sans-serif;
         font-size: 18px;
         line-height: 1.75;
-        color: #111111;
+        color: var(--col-foreground);
         font-weight: normal;
       }
 
@@ -27,7 +31,7 @@
 
       body {
         padding: 0.5rem;
-        background-color: white;
+        background-color: var(--col-background);
         display: flex;
         flex-direction: column;
       }
@@ -83,18 +87,24 @@
       a,
       a:visited,
       summary::marker {
-        color: #ff0083;
+        color: var(--col-accent);
       }
 
       summary,
       a { 
         cursor: pointer;
         text-decoration: none;
+
+        transition-property: box-shadow;
+        transition-duration: 0.2s;
+        transition-timing-function: ease;
+
+        box-shadow: 0 0 0 var(--col-accent);
       }
 
       summary:hover,
       a:hover {
-        text-decoration: underline;
+        box-shadow: 0 4px 0 var(--col-accent);
       }
       
       .keywords {
@@ -115,8 +125,8 @@
       }
 
       .keywords > * {
-        background: #ff0083;
+        background: var(--col-accent);
-        color: white;
+        color: var(--col-background);
         padding: 0px 12px;
         border-radius: 16px;
         margin-bottom: 2px;
@@ -135,7 +145,7 @@
     </header>
 
     <p>
-      My name is Ben AKA b12f and I often spend my time engineering software.
+      My names are Ben, Yule, and b12f and I often spend my time engineering software.
     </p>
 
     <p>