Add theme: PywalZen

This commit is contained in:
Axenide 2025-05-17 19:24:35 +00:00 committed by GitHub
parent 72dcd86bf2
commit 59c3637a23
5 changed files with 187 additions and 0 deletions

View file

@ -0,0 +1,130 @@
:root {
--zen-primary-color: #d9d9d9 !important;
--zen-colors-primary: var(--tab-loading-fill) !important;
--zen-colors-secondary: var(--tab-loading-fill) !important;
--toolbarbutton-icon-fill: var(--tab-loading-fill) !important;
}
:root:has(#theme-PywalZen[uc-pywalzen-darkness="default"]) {
--zen-colors-tertiary: var(--lwt-accent-color) !important;
--zen-main-browser-background: var(--lwt-accent-color) !important;
--zen-themed-toolbar-bg: var(--lwt-accent-color) !important;
--arrowpanel-background: var(--lwt-accent-color) !important;
#urlbar[breakout-extend="true"] > #urlbar-background {
background: var(--lwt-accent-color) !important;
}
}
:root:has(#theme-PywalZen[uc-pywalzen-darkness="dark"]) {
--zen-colors-tertiary: color-mix(
in srgb,
var(--lwt-accent-color),
black 25%
) !important;
--zen-main-browser-background: color-mix(
in srgb,
var(--lwt-accent-color),
black 25%
) !important;
--zen-themed-toolbar-bg: color-mix(
in srgb,
var(--lwt-accent-color),
black 25%
) !important;
--arrowpanel-background: color-mix(
in srgb,
var(--lwt-accent-color),
black 25%
) !important;
#urlbar[breakout-extend="true"] > #urlbar-background {
background: color-mix(
in srgb,
var(--lwt-accent-color),
black 25%
) !important;
}
}
:root:has(#theme-PywalZen[uc-pywalzen-darkness="darker"]) {
--zen-colors-tertiary: color-mix(
in srgb,
var(--lwt-accent-color),
black 50%
) !important;
--zen-main-browser-background: color-mix(
in srgb,
var(--lwt-accent-color),
black 50%
) !important;
--zen-themed-toolbar-bg: color-mix(
in srgb,
var(--lwt-accent-color),
black 50%
) !important;
--arrowpanel-background: color-mix(
in srgb,
var(--lwt-accent-color),
black 50%
) !important;
#urlbar[breakout-extend="true"] > #urlbar-background {
background: color-mix(
in srgb,
var(--lwt-accent-color),
black 50%
) !important;
}
}
:root:has(#theme-PywalZen[uc-pywalzen-darkness="yet-darker"]) {
--zen-colors-tertiary: color-mix(
in srgb,
var(--lwt-accent-color),
black 75%
) !important;
--zen-main-browser-background: color-mix(
in srgb,
var(--lwt-accent-color),
black 75%
) !important;
--zen-themed-toolbar-bg: color-mix(
in srgb,
var(--lwt-accent-color),
black 75%
) !important;
--arrowpanel-background: color-mix(
in srgb,
var(--lwt-accent-color),
black 75%
) !important;
#urlbar[breakout-extend="true"] > #urlbar-background {
background: color-mix(
in srgb,
var(--lwt-accent-color),
black 75%
) !important;
}
}
:root:has(#theme-PywalZen[uc-pywalzen-darkness="pitch-black"]) {
--zen-colors-tertiary: black !important;
--zen-main-browser-background: black !important;
--zen-themed-toolbar-bg: black !important;
--arrowpanel-background: black !important;
#urlbar[breakout-extend="true"] > #urlbar-background {
background: black !important;
}
}
#urlbar:not([focused="true"]):not([breakout-extend="true"])
> #urlbar-background {
background: color-mix(
in srgb,
light-dark(#fff, var(--zen-colors-secondary)) 35%,
transparent 65%
) !important;
}
#commonDialogWindow {
background-color: black !important;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

View file

@ -0,0 +1,31 @@
[
{
"property": "uc.pywalzen.darkness",
"label": "Darkness level",
"type": "dropdown",
"defaultValue": "default",
"options": [
{
"value": "default",
"label": "Default"
},
{
"value": "dark",
"label": "Dark"
},
{
"value": "darker",
"label": "Darker"
},
{
"value": "yet-darker",
"label": "Yet darker"
},
{
"value": "pitch-black",
"label": "Pitch black"
}
],
"disabledOn": []
}
]

View file

@ -0,0 +1,11 @@
# 🎨 PywalZen
*By using some native color variables, this theme makes [Pywalfox](https://github.com/Frewacom/pywalfox) work with [Zen Browser](https://zen-browser.app/) correctly.*
![Screenshot 1](https://raw.githubusercontent.com/Axenide/PywalZen/main/screenshots/1.png)
![Screenshot 2](https://raw.githubusercontent.com/Axenide/PywalZen/main/screenshots/2.png)
![Screenshot 3](https://raw.githubusercontent.com/Axenide/PywalZen/main/screenshots/3.png)
> ⚠️ **CAUTION**
> Use this exclusively with Pywalfox, if not the theme will look wrong causing unreadable text and other issues.

View file

@ -0,0 +1,15 @@
{
"id": "ee621caf-9f7e-47d5-acf2-dec16d32f010",
"name": "PywalZen",
"description": "Enable correct support for Pywalfox!",
"homepage": "https://github.com/Axenide/PywalZen",
"style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/ee621caf-9f7e-47d5-acf2-dec16d32f010/chrome.css",
"readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/ee621caf-9f7e-47d5-acf2-dec16d32f010/readme.md",
"image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/ee621caf-9f7e-47d5-acf2-dec16d32f010/image.png",
"author": "Axenide",
"version": "1.0.0",
"tags": [],
"createdAt": "2025-05-17",
"updatedAt": "2025-05-17",
"preferences": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/ee621caf-9f7e-47d5-acf2-dec16d32f010/preferences.json"
}