Add theme: Better Find Bar

This commit is contained in:
RobotoSkunk 2024-11-24 01:56:10 +00:00 committed by GitHub
parent 2b5cea1b68
commit df356b32d4
4 changed files with 84 additions and 0 deletions

View file

@ -0,0 +1,66 @@
:root {
--rs-findbar-open-pos: 15px;
--rs-findbar-closed-pos: -85px;
--rs-findbar-transition-duration: 0.35s;
}
@keyframes rs-findbar-open {
from {
top: var(--rs-findbar-closed-pos);
}
to {
top: var(--rs-findbar-open-pos);
}
}
findbar {
display: flex;
border-radius: var(--zen-border-radius) !important;
margin: 0px !important;
width: 90% !important;
max-width: 800px;
/* height: 50px !important; */
height: auto !important;
position: absolute !important;
top: var(--rs-findbar-open-pos);
left: 50%;
transform: translateX(-50%);
overflow: unset !important;
box-shadow: var(--box-shadow-10);
background: var(--zen-colors-tertiary) !important;
border: 1px solid var(--zen-colors-border) !important;
animation-name: rs-findbar-open !important;
animation-duration: var(--rs-findbar-transition-duration) !important;
animation-timing-function: ease !important;
transition: all var(--rs-findbar-transition-duration) ease !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"] {
top: var(--rs-findbar-closed-pos);
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

View file

@ -0,0 +1,4 @@
# Better Find Bar
Improves the find bar by matching the browser theme, making it floating, more responsive, and moving it to the top of the page.

View file

@ -0,0 +1,14 @@
{
"id": "a6335949-4465-4b71-926c-4a52d34bc9c0",
"name": "Better Find Bar",
"description": "Improves the find bar, making it floating, more responsive, and moving it to the top of the page.",
"homepage": "https://github.com/RobotoSkunk/zen-better-findbar",
"style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/a6335949-4465-4b71-926c-4a52d34bc9c0/chrome.css",
"readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/a6335949-4465-4b71-926c-4a52d34bc9c0/readme.md",
"image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/a6335949-4465-4b71-926c-4a52d34bc9c0/image.png",
"author": "RobotoSkunk",
"version": "1.0.0",
"tags": [],
"createdAt": "2024-11-24",
"updatedAt": "2024-11-24"
}