Improve dashboard layout at high zoom factor

Related issue:
https://github.com/uBlockOrigin/uBlock-issues/issues/3211
This commit is contained in:
Raymond Hill 2024-04-16 11:21:06 -04:00
parent 2481e4a130
commit 6152f5269e
No known key found for this signature in database
GPG Key ID: 25E1490B761470C2
3 changed files with 6 additions and 7 deletions

View File

@ -10,6 +10,7 @@ body {
height: 100%; height: 100%;
justify-content: stretch; justify-content: stretch;
overflow: hidden; overflow: hidden;
overflow-y: auto;
width: 100%; width: 100%;
} }
.body { .body {
@ -26,6 +27,7 @@ html:not(.mobile) [data-i18n="1pTrustWarning"] {
flex-grow: 1; flex-grow: 1;
} }
#userFilters { #userFilters {
min-height: 8em;
text-align: left; text-align: left;
word-wrap: normal; word-wrap: normal;
} }

View File

@ -222,7 +222,7 @@ html:not(.mobile) .cm-search-widget .fa-icon:not(.fa-icon-ro):hover {
} }
.cm-search-widget-input input { .cm-search-widget-input input {
flex-grow: 1; flex-grow: 1;
max-width: 16em; max-width: min(16em, 40svw);
} }
.cm-search-widget-count { .cm-search-widget-count {
align-items: center; align-items: center;
@ -238,7 +238,7 @@ html:not(.mobile) .cm-search-widget .fa-icon:not(.fa-icon-ro):hover {
visibility: hidden; visibility: hidden;
} }
.cm-search-widget .sourceURL[href=""] { .cm-search-widget .sourceURL[href=""] {
visibility: hidden; display: none;
} }
:root.mobile .cm-search-widget .sourceURL[href=""] { :root.mobile .cm-search-widget .sourceURL[href=""] {
display: none; display: none;

View File

@ -27,7 +27,8 @@ body.notReady {
} }
#dashboard-nav > span { #dashboard-nav > span {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: nowrap;
overflow-x: auto;
} }
.tabButton { .tabButton {
background-color: transparent; background-color: transparent;
@ -112,10 +113,6 @@ body.noDashboard #dashboard-nav {
border-bottom-color: var(--dashboard-tab-hover-border); border-bottom-color: var(--dashboard-tab-hover-border);
} }
:root.mobile #dashboard-nav > span {
flex-wrap: nowrap;
overflow-x: auto;
}
:root.mobile #dashboard-nav .logo { :root.mobile #dashboard-nav .logo {
display: none; display: none;
} }