feat: pages and dark color theme

5 files changed, 17 insertions, 16 deletions

diff --git a/src/partials/book-progress-banner.html b/src/partials/book-progress-banner.html
index 3d52164..a10b477 100644
--- a/src/partials/book-progress-banner.html
+++ b/src/partials/book-progress-banner.html
@@ -1,9 +1,9 @@
 <!-- Banner -->
-<a href="/computer-literacy-book-progress.html" class="font-serif block relative overflow-clip">
+<a href="/computer-literacy-book-progress.html" class="font-serif block dark:bg-zinc-800 relative overflow-clip">
     <!-- Binary numbers with gradient overlay -->
     <div class="absolute inset-0 z-0">
         <!-- Binary numbers -->
-        <div class="absolute flex text-5xl scale-105 tabular-nums text-black/20 flex-col right-0 top-0 -translate-y-3">
+        <div class="absolute flex text-5xl scale-105 tabular-nums text-black/20 flex-col right-0 top-0 -translate-y-3 dark:text-white">
             <span class="translate-x-0">10101011001010100101101011010100101</span>
             <span class="translate-x-24">01010110101101001010101101001010110</span>
             <span class="translate-x-8">11010010101010110100101011010101001</span>
@@ -11,11 +11,11 @@
             <span class="translate-x-2">10100101010110101001011010101010011</span>
         </div>
         <!-- Gradient overlay -->
-        <div class="absolute inset-0 bg-gradient-to-r from-white max-md:from-35% to-white/0"></div>
+        <div class="absolute inset-0 bg-gradient-to-r dark:from-zinc-800 dark:to-zinc-800/0 from-white max-md:from-35% to-white/0"></div>
     </div>
 
     <!-- Text content on top -->
-    <div class="relative z-10 mx-auto py-12 h-54 container max-sm:px-5 flex flex-col justify-between">
+    <div class="relative dark:text-white z-10 mx-auto py-12 h-54 container max-sm:px-5 flex flex-col justify-between">
         <h1 class="capitalize text-3xl">Компьютерная<br/>грамотность</h1>
         <span class="underline block first-letter:capitalize">Следить за прогрессом выхода книги</span>
     </div>
diff --git a/src/partials/common-section.html b/src/partials/common-section.html
index cd693e6..cd050a7 100644
--- a/src/partials/common-section.html
+++ b/src/partials/common-section.html
@@ -1,4 +1,4 @@
-<section class="bg-gradient-to-b pb-12 from-zinc-900 to-black text-white font-serif">
+<section class="bg-gradient-to-b dark:bg-zinc-900 pb-12 from-zinc-900 to-black text-white font-serif">
     <div class="mx-auto space-y-12 pt-24 pb-32 container max-sm:px-5 ">
         <section id="support" class="grid grid-cols-1 md:grid-cols-3">
             <span class="block mb-6 first-letter:capitalize text-2xl">поддержать</span>
diff --git a/src/partials/footer.html b/src/partials/footer.html
index b91ab68..77b89e0 100644
--- a/src/partials/footer.html
+++ b/src/partials/footer.html
@@ -1,9 +1,9 @@
-<footer class="relative font-serif">
-    <img class="w-full" src="/assets/images/paper-texture.png" alt="paper cut texture">
+<footer class="relative dark:text-white font-serif">
+    <img class="dark:hidden w-full" src="/assets/images/paper-texture.png" alt="paper cut texture">
     <div class="relative pb-8 pt-24 overflow-y-clip">
-        <img class="absolute object-fill w-full h-full z-[-1] top-0 left-0" src="/assets/images/paper-cut.png" alt="paper texture">
+        <img class="dark:invert absolute object-fill w-full h-full z-[-1] top-0 left-0" src="/assets/images/paper-cut.png" alt="paper texture">
         <div class="mx-auto flex gap-8 flex-wrap container max-sm:px-5">
-            <a class="min-w-16" href="/"><img width="96" height="96" src="/assets/icons/logo.svg" alt="logo letter M"></a>         
+            <a class="min-w-16" href="/"><img class="dark:invert" width="96" height="96" src="/assets/icons/logo.svg" alt="logo letter M"></a>         
             <ul class="flex gap-8 flex-wrap">
                 <li>
                     <p class="text-xl first-letter:capitalize mb-3">техническое</p>
diff --git a/src/partials/header.html b/src/partials/header.html
index 5d41b0a..139605b 100644
--- a/src/partials/header.html
+++ b/src/partials/header.html
@@ -1,9 +1,9 @@
-<header class="py-12 border-b border-zinc-200 flex flex-col gap-4 items-center">
-    <a href="/"><img width="96" height="96" src="/assets/icons/logo.svg" alt="logo letter M"></a>
+<header class="py-12 bg-white dark:bg-zinc-900 border-b dark:border-zinc-800 border-zinc-200 flex flex-col gap-4 items-center">
+    <a href="/"><img class="dark:invert" width="96" height="96" src="/assets/icons/logo.svg" alt="logo letter M"></a>
     <nav>
-        <ul class="flex justify-center text-zinc-600 text-sm gap-4 flex-wrap">
+        <ul class="flex justify-center dark:text-zinc-400 text-zinc-600 text-sm gap-4 flex-wrap">
             <li><a class="block first-letter:capitalize hover:underline" href="/portfolio.html">портфолио</a></li>
-            <li><a class="block first-letter:capitalize hover:underline" href="#">обо мне</a></li>
+            <li><a class="block first-letter:capitalize hover:underline" href="/about.html">обо мне</a></li>
             <li><a class="block first-letter:capitalize hover:underline" href="#">резюме</a></li>
             <li><a class="block first-letter:capitalize hover:underline" href="/">публикации</a></li>
             <li><a class="block first-letter:capitalize hover:underline" href="/guest-book.html">гостевая книга</a></li>
diff --git a/src/partials/sidebar.html b/src/partials/sidebar.html
index fcbead0..e499bb0 100644
--- a/src/partials/sidebar.html
+++ b/src/partials/sidebar.html
@@ -8,8 +8,8 @@
         <span class=" capitalize">публикации</span>
         <ul class="space-y-2 mt-2">
             <li><a class="text-sm hover:underline first-letter:capitalize block text-zinc-600" href="/posts/privacy-translate.html">Перевод «минуя погоню за приватностью»</a></li>
-            <li>
-                <a class="text-sm hover:underline first-letter:capitalize block text-zinc-600" href="/posts/telegram-durov.html">про телеграмчик и Дурова</a></li>
+            <li><a class="text-sm hover:underline first-letter:capitalize block text-zinc-600" href="/posts/telegram-durov.html">про телеграмчик и Дурова</a></li>
+            <li><a class="text-sm hover:underline first-letter:capitalize block text-zinc-600" href="/posts/boycott.html">бойкот компаний</a></li>
             <!-- <li><a class="text-sm hover:underline first-letter:capitalize block text-zinc-600" href="#">какими, по-моему, должны быть мобильные телефоны</a></li>
             <li><a class="text-sm hover:underline first-letter:capitalize block text-zinc-600" href="#">Заметки про The Czar is Dead 2 Demo</a></li> -->
         </ul>
@@ -21,7 +21,8 @@
             <li><a href="#" class="flex items-center justify-center bg-orange-200 rounded-lg px-1.5 text-orange-600 first-letter:capitalize text-xs hover:underline w-fit">hardware</a></li>
             <li><a href="#" class="flex items-center justify-center bg-yellow-200 rounded-lg px-1.5 text-yellow-600 first-letter:capitalize text-xs hover:underline w-fit">software</a></li>
             <li><a href="#" class="flex items-center justify-center bg-pink-200 rounded-lg px-1.5 text-pink-600 first-letter:capitalize text-xs hover:underline w-fit">игры</a></li> -->
-            <li><a href="/cgi/tags.cgi?tag=telegram" class="flex items-center justify-center bg-sky-200 rounded-lg px-1.5 text-sky-600 first-letter:capitalize text-xs hover:underline w-fit">telegram</a></li>
+            <li><a href="/cgi/tags.cgi?tag=web" class="flex items-center justify-center bg-fuchsia-200 rounded-lg px-1.5 text-fuchsia-600 first-letter:capitalize text-xs hover:underline w-fit">web</a></li>
+            <li><a href="/cgi/tags.cgi?tag=протест" class="flex items-center justify-center bg-red-200 rounded-lg px-1.5 text-red-600 first-letter:capitalize text-xs hover:underline w-fit">протест</a></li>
             <li><a href="/cgi/tags.cgi?tag=приватность" class="flex items-center justify-center bg-amber-200 rounded-lg px-1.5 text-amber-600 first-letter:capitalize text-xs hover:underline w-fit">приватность</a></li>
         </ul>
     </nav>