amechama/sharkey
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upd: shorten navbars to save space on mobile

Browse Source
This commit is contained in:
blueb 2024-02-05 06:27:29 -05:00
parent e3525b82f9
commit 327d4b3e88
2 changed files with 17 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/frontend/src/ui/deck.vue
View File

@ -325,7 +325,7 @@ body {
}
.rootIsMobile {
padding-bottom: 100px;
padding-bottom: 58px;
}
.main {
@ -446,20 +446,20 @@ body {
.navButton {
position: relative;
padding: 0;
aspect-ratio: 1;
height: 32px;
width: 100%;
max-width: 60px;
margin: auto;
border-radius: var(--radius-full);
background: var(--panel);
border-radius: var(--radius-lg);
background: transparent;
color: var(--fg);
&:hover {
background: var(--panelHighlight);
color: var(--accent);
}
&:active {
background: var(--X2);
color: var(--accent);
}
}
@ -470,15 +470,17 @@ body {
&:hover {
background: linear-gradient(90deg, var(--X8), var(--X8));
color: var(--fgOnAccent);
}
&:active {
background: linear-gradient(90deg, var(--X8), var(--X8));
color: var(--fgOnAccent);
}
}
.navButtonIcon {
font-size: 18px;
font-size: 16px;
vertical-align: middle;
}

14
packages/frontend/src/ui/universal.vue
View File

@ -406,20 +406,20 @@ $widgets-hide-threshold: 1090px;
.navButton {
position: relative;
padding: 0;
aspect-ratio: 1;
height: 32px;
width: 100%;
max-width: 60px;
margin: auto;
border-radius: var(--radius-full);
background: var(--panel);
border-radius: var(--radius-lg);
background: transparent;
color: var(--fg);
&:hover {
background: var(--panelHighlight);
color: var(--accent);
}
&:active {
background: var(--X2);
color: var(--accent);
}
}
@ -430,15 +430,17 @@ $widgets-hide-threshold: 1090px;
&:hover {
background: linear-gradient(90deg, var(--X8), var(--X8));
color: var(--fgOnAccent);
}
&:active {
background: linear-gradient(90deg, var(--X8), var(--X8));
color: var(--fgOnAccent);
}
}
.navButtonIcon {
font-size: 18px;
font-size: 16px;
vertical-align: middle;
}