theme-store/themes/a6335949-4465-4b71-926c-4a52d34bc9c0/chrome.css
RobotoSkunk 20befe32f9
Update theme a6335949-4465-4b71-926c-4a52d34bc9c0 (better-findbar)
- Moved vertical position to the bottom by default
- Fixed animations
2025-05-09 14:20:01 -06:00

105 lines
No EOL
2.6 KiB
CSS

:root {
--better-findbar-transform-translateY: 150px;
--better-findbar-transform-translateX: -50%;
--better-findbar-position-top: auto;
--better-findbar-position-bottom: 15px;
--better-findbar-position-left: 50%;
--better-findbar-position-right: auto;
}
.browserContainer {
overflow: clip
}
findbar {
display: flex !important;
border-radius: var(--zen-border-radius) !important;
margin: 0px !important;
width: 90% !important;
max-width: 800px;
height: auto !important;
position: absolute !important;
top: var(--better-findbar-position-top);
bottom: var(--better-findbar-position-bottom);
left: var(--better-findbar-position-left);
right: var(--better-findbar-position-right);
transform: translateX(var(--better-findbar-transform-translateX)) translateY(0);
overflow: unset !important;
box-shadow: var(--box-shadow-10);
background: var(--zen-colors-tertiary) !important;
border: 1px solid var(--zen-colors-border) !important;
transition: transform 0.35s ease !important;
visibility: visible !important;
opacity: 1 !important;
& .findbar-container {
flex-wrap: wrap;
overflow-x: auto !important;
height: auto !important;
row-gap: 10px;
& > :first-child {
width: 100% !important;
}
& .findbar-textbox {
flex-grow: 1;
}
}
&[hidden="true"] {
transform: translateX(var(--better-findbar-transform-translateX)) translateY(var(--better-findbar-transform-translateY));
}
@starting-style {
transform: translateX(var(--better-findbar-transform-translateX)) translateY(var(--better-findbar-transform-translateY));
}
}
/* Horizontal Position */
body:has(
#theme-Better-Find-Bar[theme-better_find_bar-horizontal_position="left"]
) {
--better-findbar-transform-translateX: 0%;
--better-findbar-position-left: 15px;
--better-findbar-position-right: auto;
}
body:has(
#theme-Better-Find-Bar[theme-better_find_bar-horizontal_position="right"]
) {
--better-findbar-transform-translateX: 0%;
--better-findbar-position-left: auto;
--better-findbar-position-right: 15px;
}
body:has(
#theme-Better-Find-Bar[theme-better_find_bar-vertical_position="top"]
) {
--better-findbar-transform-translateY: -150px;
--better-findbar-position-bottom: auto;
--better-findbar-position-top: 15px;
}
/* Background blur */
@media (-moz-bool-pref: "theme.better_find_bar.transparent_background") {
findbar, findbar .findbar-textbox:not([status="notfound"]) {
backdrop-filter: blur(8px);
background: color-mix(in hsl, var(--zen-colors-tertiary), transparent 30%) !important;
}
findbar .findbar-textbox:not([status="notfound"]) {
background: color-mix(in hsl, var(--zen-colors-tertiary), transparent 10%) !important;
}
}