1
0
Fork 0
mirror of https://github.com/betaflight/betaflight-configurator.git synced 2025-07-25 17:25:16 +03:00

Fixed collapsed sidebar (#4356)

* Fixed collapsed sidebar

* Fix icons in sidebar & scrollbar
This commit is contained in:
Yaros 2025-02-25 16:19:57 +01:00 committed by GitHub
parent 8dc2897a13
commit 70513bc8f5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -655,7 +655,16 @@ input[type="number"] {
padding: 1rem; padding: 1rem;
padding-right: 0.5rem; padding-right: 0.5rem;
background-color: var(--surface-100); background-color: var(--surface-100);
&::-webkit-scrollbar {
width: 0.3rem;
height: 2em;
}
&::-webkit-scrollbar-thumb {
background: var(--surface-600);
}
} }
#content { #content {
transition: all 0.2s; transition: all 0.2s;
overflow-x: hidden; overflow-x: hidden;
@ -760,8 +769,8 @@ each(@tabIcons, {
.ic_@{key} { .ic_@{key} {
&::before { &::before {
content: " "; content: " ";
width: 1rem; min-width: 1rem;
height: 1rem; min-height: 1rem;
mask: @value no-repeat center center; mask: @value no-repeat center center;
-webkit-mask: @value no-repeat center center; -webkit-mask: @value no-repeat center center;
background-color: var(--surface-700); background-color: var(--surface-700);
@ -1834,13 +1843,13 @@ each(range(12), {
overflow-y: auto; overflow-y: auto;
} }
} }
@media only screen and (max-device-height: 750px) { @media (max-height: 750px) {
.tab_container { .tab_container {
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
} }
} }
@media only screen and (max-width: 1055px) { @media (max-width: 1055px) {
#tabs { #tabs {
li { li {
a { a {
@ -1917,26 +1926,18 @@ each(range(12), {
} }
} }
} }
@media only screen and (max-device-width: 1055px) { @media (max-width: 1055px) {
#tabs { #tabs {
li { li {
a { a {
font-weight: normal;
font-size: 12px;
padding-left: 60px;
padding-top: 6px; padding-top: 6px;
padding-bottom: 2px; padding-bottom: 6px;
content: ""; }
transition: none; ::before {
text-overflow: clip; padding-left: 3px;
white-space: nowrap;
overflow: hidden;
} }
} }
} }
.tab_container {
width: 42px;
}
#content { #content {
width: calc(100% - 42px); width: calc(100% - 42px);
} }