Mathis/allianceauth
1
0
Fork 0
mirror of https://gitlab.com/allianceauth/allianceauth.git synced 2025-07-15 23:40:17 +02:00
Code Issues Packages Projects Releases Wiki Activity

[CHANGE] Side menu improvements

Browse Source 
- Increase width to 325px
- Add some CSS tricks to ensure long link names don't break the menu
This commit is contained in:
Peter Pfeufer 2024-01-23 15:23:48 +01:00
parent 2bb518f7e0
commit 7425176b3f
No known key found for this signature in database
GPG Key ID: 6051D2C6AD4EBC27
3 changed files with 24 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
allianceauth/framework/static/allianceauth/framework/css/auth-framework.css
View File

@ -13,6 +13,26 @@
} }
} }
/* Side Navigation
------------------------------------------------------------------------------------- */
@media all {
#sidebar > div {
width: 325px;
}
#sidebar-menu li > a,
#sidebar-menu li > ul > li > a {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
max-width: 210px;
}
#sidebar-menu li > ul > li > a {
max-width: 189px;
}
}
/* Cursor classes /* Cursor classes
------------------------------------------------------------------------------------- */ ------------------------------------------------------------------------------------- */
@media all { @media all {

6
allianceauth/menu/templates/menu/menu-item-bs5.html
View File

@ -10,16 +10,16 @@
</a> </a>
{% if item.count >= 1 %} {% if item.count >= 1 %}
<span class="badge bg-primary m-2 align-self-center {% if item.items|length == 0 %}me-4{% endif %}"> <span class="badge bg-primary m-2 align-self-center {% if item.items|length == 0 %}me-2{% endif %}">
{{ item.count }} {{ item.count }}
</span> </span>
{% elif item.url %} {% elif item.url %}
<span class="pill m-2 me-4 align-self-center fas fa-external-link-alt"></span> <span class="pill m-2 me-2 align-self-center fas fa-external-link-alt" title="{% translate 'External link' %}"></span>
{% endif %} {% endif %}
{% if item.items|length > 0 %} {% if item.items|length > 0 %}
<span <span
class="pill m-2 me-4 align-self-center fas fa-solid fa-chevron-down" class="pill m-2 me-2 align-self-center fas fa-solid fa-chevron-down"
type="button" type="button"
data-bs-toggle="collapse" data-bs-toggle="collapse"
data-bs-target="#id-{{ item.text|slugify }}" data-bs-target="#id-{{ item.text|slugify }}"

2
allianceauth/menu/templates/menu/sortable-side-menu.html
View File

@ -4,7 +4,7 @@
<div class="col-auto px-0"> <div class="col-auto px-0">
<div class="collapse collapse-horizontal" tabindex="-1" id="sidebar"> <div class="collapse collapse-horizontal" tabindex="-1" id="sidebar">
<div style="width: 300px;"> <div>
<div class="nav-padding navbar-dark bg-dark text-light px-0 d-flex flex-column overflow-hidden vh-100 {% if not user.is_authenticated %}position-relative{% endif %}"> <div class="nav-padding navbar-dark bg-dark text-light px-0 d-flex flex-column overflow-hidden vh-100 {% if not user.is_authenticated %}position-relative{% endif %}">
{% if user.is_authenticated %} {% if user.is_authenticated %}
<ul id="sidebar-menu" class="navbar-nav flex-column mb-auto overflow-auto pt-2"> <ul id="sidebar-menu" class="navbar-nav flex-column mb-auto overflow-auto pt-2">