kamp/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Stirling-Tools/Stirling-PDF.git synced 2024-11-11 02:10:11 +01:00
Code

Update: fix dropdown text wrap

Browse Source
This commit is contained in:
Rectos VX 2024-05-08 17:42:36 +04:00
parent 34e2128a39
commit 0f43723250
2 changed files with 23 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/main/resources/static/css/navbar.css
View File

@ -102,7 +102,7 @@
border-radius: 1rem;
}
.icon + .icon {
.icon+.icon {
margin-left: -4px;
}
@ -111,9 +111,14 @@
margin-right: 4px;
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
text-decoration: none;
vertical-align: middle;
}
.dropdown-item .icon-text {
text-wrap: wrap;
word-break: break-word;
width: 80%;
}
span.icon-text::after {
@ -151,8 +156,8 @@ span.icon-text::after {
transform: translateY(-2px);
}
.navbar-toggler{
color: var(--md-sys-color-on-surface-variant);
.navbar-toggler {
color: var(--md-sys-color-on-surface-variant);
}
.dropdown-menu.scrollable-y {
@ -168,7 +173,7 @@ color: var(--md-sys-color-on-surface-variant);
.scrollable-y::-webkit-scrollbar {
background: transparent;
width: 0.7rem;
width: 0.7rem;
}
.scrollable-y::-webkit-scrollbar-track {
@ -176,7 +181,7 @@ color: var(--md-sys-color-on-surface-variant);
}
.scrollable-y::-webkit-scrollbar-thumb {
border-radius: 2rem;
border-radius: 2rem;
background-color: var(--md-sys-color-surface-5);
border: 3px solid var(--md-sys-color-surface-5);
}
@ -262,4 +267,13 @@ color: var(--md-sys-color-on-surface-variant);
.dropdown-item.active.advance {
color: var(--md-nav-on-section-color-advance);
background-color: var(--md-nav-section-color-advance);
}
/* Dropdown min-width */
.dropdown-mw-28 {
min-width: 280px;
}
.dropdown-mw-20 {
min-width: 200px;
}

4
src/main/resources/templates/fragments/navbar.html
View File

@ -293,7 +293,7 @@
star
</span>
</a>
<div class="dropdown-menu px-xl-2 px-2" id="favoritesDropdown" aria-labelledby="navbarDropdown-5">
<div class="dropdown-menu dropdown-mw-28 px-xl-2 px-2" id="favoritesDropdown" aria-labelledby="navbarDropdown-5">
<!-- Dropdown items will be added here by JavaScript -->
</div>
</li>
@ -312,7 +312,7 @@
</span>
</a>
<div class="dropdown-menu px-xl-2 px-2" aria-labelledby="languageDropdown">
<div class="scrollable-y">
<div class="scrollable-y dropdown-mw-20">
<th:block th:insert="~{fragments/languages :: langs}"></th:block>
</div>
</div>