Add the Solarized theme.

source/scss/style.scss

@@ -3,6 +3,7 @@
 
 // Theme definitions
 @use 'themes/love';
+@use 'themes/solarized';
 
 // Component styling
 @use 'components/search-bar';

source/scss/themes/_solarized.scss

@@ -0,0 +1,15 @@
+.solarized-dark {
+  --border-radius: 8px;
+  --foreground-1: #839496;
+  --foreground-2: #93a1a1;
+  --background-1: #002b36;
+  --background-2: #073642;
+}
+
+.solarized-light {
+  --border-radius: 8px;
+  --foreground-1: #657b83;
+  --foreground-2: #586e75;
+  --background-1: #fdf6e3;
+  --background-2: #eee8d5;
+}

source/ts/utilities/themes.ts

@@ -14,6 +14,14 @@ export const themes: Theme[] = [
     cssClass: 'love-light',
     name: 'Love Light',
   },
+  {
+    cssClass: 'solarized-dark',
+    name: 'Solarized Dark',
+  },
+  {
+    cssClass: 'solarized-light',
+    name: 'Solarized Light',
+  },
 ];
 
 export const themeContext = createContext<Theme>(themes[0]);