[UI] Main menu tweaks (#848)

* [UI] Fix the main menu overflow
* [UI] Show the main menu "Account" button text
* [UI] Fix a bug causing a scrollbar to appear in the menu sometimes
* [UI] Replace the png logo with a svg
This commit is contained in:
Cinder 2025-01-22 05:59:52 -08:00 committed by GitHub
parent 7e4d041678
commit ddd408ce2c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 34 additions and 11 deletions

View File

@ -18,11 +18,11 @@ nav.navigation {
a.nav-logo-link {
display: flex;
height: 3rem;
width: 3rem;
margin: 0.5rem;
height: 3.25rem;
width: 3.25rem;
margin: 0.25rem;
background-image: url("main-logo.png");
background-image: url("main-logo.svg");
background-repeat: no-repeat;
background-size: contain;
background-position-y: center;
@ -226,15 +226,17 @@ nav.navigation, body.nav-toggled nav.navigation {
"logo primary help tools "
"logo secondary secondary secondary"
;
grid-template-columns: min-content min-content 1fr min-content;
grid-template-rows: 1fr 1fr;
grid-template-columns: min-content min-content minmax(0, 1fr) min-content;
grid-template-rows: 1.75em 1.75em;
padding: 0 1em 1em;
box-sizing: border-box;
height: unset;
overflow-y: hidden; // overrides mobile hack allowing the menu scrolling
.nav-logo {
a.nav-logo-link { margin: 0.5em 0.25em 0 0; }
a.nav-logo-link { margin: 0.25rem 0.5rem 0 0; }
}
.nav-offset, .nav-controls { display: none; }
@ -312,13 +314,20 @@ nav.navigation, body.nav-toggled nav.navigation {
}
.nav-tools {
li a {
span { display: none; }
i { color: themed("color-link"); }
&:hover i { color: themed("color-link-hover"); }
li {
a {
i { color: themed("color-link"); }
&:hover i { color: themed("color-link-hover"); }
}
&.nav-tools-themes, &.nav-tools-settings {
a span { display: none; }
}
}
}
.nav-help {
overflow: hidden;
li.current a {
background-color: themed("color-foreground");
i { display: none; }

View File

@ -0,0 +1,14 @@
<svg width="256" height="256" xmlns="http://www.w3.org/2000/svg">
<path fill="none" d="M18.123255-1.5991108H274.12325V254.40089H18.123255Z" style="fill:#000;fill-opacity:0"/>
<path fill="#fcbf31" d="M144.58325 11.080889c4.14-1.6599998 8.08 1.6 9.53 5.31 3.9 9.31 4.48 19.6 4.75 29.58-5.9-2.89-10.01-8.22-15.41-11.84-4.39-3.28-9.65-4.99-14.83-6.55 4.29-6.3 8.81-13.18 15.96-16.5z"/>
<path fill="#fdfefa" d="M128.62325 27.580889c5.18 1.56 10.44 3.27 14.83 6.55 5.4 3.62 9.51 8.95 15.41 11.84.25 4.35.35 8.71.29 13.07-4.58-.96-9.18-1.81-13.8-2.6-.59-4.45-.54-9.31-3.08-13.19-1.18-2.1-4.06-1.82-5.76-.55-4.28 3.03-6.99 7.67-9.96 11.89-4.66.39-9.27 1.22-13.94 1.4 4.83-9.74 9.98-19.35 16.01-28.41z" style="fill:#fff;fill-opacity:1"/>
<path d="M83.613211 68.837652c87.640329.02324 0 0 88.160039.02324 14.24 24.14 27.9733 54.090278 42.1433 78.270278-1.8233 3.30972-.64565 1.10266-2.46895 4.41238-13.37 23.03.64565-1.10266-40.23382 68.62038l-18.55053.0369c-.05-9.21.05-18.58991-.03-27.79991.1-3.51-2.19-7.06-5.61-8.06-1.73-.35-3.5-.37-5.25-.49 0 2.03 0 4.05.01 6.09 1.43-.01 2.85-.02 4.28-.03-.02 10.02.0688 20.29384.0589 30.30384-3.0777-.0215-6.04347-.1046-9.13116-.0973-.02-1.23-.0677-2.51654-.0877-3.74654-2.17.03-4.34.06-6.52.07 0 1.23 0 2.4067-.01 3.69-1.44999.007-2.86124.023-4.25354.0561-.03-2.16351-.0665-5.22612-.0765-7.68612 3.63-.06 7.27-.14 10.9-.19-.08-9.01.11-18.02-.07-27.02.1-4.59-4.24-8.44-8.73-8.23-4.15-.02-8.24 3.19-8.48 7.47-.3 5.89.03 11.8-.1 17.7l6.48.09c.07-6.44-.1-12.89.16-19.34 1.38.01 2.77.02 4.16.03.04 7.83.01 15.67 0 23.5-3.59.02-7.19.04-10.79.07.01 4.49-.01 8.98 0 13.47-1.55 0-3.09 0-4.64.01-.01-2.19-.02-4.37-.02-6.55-3.62-.01-7.24-.03-10.86-.08 0-7.84-.01-15.68.02-23.52l4.29.03c.02 6.41-.01 12.81.03 19.22 2.18-.01 4.35-.03 6.53-.04-.14-6.13.31-12.27-.18-18.38-.72-5.07-6.77-8.06-11.41-6.27-3.42999 1.02-5.809995 4.42-5.739995 7.97-.12 9.2.02 18.41-.04 27.61-8.710671.0192-8.737563.0415-13.706785.03-13.85-25.46-29.373215-50.11-43.143215-75.61 5.9-11.72 13.07-22.74 19.37-34.24 3.24-6.09 7.21-11.730001 10.25-17.919998 4.62-7.65 9.31663-15.463237 13.27663-23.473237z" style="fill:#01549d"/>
<path fill="#fdfefa" d="M194.00325 82.480889c9.46-3.22 19.25-5.51 29.19-6.61 3.11 4.29 6.8 8.42 8.29 13.62.78 4.64.49 9.519997-1.16 13.960001-1.21 3.69-3.04 8.04-.58 11.64-2.45 2.36-5.08 4.51-7.7 6.67-2.24-4.39-4.6-8.72-6.94-13.05 3.29-3.21 7.15-6.47 8.14-11.180001.15-2.44-1.94-4.03-4.06-4.61-5.06-1.57-10.44-1.03-15.65-.86-3.21-3.16-6.69-6.07-9.53-9.58z" style="fill:#fff;fill-opacity:1"/>
<path fill="#fcbf31" d="M223.19325 75.870889c8.13-1.05 16.85-1.55 24.52 1.83 4.62 1.91 5.82 7.77 3.7 11.97-4.71 10.309997-13.42 18.020001-21.6 25.570001l-.07-.15c-2.46-3.6-.63-7.95.58-11.64 1.65-4.440004 1.94-9.320001 1.16-13.960001-1.49-5.2-5.18-9.33-8.29-13.62z"/>
<path fill="#fdfefa" d="M101.23325 98.580889c12.23-14.18 35.43-17.16 50.55-5.93 12.38 8.580001 19.13 24.370001 16.25 39.250001-20.18 1.12-40.36 2.34-60.53 3.49 3.3 7.48 10.14 13.68 18.48 14.55 7.6 1.08 15.42-1.98 20.46-7.72 4.11 3.34 7.81 7.13 11.72 10.71-7.07 7.97-17.27 13.11-27.99 13.31-11.33.75-22.57-4.37-29.95-12.88-13.709995-14.91-13.019995-40.3 1.01-54.780001z" style="fill:#fff;fill-opacity:1"/>
<path fill="#01549d" d="M106.89325 119.21089c3.09-8.75 10.73-16.32 20.29-17.1 10.2-1.48 20.24 5.22 24.04 14.55-14.77.94-29.55 1.8-44.33 2.55z"/>
<path fill="#fdfefa" d="M119.66325 184.53089c.24-4.28 4.33-7.49 8.48-7.47 4.49-.21 8.83 3.64 8.73 8.23.18 9-.01 18.01.07 27.02-3.63.05-7.27.13-10.9.19.01 2.46.02 4.93.05 7.4.03 2.63.06 5.25.07 7.88 1.39-.01 2.78-.01 4.18-.02.02-2.54.03-5.09.03-7.63.01-1.23.01-2.46.01-3.69 2.18-.01 4.35-.04 6.52-.07.02 1.23.03 2.46.05 3.69.04 4.54.02 9.09-.03 13.64-5.78-.09-11.55-.04-17.33-.02-.04-4.54 0-9.09-.02-13.63-.01-4.49.01-8.98 0-13.47 3.6-.03 7.2-.05 10.79-.07.01-7.83.04-15.67 0-23.5-1.39-.01-2.78-.02-4.16-.03-.26 6.45-.09 12.9-.16 19.34l-6.48-.09c.13-5.9-.2-11.81.1-17.7z" style="fill:#fff;fill-opacity:1"/>
<path d="M103.33325 184.47089c4.64-1.79 10.95652.77357 11.67652 6.27-.043 6.21661-.0133 12.09009-.0865 18.38-2.18.01-4.35.03-6.53.04-.04-6.41-.01-12.81-.03-19.22l-4.29-.03c-.03 7.84.0177 37.20179.0177 45.04179 3.46782.006 3.65647-.007 4.2409-.001.0191-.61655.0758-14.36901.076-15.36329-1.43207-.0143-3.5049-.029-4.56005-.006.0002-.67445-.13152-5.2698-.13131-6.15215 3.75762.0579 7.66723.0717 11.19678.0805 0 2.18.01 4.36.02 6.55-.28 5.11.69 10.4-.58 15.41-2.38 6.82-13.13 7.16-15.97.53-1.356874-2.06169-.789822-10.67-.83-15.95.07567-9.20784-.04797-18.5726-.03996-27.71661-.07-3.55 2.38996-6.84339 5.81996-7.86339z" style="fill:#fff;fill-opacity:1"/>
<path fill="#fdfefa" d="M141.77325 183.85089c1.75.12 3.52.14 5.25.49 3.42 1 5.71 4.55 5.61 8.06.08 9.21-.02 18.43.03 27.64-.02 6.85.02 13.7-.03 20.55-2.16-.02-4.32-.02-6.49-.02-.09-6.88-.04-13.75-.04-20.62.01-10.01-.06-20.02-.04-30.04-1.43.01-2.85.02-4.28.03-.01-2.04-.01-4.06-.01-6.09z" style="fill:#fff;fill-opacity:1"/>
<path d="M126.09325 220.16473c1.61846-.0142 2.77462-.0196 4.28-.0338 0 2.54-.01 5.09-.03 7.63-1.4.01-2.86538.01-4.25538.02l.005-7.61616z" style="fill:#000;fill-opacity:0" fill="none"/>
</svg>

After

Width:  |  Height:  |  Size: 5.0 KiB