From 9446e46f22a15290cb45749bb9784b1277e7aab4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joakim=20Hells=C3=A9n?= <tlovinator@gmail.com>
Date: Fri, 10 Apr 2026 20:38:21 +0200
Subject: [PATCH] Refactor feed.html

---
 discord_rss_bot/templates/feed.html | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/discord_rss_bot/templates/feed.html b/discord_rss_bot/templates/feed.html
index 6cb7ad4..1f8317f 100644
--- a/discord_rss_bot/templates/feed.html
+++ b/discord_rss_bot/templates/feed.html
@@ -5,7 +5,7 @@
 {% block content %}
     <div class="row g-3 feed-page">
         <div class="col-12">
-            <article class="card border border-dark shadow-sm text-light">
+            <article class="card border border-dark shadow-sm text-light rounded-0">
                 <div class="card-body p-3 p-md-4 text-light">
                     <div class="d-flex flex-wrap justify-content-between align-items-start gap-3">
                         <div class="feed-page__content">
@@ -105,7 +105,7 @@
                                     </form>
                                     {% if screenshot_layout == "mobile" %}
                                         <form action="/use_screenshot_desktop" method="post" class="d-inline">
-                                            <button class="btn btn-outline-secondary btn-sm"
+                                            <button class="btn btn-outline-light btn-sm"
                                                     name="feed_url"
                                                     value="{{ feed.url }}">Use desktop screenshot layout</button>
                                         </form>
@@ -138,18 +138,18 @@
                     </section>
                     <section class="mt-4 pt-3 border-top border-secondary-subtle">
                         <h3 class="h6 text-uppercase text-muted mb-3">Customization</h3>
-                        <div class="d-flex flex-column align-items-start gap-2">
-                            <a class="text-muted text-decoration-none"
+                        <div class="d-flex flex-wrap gap-2">
+                            <a class="btn btn-sm btn-outline-light"
                                href="/whitelist?feed_url={{ feed.url|encode_url }}">Whitelist</a>
-                            <a class="text-muted text-decoration-none"
+                            <a class="btn btn-sm btn-outline-light"
                                href="/blacklist?feed_url={{ feed.url|encode_url }}">Blacklist</a>
-                            <a class="text-muted text-decoration-none"
+                            <a class="btn btn-sm btn-outline-light"
                                href="/custom?feed_url={{ feed.url|encode_url }}">
                                 Customize message
                                 {% if delivery_mode == "text" %}(Currently active){% endif %}
                             </a>
                             {% if not "youtube.com/feeds/videos.xml" in feed.url %}
-                                <a class="text-muted text-decoration-none"
+                                <a class="btn btn-sm btn-outline-light"
                                    href="/embed?feed_url={{ feed.url|encode_url }}">
                                     Customize embed
                                     {% if delivery_mode == "embed" %}(Currently active){% endif %}
@@ -175,19 +175,19 @@
                         <h3 class="h6 text-uppercase text-muted mb-3">Feed Information</h3>
                         <div class="row g-2 text-muted small">
                             <div class="col-12 col-md-6">
-                                <div class="p-2 border border-secondary rounded">Added: {{ feed.added | relative_time }}</div>
+                                <div class="p-2">Added: {{ feed.added | relative_time }}</div>
                             </div>
                             <div class="col-12 col-md-6">
-                                <div class="p-2 border border-secondary rounded">Last Updated: {{ feed.last_updated | relative_time }}</div>
+                                <div class="p-2">Last Updated: {{ feed.last_updated | relative_time }}</div>
                             </div>
                             <div class="col-12 col-md-6">
-                                <div class="p-2 border border-secondary rounded">Last Retrieved: {{ feed.last_retrieved | relative_time }}</div>
+                                <div class="p-2">Last Retrieved: {{ feed.last_retrieved | relative_time }}</div>
                             </div>
                             <div class="col-12 col-md-6">
-                                <div class="p-2 border border-secondary rounded">Next Update: {{ feed.update_after | relative_time }}</div>
+                                <div class="p-2">Next Update: {{ feed.update_after | relative_time }}</div>
                             </div>
                             <div class="col-12 col-md-6">
-                                <div class="p-2 border border-secondary rounded">
+                                <div class="p-2">
                                     Updates:
                                     <span class="badge {{ 'bg-success' if feed.updates_enabled else 'bg-danger' }}">
                                         {{ 'Enabled' if feed.updates_enabled else 'Disabled' }}
@@ -247,7 +247,7 @@
             </article>
         </div>
         <div class="col-12">
-            <section class="card border border-dark shadow-sm text-light">
+            <section class="card border border-dark shadow-sm text-light rounded-0">
                 <div class="card-header bg-transparent text-muted border-secondary">Rendered HTML content</div>
                 <div class="card-body p-0">
                     <pre class="m-0 p-3 feed-page__pre">{{ html|safe }}</pre>