diff --git a/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/chrome.css b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/chrome.css new file mode 100644 index 00000000..1038499c --- /dev/null +++ b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/chrome.css @@ -0,0 +1,34 @@ + +#browser:has(#urlbar[open][zen-floating-urlbar="true"], #searchbar:focus-within) .browserContainer { + pointer-events: none; + transform-origin: center; + filter: blur(10px) brightness(70%) saturate(50%) opacity(70%) !important; + transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1) !important; +} + +#urlbar[open][zen-floating-urlbar="true"], +#searchbar:focus-within { + animation: urlbarFloat 0.3s cubic-bezier(0.19, 1, 0.22, 1) forwards; + backdrop-filter: blur(8px); + transform-origin: top; +} + +@keyframes urlbarFloat { + 0% { + transform: translateY(-5px) scale(0.98); + opacity: 0; + } + 100% { + transform: translateY(0) scale(1); + opacity: 1; + } +} + +#urlbar[zen-floating-urlbar="true"], +#searchbar { + transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1); +} + +.browserContainer { + transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1) !important; +} diff --git a/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/image.png b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/image.png new file mode 100644 index 00000000..6187c924 Binary files /dev/null and b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/image.png differ diff --git a/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/readme.md b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/readme.md new file mode 100644 index 00000000..19440998 --- /dev/null +++ b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/readme.md @@ -0,0 +1,6 @@ + +# Floating Blur + +This Mod/Theme animates the Floating URL Bar in Zen and also blurs the background when its opened. + +![Floating Blur](../assets/floating_blur.png) diff --git a/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/theme.json b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/theme.json new file mode 100644 index 00000000..c01a6b8f --- /dev/null +++ b/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/theme.json @@ -0,0 +1,14 @@ +{ + "id": "96f788de-ff6f-4f7c-a66b-7182c6285778", + "name": "Floating Blur", + "description": "This Mod/Theme animates the Floating URL Bar in Zen and also blurs the background when its opened.", + "homepage": "https://github.com/S42yt/Zen-Mods", + "style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/chrome.css", + "readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/readme.md", + "image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/96f788de-ff6f-4f7c-a66b-7182c6285778/image.png", + "author": "S42yt", + "version": "1.0.0", + "tags": [], + "createdAt": "2025-02-17", + "updatedAt": "2025-02-17" +} \ No newline at end of file