From 9c49207891dcd8b9b4249a5377750b4a0ec2fcc1 Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Sun, 3 May 2026 15:44:14 +0700
Subject: feat: overhaul sidebar feat: attach desktop content to sidebar,
 leaving only right space open feat: update sidebar info on home page

---
 static/favicon-dark.svg  |  7 +------
 static/favicon-light.svg |  7 +------
 static/input.css         | 26 ++++++++++++++++++++++++++
 3 files changed, 28 insertions(+), 12 deletions(-)

(limited to 'static')

diff --git a/static/favicon-dark.svg b/static/favicon-dark.svg
index f09a1bf..a7820cb 100644
--- a/static/favicon-dark.svg
+++ b/static/favicon-dark.svg
@@ -6,11 +6,6 @@
     <linearGradient gradientTransform="rotate(150, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="gradient">
       <stop stop-color="hsl(31.4, 100%, 70.8%)" stop-opacity="1" offset="0%"></stop><stop stop-color="hsl(17, 100%, 31%)" stop-opacity="1" offset="100%"></stop>
     </linearGradient>
-    <filter id="filter" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-      <feTurbulence type="fractalNoise" baseFrequency="0.005 0.003" numOctaves="1" seed="2" stitchTiles="stitch" x="0%" y="0%" width="100%" height="100%" result="turbulence"></feTurbulence>
-      <feGaussianBlur stdDeviation="20 0" x="0%" y="0%" width="100%" height="100%" in="turbulence" edgeMode="duplicate" result="blur"></feGaussianBlur>
-      <feBlend mode="color-dodge" x="0%" y="0%" width="100%" height="100%" in="SourceGraphic" in2="blur" result="blend"></feBlend>
-    </filter>
   </defs>
-  <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" filter="url(#filter)" stroke-width="5"></path>
+  <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" stroke-width="5"></path>
 </svg>
diff --git a/static/favicon-light.svg b/static/favicon-light.svg
index e7ed6eb..078f874 100644
--- a/static/favicon-light.svg
+++ b/static/favicon-light.svg
@@ -6,11 +6,6 @@
     <linearGradient gradientTransform="rotate(150, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="gradient">
       <stop stop-color="hsl(30.1, 100%, 44.1%)" stop-opacity="1" offset="0%"></stop><stop stop-color="hsl(23.1, 90.7%, 25.3%)" stop-opacity="1" offset="100%"></stop>
     </linearGradient>
-    <filter id="filter" x="-20%" y="-20%" width="140%" height="140%" filterUnits="objectBoundingBox" primitiveUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-      <feTurbulence type="fractalNoise" baseFrequency="0.005 0.003" numOctaves="1" seed="2" stitchTiles="stitch" x="0%" y="0%" width="100%" height="100%" result="turbulence"></feTurbulence>
-      <feGaussianBlur stdDeviation="20 0" x="0%" y="0%" width="100%" height="100%" in="turbulence" edgeMode="duplicate" result="blur"></feGaussianBlur>
-      <feBlend mode="color-dodge" x="0%" y="0%" width="100%" height="100%" in="SourceGraphic" in2="blur" result="blend"></feBlend>
-    </filter>
   </defs>
-  <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" filter="url(#filter)" stroke-width="5"></path>
+  <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" stroke-width="5"></path>
 </svg>
diff --git a/static/input.css b/static/input.css
index 5d8de42..04d68b7 100644
--- a/static/input.css
+++ b/static/input.css
@@ -5,9 +5,11 @@
     --font-m-plus: "M PLUS Rounded 1c", sans-serif;
     --font-gentium: "Gentium Plus", serif;
     --breakpoint-xs: 32rem;
+    --color-main: var(--color-main);
     --color-main-hard: var(--color-main-hard);
     --color-main-medium: var(--color-main-medium);
     --color-main-soft: var(--color-main-soft);
+    --color-background: var(--color-background);
     --color-background-dark: var(--color-background-dark);
     --color-background-medium: var(--color-background-medium);
     --color-background-light: var(--color-background-light);
@@ -20,6 +22,20 @@
     --color-main-dark-hard: var(--color-main-dark-hard);
     --color-main-dark-medium: var(--color-main-dark-medium);
     --color-main-dark-soft: var(--color-main-dark-soft);
+    --shadow-elevation-flat: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
+    --shadow-elevation-0: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-1: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-2: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-3: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-4: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-5: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-6: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-7: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-8: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-9: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-10: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-11: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
+    --shadow-elevation-12: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
 }
 
 html {
@@ -102,9 +118,11 @@ body {
     --color-main-light-soft: #ffffdd;
     --color-main-light-medium: var(--color-main-light-soft);
     --color-main-light-hard: #fffff0;
+    --color-main: var(--color-main-dark-hard);
     --color-main-hard: var(--color-main-dark-hard);
     --color-main-medium: var(--color-main-dark-medium);
     --color-main-soft: var(--color-main-dark-soft);
+    --color-background: var(--color-main-light-hard);
     --color-background-dark: var(--color-main-light-soft);
     --color-background-medium: var(--color-main-light-medium);
     --color-background-light: var(--color-main-light-hard);
@@ -132,9 +150,11 @@ body {
     --color-main-light-soft: #f5eee2;
     --color-main-light-medium: var(--color-main-light-soft);
     --color-main-light-hard: #fff9ef;
+    --color-main: var(--color-main-dark-hard);
     --color-main-hard: var(--color-main-dark-hard);
     --color-main-medium: var(--color-main-dark-medium);
     --color-main-soft: var(--color-main-dark-soft);
+    --color-background: var(--color-main-light-hard);
     --color-background-dark: var(--color-main-light-soft);
     --color-background-medium: var(--color-main-light-medium);
     --color-background-light: var(--color-main-light-hard);
@@ -164,9 +184,11 @@ body {
     --color-main-dark-hard: #13131b;
     --color-main-dark-medium: var(--color-main-dark-hard);
     --color-main-dark-soft: #222230;
+    --color-main: var(--color-main-light-hard);
     --color-main-hard: var(--color-main-light-hard);
     --color-main-medium: var(--color-main-light-medium);
     --color-main-soft: var(--color-main-light-soft);
+    --color-background: var(--color-main-dark-soft);
     --color-background-dark: var(--color-main-dark-hard);
     --color-background-medium: var(--color-main-dark-medium);
     --color-background-light: var(--color-main-dark-soft);
@@ -231,9 +253,11 @@ body {
     --color-main-dark-hard: #413b34;
     --color-main-dark-medium: #62584f;
     --color-main-dark-soft: #6d6258;
+    --color-main: var(--color-main-light-hard);
     --color-main-hard: var(--color-main-light-hard);
     --color-main-medium: var(--color-main-light-medium);
     --color-main-soft: var(--color-main-light-soft);
+    --color-background: var(--color-main-dark-soft);
     --color-background-dark: var(--color-main-dark-hard);
     --color-background-medium: var(--color-main-dark-medium);
     --color-background-light: var(--color-main-dark-soft);
@@ -261,9 +285,11 @@ body {
     --color-main-light-hard: #e3e6ff;
     --color-main-light-medium: #d1d6ff;
     --color-main-light-soft: #c3caff;
+    --color-main: var(--color-main-dark-hard);
     --color-main-hard: var(--color-main-dark-hard);
     --color-main-medium: var(--color-main-dark-medium);
     --color-main-soft: var(--color-main-dark-soft);
+    --color-background: var(--color-main-light-hard);
     --color-background-dark: var(--color-main-light-soft);
     --color-background-medium: var(--color-main-light-medium);
     --color-background-light: var(--color-main-light-hard);
-- 
cgit v1.3.1+13


From 18cae75392970179701f00b3356a82f40fc0989f Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Sun, 3 May 2026 15:54:01 +0700
Subject: feat: make favicon for dark theme lighter

---
 static/favicon-dark.svg | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'static')

diff --git a/static/favicon-dark.svg b/static/favicon-dark.svg
index a7820cb..65e31d5 100644
--- a/static/favicon-dark.svg
+++ b/static/favicon-dark.svg
@@ -4,7 +4,7 @@
   </desc>
   <defs>
     <linearGradient gradientTransform="rotate(150, 0.5, 0.5)" x1="50%" y1="0%" x2="50%" y2="100%" id="gradient">
-      <stop stop-color="hsl(31.4, 100%, 70.8%)" stop-opacity="1" offset="0%"></stop><stop stop-color="hsl(17, 100%, 31%)" stop-opacity="1" offset="100%"></stop>
+      <stop stop-color="oklch(83.7% 0.128 66.29)" stop-opacity="1" offset="0%"></stop><stop stop-color="#fefad8" stop-opacity="1" offset="100%"></stop>
     </linearGradient>
   </defs>
   <path d="m106.155 94.45 0.005 -0.01c-6.465 16.215 -26.09 26.16 -47.235 25.525C26.5 119.965 0 92.4 0 59.53S26.38 0.005 58.925 0.005c8.965 0 17.465 2.03 25.075 5.65 0.405 -0.885 1.355 -2.72 2.255 -2.785 1.19 -0.085 1.87 0.685 2.63 1.545 0.77 0.86 2.3 2.145 2.3 2.145s6.965 -2.405 14.775 1.885c7.815 4.29 8.915 5.58 10.45 8.58 0.76 1.505 0.975 4.145 1 6.41a3.98 3.98 0 0 0 -0.35 -0.015c-2.48 0 -4.8 2.275 -4.8 5.4 0 1.315 0.41 2.48 1.075 3.39l-0.05 0.035a7.525 7.525 0 0 0 -0.66 0.05 93.52 93.52 0 0 0 -1.945 -0.71 12.65 12.65 0 0 1 -4.1 -2.36 7.01 7.01 0 0 0 -5.98 -10.56c-1.915 0 -3.65 0.78 -4.91 2.05 -2.36 -1.355 -5.87 -2.41 -12.635 -2.825l-2.035 -0.055c-11.41 0.06 -18.055 1.395 -29.895 6.505 -3.015 1.415 -6.03 3.075 -8.925 5.005 -2.115 1.5 -3.195 3.35 -3.545 5.685a6.63 6.63 0 0 0 6.15 6.865h0.210c6.35 0.3 10.195 9.95 10.315 12.485 0.02 0.25 0.02 0.115 0.015 0.4 -0.16 3.635 -1.85 6.335 -5.44 6.23a6.155 6.155 0 0 1 -4.88 -2.47c-0.315 -0.385 -0.515 -0.86 -0.795 -1.27 -3.33 -5.405 -8.66 -6.80 -13.855 -7.615 -2.19 -0.34 -5.365 -0.61 -6.55 1.25a41.4 41.4 0 0 0 -2.885 15.315c-0.1 25.18 20.205 45.59 45.13 45.59 12.875 0 26.745 -4.76 34.965 -13.5l-0.175 0.15c-8.86 7.365 -23.3 9.705 -30.135 9.705 -21.51 0 -39.09 -16.16 -39.09 -37.89 0 -6.38 1.44 -11.98 4.07 -16.8 2.475 0.915 4.735 2.415 6.4 5.11a1.2 1.2 0 0 0 0.065 0.1050c0.32 0.46 0.555 0.985 0.91 1.42 2.12 2.62 4.405 3.29 6.71 3.4h0.05c2.15 0.065 3.84 -0.6 5.12 -1.71 1.735 -1.5 2.75 -3.95 2.885 -6.91v-0.07c0.01 -0.425 0 -0.265 -0.02 -0.56 -0.12 -1.88 -1.665 -6.59 -4.53 -10.135 -1.33 -1.655 -2.935 -3.035 -4.75 -3.87l0.6 -0.37c3.78 -2.285 11.82 -4.885 22.96 -3.19 5.65 0.865 10.275 2.095 17.415 4.395 8.285 2.67 12.895 6.395 19.27 7.135 0.75 0.085 1.505 0.09 2.25 0.015 2.05 5.645 3.17 11.75 3.17 18.105 0 10.34 -2.95 19.975 -8.055 28.1zm9.735 -61.37s-0.575 1.005 -1.82 1.61c-0.515 0.25 -1.41 -0.375 -2.25 0.5 -1.795 3.63 2.58 6.66 4.615 6.575 2.04 -0.085 3.65 -2.16 3.56 -3.965 -0.085 -2.79 -4.1 -4.72 -4.1 -4.72zm1.17 -7.16c1.275 0 2.31 1.3 2.31 2.9 0 1.6 -1.035 2.9 -2.31 2.9 -1.27 0 -2.3 -1.3 -2.3 -2.9 0 -1.6 1.03 -2.9 2.3 -2.9zm-16.46 -4.755c2.46 0 4.45 2.015 4.45 4.5a4.475 4.475 0 0 1 -4.45 4.49 4.475 4.475 0 0 1 -4.45 -4.495c0 -2.48 1.995 -4.495 4.45 -4.495z" fill="url(#gradient)" stroke-width="5"></path>
-- 
cgit v1.3.1+13


From bc52b4ea0efca1a444310f1750bff0542abf8102 Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Sun, 3 May 2026 16:20:00 +0700
Subject: feat: accent button active property refactor: combine sidebar
 buttons' properties in accent-button class

---
 static/input.css                | 38 ++++++++++++++++++++++++++++++++++++++
 views/layouts/general-page.html | 38 ++++++++++++++++++++------------------
 views/pages/global-map.html     | 24 ++++++------------------
 3 files changed, 64 insertions(+), 36 deletions(-)

(limited to 'static')

diff --git a/static/input.css b/static/input.css
index 04d68b7..b9fb166 100644
--- a/static/input.css
+++ b/static/input.css
@@ -568,6 +568,44 @@ form.crossable.htmx-request input {
     --border-size: 0.2rem;
 }
 
+.accent-button,
+.accent-button.active:active {
+    --tw-duration: 1500ms;
+    --tw-ease: var(--ease-in-out);
+    --tw-gradient-from: color-mix(in oklab, var(--color-accent-light) 10%, transparent);
+    --tw-gradient-position: from 225deg in oklab;
+    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+    --tw-gradient-to: color-mix(in oklab, var(--color-accent-light) 10%, transparent);
+    --tw-gradient-via: transparent;
+    --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
+    background-image: conic-gradient(var(--tw-gradient-stops));
+    transition-duration: 1500ms;
+    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+    transition-timing-function: var(--ease-in-out);
+}
+
+.accent-button:hover,
+.accent-button.active:active:hover {
+    cursor: pointer;
+    --tw-gradient-from: color-mix(in oklab, var(--color-accent-light) 50%, transparent);
+    --tw-gradient-to: color-mix(in oklab, var(--color-accent-light) 50%, transparent);
+}
+
+.accent-button.active,
+.accent-button:active {
+    --tw-gradient-from: color-mix(in oklab, var(--color-accent-dark) 30%, transparent);
+    --tw-gradient-position: from 45deg in oklab;
+    --tw-gradient-to: color-mix(in oklab, var(--color-accent-dark) 30%, transparent);
+    --tw-gradient-via: color-mix(in oklab, var(--color-accent-light) 50%, transparent);
+}
+
+.accent-button.active:hover,
+.accent-button:active:hover {
+    --tw-gradient-from: color-mix(in oklab, var(--color-accent-light) 70%, transparent);
+    --tw-gradient-to: color-mix(in oklab, var(--color-accent-light) 70%, transparent);
+    --tw-gradient-via: color-mix(in oklab, var(--color-accent-dark) 50%, transparent);
+}
+
 .custom-svg-marker {
     background: transparent;
     border: none;
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index b435402..848c786 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -346,9 +346,7 @@
                 class="flex flex-row w-full h-24 md:flex-col md:w-24 md:h-full bg-paper bg-background shadow-elevation-6 z-2 shrink-0"
             >
                 <a
-                    class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                        from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                        hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                    class="w-18 h-18 rounded-xl m-3 accent-button"
                     onclick="return changeUrl('/..', true);"
                     href="../"
                     id="sidebar-back-button"
@@ -357,9 +355,7 @@
                     <svg viewBox="0 0 24 24"><use href="#icon-back"/></svg>
                 </a>
                 <a
-                    class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                        from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                        hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                    class="w-18 h-18 rounded-xl m-3 accent-button"
                     onclick="return changeUrl('/{{ .Lang }}');"
                     href="/{{ .Lang }}"
                     id="sidebar-home-button"
@@ -368,9 +364,7 @@
                     <svg viewBox="0 0 24 24"><use href="#icon-logo"/></svg>
                 </a>
                 <a
-                    class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                        from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                        hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                    class="w-18 h-18 rounded-xl m-3 accent-button"
                     onclick="return changeUrl('/{{ .Lang }}/blog');"
                     href="/{{ .Lang }}/blog"
                     id="sidebar-blog-button"
@@ -379,9 +373,7 @@
                     <svg viewBox="0 0 24 24"><use href="#icon-newspaper"/></svg>
                 </a>
                 <a
-                    class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                        from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                        hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                    class="w-18 h-18 rounded-xl m-3 accent-button"
                     href="/{{ .Lang }}/map"
                     id="sidebar-map-button"
                     draggable="false"
@@ -389,9 +381,7 @@
                     <svg viewBox="0 0 24 24"><use href="#icon-map"/></svg>
                 </a>
                 <div
-                    class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                        from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                        hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                    class="w-18 h-18 rounded-xl m-3 accent-button"
                     onclick="toggleThemeWheel()"
                     id="sidebar-theme-button"
                     draggable="false"
@@ -399,9 +389,7 @@
                     <svg class="sidebar-theme-button-content" viewBox="0 0 24 24"><use href="#icon-palette"/></svg>
                 </div>
                 <a
-                    class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                        from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                        hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                    class="w-18 h-18 rounded-xl m-3 accent-button"
                     onclick="return changeUrl('/{{ .Lang }}/user');"
                     href="/{{ .Lang }}/user"
                     id="sidebar-user-button"
@@ -434,6 +422,11 @@
                     );
 
                     function updateSidebar() {
+                        sidebarHomeButton.classList.remove("active");
+                        sidebarMapButton.classList.remove("active");
+                        sidebarBlogButton.classList.remove("active");
+                        sidebarBackButton.classList.remove("active");
+                        sidebarUserButton.classList.remove("active");
                         if (
                             location.pathname == "" ||
                             location.pathname == "/"
@@ -455,6 +448,9 @@
                                 "onclick",
                                 `return changeUrl('/${lang}', false);`,
                             );
+                            if (location.pathname == `/${lang}`) {
+                                sidebarHomeButton.classList.add("active");
+                            }
                             sidebarMapButton.setAttribute(
                                 "href",
                                 `/${lang}/map`,
@@ -467,6 +463,9 @@
                                 "onclick",
                                 `return changeUrl('/${lang}/blog', false);`,
                             );
+                            if (location.pathname.startsWith(`/${lang}/blog`)) {
+                                sidebarBlogButton.classList.add("active");
+                            }
                             sidebarUserButton.setAttribute(
                                 "href",
                                 `/${lang}/user`,
@@ -475,6 +474,9 @@
                                 "onclick",
                                 `return changeUrl('/${lang}/user', false);`,
                             );
+                            if (location.pathname.startsWith(`/${lang}/user`)) {
+                                sidebarUserButton.classList.add("active");
+                            }
                         }
                     }
                     window.addEventListener("popstate", updateSidebar);
diff --git a/views/pages/global-map.html b/views/pages/global-map.html
index 53e6448..34fb870 100644
--- a/views/pages/global-map.html
+++ b/views/pages/global-map.html
@@ -165,9 +165,7 @@
             class="fixed flex flex-row w-full h-24 md:flex-col md:w-24 md:h-auto bg-paper bg-background shadow-elevation-6 z-1001 shrink-0 md:rounded-br-md"
         >
             <a
-                class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                    from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                    hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                class="w-18 h-18 rounded-xl m-3 accent-button"
                 href="./"
                 id="sidebar-back-button"
                 draggable="false"
@@ -175,9 +173,7 @@
                 <svg viewBox="0 0 24 24"><use href="#icon-back"/></svg>
             </a>
             <a
-                class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                    from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                    hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                class="w-18 h-18 rounded-xl m-3 accent-button"
                 href="/{{ .Lang }}"
                 id="sidebar-home-button"
                 draggable="false"
@@ -185,9 +181,7 @@
                 <svg viewBox="0 0 24 24"><use href="#icon-logo"/></svg>
             </a>
             <a
-                class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                    from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                    hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                class="w-18 h-18 rounded-xl m-3 accent-button"
                 href="/{{ .Lang }}/blog"
                 id="sidebar-blog-button"
                 draggable="false"
@@ -195,9 +189,7 @@
                 <svg viewBox="0 0 24 24"><use href="#icon-newspaper"/></svg>
             </a>
             <a
-                class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                    bg-conic-45 from-accent-dark/30 via-accent-light/50 to-accent-dark/30 transition-colors duration-1500 ease-in-out
-                    hover:cursor-pointer hover:from-accent-light/70 hover:via-accent-dark/50 hover:to-accent-light/70"
+                class="w-18 h-18 rounded-xl m-3 accent-button active"
                 href="/{{ .Lang }}/map"
                 id="sidebar-map-button"
                 draggable="false"
@@ -205,9 +197,7 @@
                 <svg viewBox="0 0 24 24"><use href="#icon-map"/></svg>
             </a>
             <div
-                class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                    from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                    hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                class="w-18 h-18 rounded-xl m-3 accent-button"
                 onclick="toggleThemeWheel()"
                 id="sidebar-theme-button"
                 draggable="false"
@@ -215,9 +205,7 @@
                 <svg class="sidebar-theme-button-content" viewBox="0 0 24 24"><use href="#icon-palette"/></svg>
             </div>
             <a
-                class="w-18 h-18 bg-conic-225 rounded-xl m-3
-                    from-accent-light/10 via-transparent to-accent-light/10 transition-colors duration-1500 ease-in-out
-                    hover:cursor-pointer hover:from-accent-light/50 hover:via-transparent hover:to-accent-light/50"
+                class="w-18 h-18 rounded-xl m-3 accent-button"
                 href="/{{ .Lang }}/user"
                 id="sidebar-user-button"
                 draggable="false"
-- 
cgit v1.3.1+13


From d409b1938973e31a1bdfe903fed973f396709ca2 Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Sun, 3 May 2026 16:49:41 +0700
Subject: feat: replace fa icons on homepage with freehand feat: remove
 font-awesome embeds

---
 static/input.css                |  8 --------
 views/layouts/general-page.html | 12 ------------
 views/pages/global-map.html     | 12 ------------
 views/pages/home-page.html      | 24 +++++++++++++++++++++---
 4 files changed, 21 insertions(+), 35 deletions(-)

(limited to 'static')

diff --git a/static/input.css b/static/input.css
index b9fb166..64d0588 100644
--- a/static/input.css
+++ b/static/input.css
@@ -72,14 +72,6 @@ html {
     background-size: --value([bg-size]), 128px;
 }
 
-@utility faw-full {
-    --fa-width: 100%;
-}
-
-@utility faw-* {
-    --fa-width: calc(--value(integer) * var(--spacing));
-}
-
 body {
     scrollbar-width: thin;
     scrollbar-color: var(--color-background-light) var(--color-main-soft);
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index 848c786..3920bdb 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -22,18 +22,6 @@
             rel="stylesheet"
             href="{{ .StaticStorageBaseUrl }}/fonts/fonts.css"
         />
-        <link
-            rel="stylesheet"
-            href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/fontawesome.min.css"
-        />
-        <link
-            rel="stylesheet"
-            href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/brands.min.css"
-        />
-        <link
-            rel="stylesheet"
-            href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/solid.min.css"
-        />
         <link
             rel="stylesheet"
             href="{{ .StaticStorageBaseUrl }}/libs/leaflet/1.9.4/leaflet.css"
diff --git a/views/pages/global-map.html b/views/pages/global-map.html
index 34fb870..248d0b9 100644
--- a/views/pages/global-map.html
+++ b/views/pages/global-map.html
@@ -20,18 +20,6 @@
             rel="stylesheet"
             href="{{ .StaticStorageBaseUrl }}/fonts/fonts.css"
         />
-        <link
-            rel="stylesheet"
-            href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/fontawesome.min.css"
-        />
-        <link
-            rel="stylesheet"
-            href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/brands.min.css"
-        />
-        <link
-            rel="stylesheet"
-            href="{{ .StaticStorageBaseUrl }}/libs/font-awesome/7.2.0/css/solid.min.css"
-        />
         {{ block "header" . }}{{ end }}
         <link rel="stylesheet" href="/output.css" />
         <link
diff --git a/views/pages/home-page.html b/views/pages/home-page.html
index b14b08c..7de9420 100644
--- a/views/pages/home-page.html
+++ b/views/pages/home-page.html
@@ -1,4 +1,22 @@
 {{ define "body" }}
+<!-- Streamline Icons: https://streamlinehq.com -->
+<svg xmlns="http://www.w3.org/2000/svg" style="display:none" aria-hidden="true">
+    <symbol id="icon-discord" viewBox="0 0 24 24"><g>
+        <path d="M23.8 8.8A10.45 10.45 0 0 0 20 3 13 13 0 0 0 13.59 0.4c-0.14 0 -6 -1 -9.79 2.77C1.67 5.32 0.56 8.65 0.15 11.77A15.3 15.3 0 0 0 0 14.71a8.77 8.77 0 0 0 3.46 6.44 13.74 13.74 0 0 0 4 2 13.55 13.55 0 0 0 1.91 0.52 5.32 5.32 0 0 0 1.41 0.11 16.63 16.63 0 0 0 6.12 -1.57A12.19 12.19 0 0 0 21.75 18a14.6 14.6 0 0 0 1.87 -4.4 10.74 10.74 0 0 0 0.18 -4.8Zm-1.19 4.56a13.31 13.31 0 0 1 -1.77 4.05 11 11 0 0 1 -4.43 3.73 15.5 15.5 0 0 1 -5.71 1.47 4.07 4.07 0 0 1 -1.13 -0.09 13.63 13.63 0 0 1 -1.76 -0.47 13.06 13.06 0 0 1 -3.68 -1.75 7.87 7.87 0 0 1 -2.5 -3.08A7.75 7.75 0 0 1 1 14.63a14.11 14.11 0 0 1 0 -2.75c0.32 -3 1.29 -6.15 3.27 -8.23 0.1 -0.11 2.84 -3.36 9.2 -2.5a12.09 12.09 0 0 1 5.95 2.53A9.47 9.47 0 0 1 22.86 9a9.56 9.56 0 0 1 -0.25 4.36Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path>
+        <path d="M20.27 11.06c-0.33 -0.59 -0.74 -1.14 -1.08 -1.69a16.78 16.78 0 0 0 -1.4 -2 6 6 0 0 0 -1.27 -1.17A6.34 6.34 0 0 0 14 5.36a31.12 31.12 0 0 0 -3.83 -0.08 12.94 12.94 0 0 0 -3 0.18c-1.41 0.35 -0.76 0.32 -2 2.72 -0.57 0.89 -1.02 1.82 -1.49 2.72a11.42 11.42 0 0 0 -0.77 1.39 1.65 1.65 0 0 0 -0.1 0.82 2.77 2.77 0 0 0 0.45 1.15 8.92 8.92 0 0 0 1.08 1.27l1.09 1.29a3.51 3.51 0 0 0 0.29 0.37 0.47 0.47 0 0 0 0.42 0.15 2 2 0 0 0 1.16 -0.62 12.55 12.55 0 0 0 1.49 -2c0.06 -0.08 0.36 -0.36 0.37 -0.52l0.93 0.11 2.91 0c1.31 0.09 0.41 -0.77 1.77 1.78a9.19 9.19 0 0 0 0.52 0.85 5.71 5.71 0 0 0 0.53 0.81 0.67 0.67 0 0 0 0.39 0.19 1.49 1.49 0 0 0 0.74 -0.11 5 5 0 0 0 1 -0.67 11.91 11.91 0 0 0 1.52 -1.42 13 13 0 0 0 1.28 -1.64 1.47 1.47 0 0 0 0.25 -0.77 3.09 3.09 0 0 0 -0.16 -0.94 6.06 6.06 0 0 0 -0.57 -1.33Zm-0.38 2.43A12.53 12.53 0 0 1 18.7 15a11.92 11.92 0 0 1 -1.4 1.28 5 5 0 0 1 -0.57 0.42l-0.14 0.08a2.55 2.55 0 0 0 -0.38 -0.48 6.07 6.07 0 0 1 -0.45 -0.74c-0.35 -0.64 -0.64 -1.32 -1 -1.95a0.73 0.73 0 0 0 -0.48 -0.31 11.39 11.39 0 0 0 -1.22 -0.09h-2.95c-0.21 0 -0.69 -0.1 -1 -0.1a1.13 1.13 0 0 0 -0.45 0.08 0.88 0.88 0 0 0 -0.34 0.29c-0.14 0.19 -0.28 0.53 -0.35 0.63a19.39 19.39 0 0 1 -1.11 1.72 1.93 1.93 0 0 1 -0.59 0.53l-0.11 -0.09L5 14.93a10 10 0 0 1 -1 -1.12 1.94 1.94 0 0 1 -0.41 -0.81 1.11 1.11 0 0 1 0.11 -0.64c0.17 -0.4 0.45 -0.79 0.62 -1.14 0.45 -0.91 0.87 -1.84 1.33 -2.75 1.29 -2.53 1.18 -2.29 2 -2.41a14.57 14.57 0 0 1 2.46 0 28 28 0 0 1 3.71 0.16A5.33 5.33 0 0 1 16 7a5.08 5.08 0 0 1 1 1 16.3 16.3 0 0 1 1.27 1.93c0.33 0.55 0.72 1.11 1 1.69a5.1 5.1 0 0 1 0.48 1.1 2.36 2.36 0 0 1 0.1 0.53 0.43 0.43 0 0 1 0.04 0.24Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path>
+        <path d="M7.15 8.26a1.44 1.44 0 0 0 -0.51 0.6 1.56 1.56 0 0 0 0.14 1.48A1.49 1.49 0 0 0 8.2 11a1.77 1.77 0 0 0 1.38 -1.42c0.27 -1.69 -1.45 -1.94 -2.43 -1.32Zm1.53 1.11a0.71 0.71 0 0 1 -0.6 0.53 0.44 0.44 0 0 1 -0.41 -0.2 0.65 0.65 0 0 1 -0.19 -0.54 0.68 0.68 0 0 1 0.21 -0.37c0.75 -0.55 1.17 0.02 0.99 0.58Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path>
+        <path d="M15 8a1.38 1.38 0 0 0 -0.77 -0.21 2.68 2.68 0 0 0 -1 0.25 3.12 3.12 0 0 0 -0.72 1 1.65 1.65 0 0 0 0.55 1.53 1.6 1.6 0 0 0 1.69 0.38 1.71 1.71 0 0 0 0.89 -1.47A1.65 1.65 0 0 0 15 8Zm-0.37 1.4a0.62 0.62 0 0 1 -0.3 0.53 0.36 0.36 0 0 1 -0.27 0 1.28 1.28 0 0 1 -0.4 -0.25c-0.15 -0.14 -0.3 -0.29 -0.28 -0.47a0.45 0.45 0 0 1 0.17 -0.34 2.73 2.73 0 0 1 0.53 -0.29 0.57 0.57 0 0 1 0.39 0.14 0.74 0.74 0 0 1 0.2 0.69Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path>
+    </g></symbol>
+    <symbol id="icon-telegram" viewBox="0 0 24 24"><g>
+        <path d="M23.8 9.74a10.54 10.54 0 0 0 -3.1 -5.5c-1.25 -1.19 -7.2 -6 -13.52 -3.12a12 12 0 0 0 -4.56 18.49 12.24 12.24 0 0 0 2.66 2.53 9.1 9.1 0 0 0 3.43 1.45c3.79 0.74 7.9 -0.75 10.9 -3.38s5.03 -6.67 4.19 -10.47Zm-4.87 9.68c-2.78 2.38 -6.54 3.78 -10 3.09a8.18 8.18 0 0 1 -3 -1.27 11.8 11.8 0 0 1 -2.44 -2.3 11 11 0 0 1 -2.25 -9.53 11.25 11.25 0 0 1 6.24 -7.66C8.17 1.42 12.94 -0.79 19 3.84a10 10 0 0 1 3.91 6.08c0.74 3.49 -1.1 7.08 -3.98 9.5Z" fill="var(--color-accent-deep)" fill-rule="evenodd" stroke-width="1"></path>
+        <path d="M17.5 6.52a8 8 0 0 0 -2.14 0.35l-0.78 0.13c-1.67 0.31 -3.36 0.63 -5 1 -1.11 0.28 -2.21 0.59 -3.29 1a5.12 5.12 0 0 0 -0.65 0.25 4.6 4.6 0 0 0 -0.64 0.34l-0.61 0.4 -0.39 0.34a0.93 0.93 0 0 0 -0.24 1.09C4 12 5 12.34 5.49 12.48l0.53 0.17 0.15 0 0 0.81 0 1 0.08 0.74 0.06 0.53A8.91 8.91 0 0 0 6.53 17a1.4 1.4 0 0 0 0.42 0.71H7a0.3 0.3 0 0 0 0.34 0.22A13.32 13.32 0 0 0 9 17.8a5.35 5.35 0 0 0 0.69 -0.17c0.23 -0.07 0.45 -0.15 0.67 -0.24 0.49 -0.19 0.94 -0.41 1.4 -0.63l0.58 0.56 0.66 0.47 0.52 0.23a1.08 1.08 0 0 0 1 -0.19 4.55 4.55 0 0 0 0.92 -1.51l1.4 -2.92c0.38 -0.76 0.78 -1.51 1.15 -2.28 0.25 -0.52 0.48 -1 0.68 -1.59A3.92 3.92 0 0 0 19 8.2a1.73 1.73 0 0 0 -0.31 -1.08 1.51 1.51 0 0 0 -1.19 -0.6ZM6.88 13.44l-0.07 -0.58c0.46 0 0.49 -0.43 5.26 -1.84l0.62 -0.16A16.71 16.71 0 0 1 11.34 12c-0.74 0.57 -1.51 1.12 -2.26 1.69l-0.46 0.52 -0.69 1.49s-0.22 0.44 -0.4 0.82c-0.07 -0.36 -0.1 -0.74 -0.14 -0.91l-0.12 -0.54 -0.19 -0.7Zm3.14 3c-0.23 0.05 -0.46 0.1 -0.68 0.17l-0.66 0.21 -0.27 0.12c0.07 -0.25 0.26 -0.76 0.31 -0.93 0.12 -0.36 0.35 -1.18 0.48 -1.5a0.3 0.3 0 0 0 0 -0.23s0.07 0 0.11 0l1.81 2c-0.35 -0.02 -0.72 0.04 -1.12 0.13Zm7.83 -8.08a3.2 3.2 0 0 1 -0.22 0.82c-0.14 0.39 -0.3 0.77 -0.46 1.14 -0.4 0.9 -0.83 1.79 -1.24 2.68l-1.31 2.95a6 6 0 0 1 -0.55 1.15 0.34 0.34 0 0 1 -0.36 0.16l-0.35 -0.14 -0.57 -0.38 -1 -0.91 -1.86 -1.93c0.78 -0.49 1.56 -1 2.32 -1.48 0.4 -0.27 0.8 -0.55 1.17 -0.85 0.2 -0.17 0.41 -0.34 0.59 -0.52a2.16 2.16 0 0 0 0.36 -0.51 2.52 2.52 0 0 0 0.14 -0.56 0.54 0.54 0 0 0 -0.51 -0.55 1.06 1.06 0 0 0 -0.24 0 3.54 3.54 0 0 0 -0.47 0.12l-1.51 0.45c-0.58 0.19 -1.14 0.38 -1.69 0.6 -1.27 0.5 -2.49 1.07 -3.78 1.55l-0.09 0 -0.53 -0.18a3.39 3.39 0 0 1 -1.22 -0.65c-0.11 -0.11 -0.11 -0.26 0.06 -0.43l0.3 -0.25 0.52 -0.32 1.16 -0.52c1.08 -0.32 2.17 -0.58 3.26 -0.8 1.66 -0.35 3.33 -0.62 5 -0.89l0.81 -0.16a10 10 0 0 1 1.6 -0.32c0.23 0 0.46 0 0.57 0.14a0.76 0.76 0 0 1 0.1 0.56Z" fill="var(--color-main)" fill-rule="evenodd" stroke-width="1"></path>
+    </g></symbol>
+    <symbol id="icon-email" viewBox="0 0 24 24"><g>
+        <path d="M23.58 5.09a2.73 2.73 0 0 0 -0.71 -1.43 4.24 4.24 0 0 0 -1.62 -0.34 99 99 0 0 0 -11.89 0.07C5.34 3.65 1.7 4.18 0.55 5a1.12 1.12 0 0 0 -0.35 0.68A25.75 25.75 0 0 0 0 9.6a93.2 93.2 0 0 0 0.5 10.09 0.31 0.31 0 1 0 0.61 -0.11c-0.15 -0.95 -0.29 -4 -0.31 -7.11A56 56 0 0 1 1 6.36c1.64 1.1 4.88 3.25 7.53 4.69l1.46 0.72a7.13 7.13 0 0 0 2.53 0.82 3.16 3.16 0 0 0 1.14 -0.42 8.38 8.38 0 0 0 0.79 -0.48l1.44 -1c0.34 -0.25 0.67 -0.49 1 -0.77A44.32 44.32 0 0 0 22.32 5c0 0.11 0.07 0.24 0.1 0.38a24.38 24.38 0 0 1 0.41 4.75 65 65 0 0 1 -0.36 8.17c0 0.22 -0.07 0.45 -0.1 0.58l-0.69 0c-1.79 0.18 -5.6 0.46 -9.48 0.7 -4.39 0.27 -8.86 0.5 -10.56 0.54a0.35 0.35 0 0 0 -0.35 0.35 0.36 0.36 0 0 0 0.36 0.35c2.27 0 9.45 -0.29 14.83 -0.58 2.56 -0.13 4.71 -0.27 5.73 -0.37a2.73 2.73 0 0 0 0.86 -0.19 0.6 0.6 0 0 0 0.24 -0.3 4.17 4.17 0 0 0 0.22 -0.94A65.86 65.86 0 0 0 24 10.1a26 26 0 0 0 -0.42 -5.01Zm-6.33 3.28c-1.23 0.92 -2.48 1.78 -3.44 2.36a4.31 4.31 0 0 1 -1.36 0.67 3.75 3.75 0 0 1 -1.27 -0.4c-0.9 -0.37 -2.06 -0.94 -3.29 -1.59C5.34 8.1 2.52 6.49 1.13 5.68c1.18 -0.69 4.57 -1 8.29 -1.2a106 106 0 0 1 11.74 0h0.62a38.87 38.87 0 0 1 -4.53 3.89Z" fill="var(--color-main)" stroke-width="1"></path>
+        <path d="M17.68 14.41c0.34 0.33 0.69 0.65 1 0.95 1 0.93 2 1.74 2.46 2.19a0.36 0.36 0 0 0 0.5 0 0.35 0.35 0 0 0 0 -0.5c-0.43 -0.51 -1.23 -1.46 -2.18 -2.49q-0.48 -0.51 -1 -1c-0.34 -0.33 -0.69 -0.66 -1 -1s-0.81 -0.68 -1.19 -1c-0.69 -0.47 -1.2 0 -0.71 0.59 0.34 0.37 0.71 0.78 1.12 1.2s0.66 0.73 1 1.06Z" fill="var(--color-accent-deep)" stroke-width="1"></path>
+        <path d="M4.59 15.35a39.94 39.94 0 0 0 -2.94 3.25 0.35 0.35 0 1 0 0.53 0.46c0.59 -0.6 1.69 -1.51 2.89 -2.58 0.63 -0.57 1.29 -1.17 1.9 -1.79s1.42 -1.52 2 -2.21 -0.14 -1 -0.82 -0.39c-0.52 0.46 -1.08 0.94 -1.67 1.47s-1.28 1.19 -1.89 1.79Z" fill="var(--color-accent-deep)" stroke-width="1"></path>
+    </g></symbol>
+</svg>
 <div class="absolute w-full h-full inset-0 inset-shadow-[0_0_0.4rem_black] pointer-events-none z-20"></div>
 <div class="relative bg-paper bg-background-light font-gentium flex flex-row ar-lt-0.6:flex-col w-full h-full overflow-y-auto text-base/loose tracking-wide z-10">
     <div class="ar-gt-0.6:flex-3/5 justify-center content-start p-8">
@@ -32,17 +50,17 @@
                 bg-linear-to-r from-background-dark to-background-light">{{ .L.HomePage.Contacts }}</p>
             <hr class="w-full border-t-2 border-dotted border-main-hard mb-1">
             <a href="https://t.me/EarlInisMona">
-                <i class="fa-brands fa-telegram faw-4 h-4 mr-1"></i>
+                <svg class="w-4 h-4 mr-1 inline" viewBox="0 0 24 24"><use href="#icon-telegram"/></svg>
                 <span class="font-bold">Telegram:</span>
                 <span>@EarlInisMona</span>
             </a>
             <a href="https://discord.com/users/356057270951346176">
-                <i class="fa-brands fa-discord faw-4 h-4 mr-1"></i>
+                <svg class="w-4 h-4 mr-1 inline" viewBox="0 0 24 24"><use href="#icon-discord"/></svg>
                 <span class="font-bold">Discord:</span>
                 <span>montferrat</span>
             </a>
             <a href="mailto:saya.andy@posteo.com">
-                <i class="fas fa-envelope faw-4 h-4 mr-1"></i>
+                <svg class="w-4 h-4 mr-1 inline" viewBox="0 0 24 24"><use href="#icon-email"/></svg>
                 <span class="font-bold">E-mail:</span>
                 <span>saya.andy@posteo.com</span>
             </a>
-- 
cgit v1.3.1+13


From 8243ad9ec7b50b0aaf402c91decf3c8093ecb77a Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Sun, 3 May 2026 16:52:50 +0700
Subject: feat: rm unused classes from input.css

---
 static/input.css | 64 --------------------------------------------------------
 1 file changed, 64 deletions(-)

(limited to 'static')

diff --git a/static/input.css b/static/input.css
index 64d0588..9114514 100644
--- a/static/input.css
+++ b/static/input.css
@@ -397,10 +397,6 @@ form.crossable.htmx-request input {
     border-style: inset;
 }
 
-.border-outset {
-    border-style: outset;
-}
-
 .bg-sidebar {
     background-image: var(--squares-and-triangles-background);
     background-repeat: var(--squares-and-triangles-background-repeat);
@@ -500,66 +496,6 @@ form.crossable.htmx-request input {
     border-radius: 50%;
 }
 
-.themed-button::before {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: linear-gradient(
-        135deg,
-        var(--color-main-light-hard),
-        var(--color-main-dark-hard)
-    );
-    opacity: 0.2;
-    z-index: 10;
-    content: "";
-}
-
-.themed-button:active::before {
-    opacity: 0.4;
-}
-
-.themed-button:hover:not(:active)::before {
-    opacity: 0;
-}
-
-.themed-button {
-    border-top: var(--border-size) solid var(--color-main-light-hard);
-    border-left: var(--border-size) solid var(--color-main-light-hard);
-    border-bottom: var(--border-size) solid var(--color-main-dark-hard);
-    border-right: var(--border-size) solid var(--color-main-dark-hard);
-    position: relative;
-    --border-size: 0.5rem;
-}
-
-.themed-button:active,
-.themed-button.active {
-    border-top: var(--border-size) solid var(--color-main-dark-hard);
-    border-left: var(--border-size) solid var(--color-main-dark-hard);
-    border-bottom: var(--border-size) solid var(--color-main-light-hard);
-    border-right: var(--border-size) solid var(--color-main-light-hard);
-}
-
-.themed-button:active > *,
-.themed-button.active > * {
-    transform: translateY(calc(var(--border-size) / 2));
-}
-
-.themed-button.themed-button-sidebar {
-    --border-size: 0.25rem;
-    background-image: var(--squares-and-triangles-background);
-    background-repeat: var(--squares-and-triangles-background-repeat);
-    background-size: calc(
-            var(--squares-and-triangles-background-width-coef) * 0.9rem
-        )
-        calc(var(--squares-and-triangles-background-height-coef) * 0.9rem);
-}
-
-.themed-button.themed-button-like {
-    --border-size: 0.2rem;
-}
-
 .accent-button,
 .accent-button.active:active {
     --tw-duration: 1500ms;
-- 
cgit v1.3.1+13