Polish header language dropdown styling
This commit is contained in:
@@ -25,6 +25,34 @@
|
|||||||
<link rel="preconnect" href="https://www.google-analytics.com/">
|
<link rel="preconnect" href="https://www.google-analytics.com/">
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{{ block.super }}
|
{{ 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 %}
|
{% if cookie_jar.needs_approval %}
|
||||||
<link rel="stylesheet" type="text/css" href="{% static 'cookie_jar/css/cookie_jar.css' %}">
|
<link rel="stylesheet" type="text/css" href="{% static 'cookie_jar/css/cookie_jar.css' %}">
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|||||||
@@ -14,22 +14,24 @@
|
|||||||
aria-expanded="false"
|
aria-expanded="false"
|
||||||
aria-label="{% trans 'Language switcher' %}"
|
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>
|
</button>
|
||||||
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="header-language-switcher">
|
<form action="{% url 'set_language' %}" method="post" class="language_form">
|
||||||
<form action="{% url 'set_language' %}" method="post" class="language_form">
|
{% csrf_token %}
|
||||||
{% csrf_token %}
|
<input name="next" type="hidden" value="{{ request.path }}"/>
|
||||||
<input name="next" type="hidden" value="{{ request.path }}"/>
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="header-language-switcher">
|
||||||
{% for language in languages %}
|
{% 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" %}
|
{% include "oxyan/partials/flags/"|add:language.code|add:".svg" %}
|
||||||
<span>{{ language.name_local|title }}</span>
|
</span>
|
||||||
</button>
|
<span>{{ language.name_local|title }}</span>
|
||||||
</li>
|
</button>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</form>
|
</div>
|
||||||
</ul>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<a
|
<a
|
||||||
|
|||||||
Reference in New Issue
Block a user