diff --git a/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/chrome.css b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/chrome.css new file mode 100644 index 00000000..4f3183af --- /dev/null +++ b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/chrome.css @@ -0,0 +1,98 @@ + +/** +* Zen Mod: Better Workspace Buttons +* Re-style and add customization options for the Workspace Buttons. +* Pontus Sundén +*/ + :root { + /** + --psu-better_ws_buttons-button_font_size: 16px; + --psu-better_ws_buttons-button_opacity: 0.7; + --psu-better_ws_buttons-button_magnification: 1.1; + /**/ + --psu-better_ws_buttons-button_active_size: calc(var(--psu-better_ws_buttons-button_font_size) * var(--psu-better_ws_buttons-button_magnification)); + --psu-better_ws_buttons-button_marker_size: calc(var(--psu-better_ws_buttons-button_active_size) * 0.225); + --psu-better_ws_buttons-button_size: calc(var(--psu-better_ws_buttons-button_active_size) * 1.5 + var(--psu-better_ws_buttons-button_marker_size)); + --psu-better_ws_buttons-button_outline_color: light-dark( + rgba(1, 1, 1, calc(var(--psu-better_ws_buttons-button_opacity) * 0.35)), + rgba(255, 255, 255, calc(var(--psu-better_ws_buttons-button_opacity) * 0.35)) + ); + --psu-better_ws_buttons-button_hover_background: light-dark( + rgba(1, 1, 1, calc(var(--psu-better_ws_buttons-button_opacity) * 0.15)), + rgba(255, 255, 255, calc(var(--psu-better_ws_buttons-button_opacity) * 0.25)) + ); + --psu-better_ws_buttons-toolbar_padding: calc(2 * var(--toolbarbutton-inner-padding) + 16px + var(--zen-element-separation)); + } + +#zen-sidebar-bottom-buttons { + @media (-moz-bool-pref: 'psu.better_ws_buttons.show_separator') { + border-top: 1px solid light-dark(rgba(1, 1, 1, 0.075), rgba(255, 255, 255, 0.1)) !important; + } + #zen-workspaces-button { + position: absolute !important; + font-size: var(--psu-better_ws_buttons-button_font_size) !important; + bottom: calc(var(--zen-toolbox-padding) * -0.7); + margin: 0 var(--psu-better_ws_buttons-toolbar_padding) !important; + width: calc(100% - var(--psu-better_ws_buttons-toolbar_padding) * 2) !important; + +toolbarbutton { + filter: grayscale(0) !important; + opacity: var(--psu-better_ws_buttons-button_opacity) !important; + filter: saturate(calc(var(--psu-better_ws_buttons-button_opacity) * 0.5)) !important; + transition-duration: 0.05s, 0.05s, 0.05s !important; + height: var(--psu-better_ws_buttons-button_size) !important; + width: var(--psu-better_ws_buttons-button_size) !important; + border-radius: calc(var(--psu-better_ws_buttons-button_active_size) * 0.4) !important; + +&:hover { + opacity: 1 !important; + filter: saturate(1) !important; + font-size: var(--psu-better_ws_buttons-button_active_size) !important; + background: var(--psu-better_ws_buttons-button_hover_background) !important; + } + &[active='true'] { + font-size: var(--psu-better_ws_buttons-button_active_size) !important; + opacity: 1 !important; + filter: saturate(1) !important; + &:hover { + background: var(--psu-better_ws_buttons-button_hover_background) !important; + } + } + .zen-workspace-icon { + text-shadow: 0px 0px 1px var(--psu-better_ws_buttons-button_outline_color); + } + } + +@media (-moz-bool-pref: 'psu.better_ws_buttons.show_indicator') { + &:not([overflow]) toolbarbutton[active='true']::before { + content: ''; + position: absolute; + margin: 0 auto; + bottom: 0; + font-size: var(--psu-better_ws_buttons-button_active_size); + width: var(--psu-better_ws_buttons-button_marker_size); + height: var(--psu-better_ws_buttons-button_marker_size); + background: light-dark(rgba(1, 1, 1, calc(var(--psu-better_ws_buttons-button_opacity) * 0.75)), rgba(255, 255, 255, calc(var(--psu-better_ws_buttons-button_opacity) * 0.75))); + border-radius: 100%; + } + } + } + } + +#zen-current-workspace-indicator-container { + .zen-current-workspace-indicator { + .zen-current-workspace-indicator-icon { + text-shadow: 0px 0px 1px var(--psu-better_ws_buttons-button_outline_color); + font-size: calc(var(--psu-better_ws_buttons-button_font_size) + 3px) !important; + } + } + } + +#PanelUI-zen-workspaces { + toolbarbutton { + .zen-workspace-icon { + font-size: var(--psu-better_ws_buttons-button_font_size) !important; + text-shadow: 0px 0px 1px var(--psu-better_ws_buttons-button_outline_color); + } + } + } diff --git a/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/image.png b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/image.png new file mode 100644 index 00000000..a2954cfc Binary files /dev/null and b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/image.png differ diff --git a/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/readme.md b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/readme.md new file mode 100644 index 00000000..0a1bf5cf --- /dev/null +++ b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/readme.md @@ -0,0 +1,8 @@ + +# Zen Mod: Glance buttons to the right + +Move the at a glance buttons to the right side of the window. + +![screenshot](./glance-buttons-right.png) + +[Source code at GitHub](https://github.com/psu/zen-mods) diff --git a/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/theme.json b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/theme.json new file mode 100644 index 00000000..a1f6eb9c --- /dev/null +++ b/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/theme.json @@ -0,0 +1,14 @@ +{ + "id": "7ae091c4-3800-4378-b0d2-a51d517306c5", + "name": "Better Workspace Buttons", + "description": "Re-style and add customization options for the Workspace Buttons.", + "homepage": "https://github.com/psu/zen-mods", + "style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/chrome.css", + "readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/readme.md", + "image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/7ae091c4-3800-4378-b0d2-a51d517306c5/image.png", + "author": "psu", + "version": "1.0.0", + "tags": [], + "createdAt": "2025-03-28", + "updatedAt": "2025-03-28" +} \ No newline at end of file