fixing blog:

assets/static/css/theme.css

@@ -592,10 +592,12 @@ body {
 .ql-toolbar.ql-snow {
   background: oklch(var(--b2));
 }
-.ql-snow .ql-stroke {
+.ql-snow .ql-stroke,
+.ql-snow .ql-stroke-miter {
   stroke: oklch(var(--bc));
 }
-.ql-snow .ql-fill {
+.ql-snow .ql-fill,
+.ql-snow .ql-stroke.ql-fill {
   fill: oklch(var(--bc));
 }
 .ql-snow .ql-picker,
@@ -606,6 +608,66 @@ body {
   background: oklch(var(--b1));
   border-color: oklch(var(--b3));
 }
+.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,
+.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
+  border-color: oklch(var(--b3));
+}
+/* active / hover toolbar state -> gruvbox accent */
+.ql-snow.ql-toolbar button:hover,
+.ql-snow.ql-toolbar button:focus,
+.ql-snow.ql-toolbar button.ql-active,
+.ql-snow.ql-toolbar .ql-picker-label:hover,
+.ql-snow.ql-toolbar .ql-picker-label.ql-active,
+.ql-snow.ql-toolbar .ql-picker-item:hover,
+.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
+.ql-snow .ql-picker.ql-expanded .ql-picker-label {
+  color: oklch(var(--p));
+}
+.ql-snow.ql-toolbar button:hover .ql-stroke,
+.ql-snow.ql-toolbar button:focus .ql-stroke,
+.ql-snow.ql-toolbar button.ql-active .ql-stroke,
+.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
+.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
+.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
+.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
+.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
+.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
+.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
+  stroke: oklch(var(--p));
+}
+.ql-snow.ql-toolbar button:hover .ql-fill,
+.ql-snow.ql-toolbar button:focus .ql-fill,
+.ql-snow.ql-toolbar button.ql-active .ql-fill,
+.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
+.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
+.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
+.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
+.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
+.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
+.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill {
+  fill: oklch(var(--p));
+}
+/* link tooltip popup */
+.ql-snow .ql-tooltip {
+  background-color: oklch(var(--b1));
+  border-color: oklch(var(--b3));
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
+  color: oklch(var(--bc));
+}
+.ql-snow .ql-tooltip input[type=text] {
+  background: oklch(var(--b2));
+  border-color: oklch(var(--b3));
+  color: oklch(var(--bc));
+}
+.ql-snow .ql-tooltip a {
+  color: oklch(var(--p));
+}
+.ql-snow .ql-tooltip a.ql-action::after {
+  border-color: oklch(var(--b3));
+}
+.ql-snow .ql-editor a {
+  color: oklch(var(--p));
+}
 .blog-image-size-controls {
   display: flex;
   flex-wrap: wrap;
@@ -633,7 +695,7 @@ body {
   gap: 0.4rem;
 }
 .blog-image-size-controls input {
-  width: 6rem;
+  width: 5rem;
 }
 .blog-editor img,
 .blog-content img {

assets/static/js/blog-editor.js

@@ -1,10 +1,4 @@
 (function () {
-  function firstFilenameFromEditor(editor) {
-    var image = editor.root.querySelector('img[src^="/images/"]');
-    if (!image) return '';
-    return image.getAttribute('src').replace('/images/', '');
-  }
-
   function setImageSize(image, size) {
     image.classList.remove('blog-image-small', 'blog-image-medium', 'blog-image-full');
     image.style.removeProperty('width');
@@ -35,7 +29,6 @@
   function initEditor(form) {
     var editorEl = form.querySelector('[data-rich-editor]');
     var contentInput = form.querySelector('[data-rich-content]');
-    var featuredInput = form.querySelector('[data-featured-image-id]');
     var status = form.querySelector('[data-rich-status]');
     var imageControls = form.querySelector('[data-image-size-controls]');
     var imageWidthInput = form.querySelector('[data-image-width]');
@@ -64,7 +57,6 @@
     function syncContent() {
       normalizeEditorImages(editor.root);
       contentInput.value = editor.root.innerHTML;
-      if (featuredInput && !featuredInput.value) featuredInput.value = firstFilenameFromEditor(editor);
     }
 
     function setStatus(message) {
@@ -106,7 +98,6 @@
             selectedImage = image;
             if (imageControls) imageControls.classList.remove('hidden');
           }
-          if (featuredInput && !featuredInput.value) featuredInput.value = result.filename;
           syncContent();
         }, 0);
         setStatus(status ? status.dataset.uploaded : '');

assets/views/admin/base.html

@@ -37,8 +37,8 @@
       });
     </script>
     <link href="/static/css/app.css" rel="stylesheet" type="text/css">
-    <link href="/static/css/theme.css" rel="stylesheet" type="text/css">
     {% block head %}{% endblock head %}
+    <link href="/static/css/theme.css" rel="stylesheet" type="text/css">
     <script src="https://unpkg.com/htmx.org@1.9.12"></script>
     <style>
       @media (min-width: 768px) {

assets/views/base.html

@@ -258,7 +258,7 @@
           <li><a href="/audio/tracks" data-nav="/audio/tracks">{{ t(key="nav-songs", lang=lang | default(value='sk')) }}</a></li>
           <li><a href="/about" data-nav="/about">{{ t(key="nav-about", lang=lang | default(value='sk')) }}</a></li>
           {% if logged_in_admin %}
-          <li><a href="/admin/dashboard" class="t-yellow" data-nav="/admin">{{ t(key="admin-title", lang=lang | default(value='sk')) }}</a></li>
+          <li><a href="/admin/dashboard" hx-boost="false" class="t-yellow" data-nav="/admin">{{ t(key="admin-title", lang=lang | default(value='sk')) }}</a></li>
           <li>
             <form method="post" action="/admin/logout" hx-boost="false">
               <button type="submit" class="t-red w-full">{{ t(key="logout", lang=lang | default(value='sk')) }}</button>
@@ -284,7 +284,7 @@
               <li><a href="/audio/tracks">{{ t(key="nav-songs", lang=lang | default(value='sk')) }}</a></li>
               <li><a href="/about">{{ t(key="nav-about", lang=lang | default(value='sk')) }}</a></li>
               {% if logged_in_admin %}
-              <li><a href="/admin/dashboard" class="t-yellow">{{ t(key="admin-title", lang=lang | default(value='sk')) }}</a></li>
+              <li><a href="/admin/dashboard" hx-boost="false" class="t-yellow">{{ t(key="admin-title", lang=lang | default(value='sk')) }}</a></li>
               <li>
                 <form method="post" action="/admin/logout">
                   <button type="submit" class="t-red w-full">{{ t(key="logout", lang=lang | default(value='sk')) }}</button>

assets/views/blog/index.html

@@ -11,7 +11,7 @@
     <p class="term-sub">// {{ articles | length }} {{ t(key="blog-sub", lang=lang | default(value='sk')) }}</p>
   </div>
   <div class="term-cmd-actions">
-    <a href="/admin/blog/articles" class="btn btn-outline btn-sm">[ {{ t(key="blog-manage", lang=lang | default(value='sk')) }} ]</a>
+    <a href="/admin/blog/articles" hx-boost="false" class="btn btn-outline btn-sm">[ {{ t(key="blog-manage", lang=lang | default(value='sk')) }} ]</a>
   </div>
 </header>
 
@@ -24,9 +24,6 @@
           <span class="term-head-meta term-tag">{{ t(key="post", lang=lang | default(value='sk')) }}</span>
         </div>
         <div class="card-body">
-          {% if article.featured_image_id %}
-          <img src="/images/{{ article.featured_image_id }}" alt="" class="mb-3 max-h-64 w-full rounded object-cover">
-          {% endif %}
           <h2 class="card-title text-base">
             <a href="/blog/{{ article.slug }}">{{ article.title }}</a>
           </h2>
@@ -62,9 +59,6 @@
           <span class="term-head-meta term-tag">{{ t(key="post", lang=lang | default(value='sk')) }}</span>
         </div>
         <div class="card-body">
-          {% if article.featured_image_id %}
-          <img src="/images/{{ article.featured_image_id }}" alt="" class="mb-3 max-h-64 w-full rounded object-cover">
-          {% endif %}
           <h2 class="card-title text-base">
             <a href="/blog/{{ article.slug }}">{{ article.title }}</a>
           </h2>

assets/views/blog/show.html

@@ -21,9 +21,6 @@
     <span class="term-head-meta term-tag is-blue">{{ t(key="readonly", lang=lang | default(value='sk')) }}</span>
   </div>
   <div class="card-body">
-    {% if article.featured_image_id %}
-    <img src="/images/{{ article.featured_image_id }}" alt="" class="mb-4 max-h-[28rem] w-full rounded object-cover">
-    {% endif %}
     {% if article.excerpt %}
     <p class="term-prose t-yellow"># {{ article.excerpt }}</p>
     <div class="border-t border-base-300 pt-4"></div>
@@ -48,9 +45,6 @@
     <span class="term-head-meta term-tag is-blue">{{ t(key="readonly", lang=lang | default(value='sk')) }}</span>
   </div>
   <div class="card-body">
-    {% if article.featured_image_id %}
-    <img src="/images/{{ article.featured_image_id }}" alt="" class="mb-4 max-h-[28rem] w-full rounded object-cover">
-    {% endif %}
     {% if article.excerpt %}
     <p class="term-prose t-yellow"># {{ article.excerpt }}</p>
     <div class="border-t border-base-300 pt-4"></div>

assets/views/pages/about.html

@@ -11,7 +11,7 @@
     <p class="term-sub">// {{ t(key="about-sub", lang=lang | default(value='sk')) }}</p>
   </div>
   <div class="term-cmd-actions">
-    <a href="/admin/about" class="btn btn-outline btn-sm">[ {{ t(key="edit", lang=lang | default(value='sk')) }} ]</a>
+    <a href="/admin/about" hx-boost="false" class="btn btn-outline btn-sm">[ {{ t(key="edit", lang=lang | default(value='sk')) }} ]</a>
   </div>
 </header>