Made urlbar fully floating, much better experience now

This commit is contained in:
mr. m
2025-02-20 13:24:00 +01:00
parent c1870fee32
commit 99b6ef9374
2 changed files with 8 additions and 20 deletions

View File

@@ -58,10 +58,6 @@
&:not([zen-right-side='true']) #nav-bar {
margin-left: 0 !important;
}
& #urlbar[open]:not([zen-floating-urlbar='true']) {
top: 0 !important;
}
}
&:not([zen-right-side='true']) #navigator-toolbox {
@@ -109,11 +105,12 @@
background: var(--zen-main-browser-background-toolbar) !important;
background-attachment: fixed !important;
background-size: 2000px !important; /* Dont ask me why */
backdrop-filter: blur(5px) !important;
/* NOTE: We MUST not add a backdrop-filter if we want the URL
* bar to be floating correctly:
* https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_display/Containing_block#identifying_the_containing_block */
}
& #urlbar[open][zen-floating-urlbar='true'] {
--zen-urlbar-offset: var(--zen-sidebar-width);
transition: left 0.05s ease;
#navigator-toolbox:has(&) {
@@ -261,10 +258,6 @@
right: -1px;
left: auto;
}
& #urlbar[open][zen-floating-urlbar='true'] {
--zen-urlbar-offset: 0px;
}
}
}
}
@@ -347,10 +340,6 @@
& #urlbar {
transform: translateY(0);
&[open]:not([zen-floating-urlbar='true']) {
top: 0 !important;
}
}
&::before {

View File

@@ -416,22 +416,21 @@ button.popup-notification-dropmarker {
min-width: 45vw !important;
--urlbar-container-height: 55px !important;
--urlbar-margin-inline: 10px !important;
position: absolute;
position: fixed;
font-size: 1.15em !important;
@media (-moz-platform: macos) {
font-size: 1.5em !important;
}
top: calc(var(--zen-toolbar-height) * 2) !important;
--zen-urlbar-center: calc(var(--zen-urlbar-offset, 0px) + 28vw);
top: 50% !important;
transform: translate(-50%, -50%);
:root[zen-right-side='true'] & {
right: var(--zen-urlbar-center) !important;
right: 50% !important;
}
:root:not([zen-right-side='true']) & {
left: var(--zen-urlbar-center) !important;
left: 50% !important;
}
#urlbar-container:has(&) {