From 404dd8fe9840e3e01bb987e998c2b35b67f38d20 Mon Sep 17 00:00:00 2001
From: Mandel Olaiya <mandeleolaiya15@icloud.com>
Date: Sun, 26 Apr 2026 12:10:40 +0200
Subject: [PATCH] Polish header language dropdown styling

---
 mandelstudio/templates/layout.html            | 28 +++++++++++++++++++
 .../headers/partials/carbasa-user-bar.html    | 26 +++++++++--------
 2 files changed, 42 insertions(+), 12 deletions(-)

diff --git a/mandelstudio/templates/layout.html b/mandelstudio/templates/layout.html
index 60f541c..06488e6 100644
--- a/mandelstudio/templates/layout.html
+++ b/mandelstudio/templates/layout.html
@@ -25,6 +25,34 @@
 <link rel="preconnect" href="https://www.google-analytics.com/">
 {% endif %}
 {{ block.super }}
+<style>
+  header .language-dropdown .dropdown-toggle::after { display: none; }
+  header .language-dropdown .language-flag {
+    width: 22px;
+    height: 22px;
+    border-radius: 999px;
+    overflow: hidden;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    background: #fff;
+  }
+  header .language-dropdown .language-flag svg {
+    width: 28px;
+    height: 20px;
+    flex: 0 0 auto;
+  }
+  header .language-dropdown .dropdown-item .language-flag {
+    width: 26px;
+    height: 18px;
+    border-radius: 4px;
+    background: transparent;
+  }
+  header .language-dropdown .dropdown-item .language-flag svg {
+    width: 26px;
+    height: 18px;
+  }
+</style>
 {% if cookie_jar.needs_approval %}
 <link rel="stylesheet" type="text/css" href="{% static 'cookie_jar/css/cookie_jar.css' %}">
 {% endif %}
diff --git a/mandelstudio/templates/oxyan/headers/partials/carbasa-user-bar.html b/mandelstudio/templates/oxyan/headers/partials/carbasa-user-bar.html
index a24c3a5..9aab915 100644
--- a/mandelstudio/templates/oxyan/headers/partials/carbasa-user-bar.html
+++ b/mandelstudio/templates/oxyan/headers/partials/carbasa-user-bar.html
@@ -14,22 +14,24 @@
             aria-expanded="false"
             aria-label="{% trans 'Language switcher' %}"
         >
-            {% include "oxyan/partials/flags/"|add:current_language|add:".svg" %}
+            <span class="language-flag">
+                {% include "oxyan/partials/flags/"|add:current_language|add:".svg" %}
+            </span>
         </button>
-        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="header-language-switcher">
-            <form action="{% url 'set_language' %}" method="post" class="language_form">
-                {% csrf_token %}
-                <input name="next" type="hidden" value="{{ request.path }}"/>
+        <form action="{% url 'set_language' %}" method="post" class="language_form">
+            {% csrf_token %}
+            <input name="next" type="hidden" value="{{ request.path }}"/>
+            <div class="dropdown-menu dropdown-menu-end" aria-labelledby="header-language-switcher">
                 {% for language in languages %}
-                    <li>
-                        <button class="dropdown-item d-flex align-items-center gap-2" type="submit" value="{{ language.code }}" name="language">
+                    <button class="dropdown-item d-flex align-items-center gap-2" type="submit" value="{{ language.code }}" name="language">
+                        <span class="language-flag">
                             {% include "oxyan/partials/flags/"|add:language.code|add:".svg" %}
-                            <span>{{ language.name_local|title }}</span>
-                        </button>
-                    </li>
+                        </span>
+                        <span>{{ language.name_local|title }}</span>
+                    </button>
                 {% endfor %}
-            </form>
-        </ul>
+            </div>
+        </form>
     </div>
 
     <a