diff --git a/themes/898df61d-3887-41da-8332-fa5ee0a8b655/chrome.css b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/chrome.css new file mode 100644 index 00000000..cd4571c4 --- /dev/null +++ b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/chrome.css @@ -0,0 +1,39 @@ + +tab { + --irs-ctxl-logo-opacity: 0.65; + --irs-ctxl-logo-selected-opacity: 0.35; + --logo-circle-style: url('data:image/svg+xml,'); + +.tab-context-line { + width: 100% !important; + -webkit-mask-image: var(--logo-circle-style) !important; + mask-image: var(--logo-circle-style) !important; + background-color: var(--identity-icon-color) !important; + mask-repeat: no-repeat !important; + mask-position: right center; + mask-position-x: calc(100% + 20px); + mask-size: contain; + opacity: var(--irs-ctxl-logo-opacity); + transition: mask-position-x 0.2s 0.15s ease-in; + } + +&[zen-essential="true"] { + .tab-context-line { + background-position-x: calc(100% + 25px); + mask-position-x: calc(100% + 25px) !important; + } + } + +&[selected] { + .tab-context-line { + mask-position-x: calc(100% + 15px); + opacity: var(--irs-ctxl-logo-selected-opacity); + } + +&[zen-essential="true"] { + .tab-context-line { + mask-position-x: calc(100% + 19px); + } + } + } +} diff --git a/themes/898df61d-3887-41da-8332-fa5ee0a8b655/image.png b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/image.png new file mode 100644 index 00000000..52c87c3d Binary files /dev/null and b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/image.png differ diff --git a/themes/898df61d-3887-41da-8332-fa5ee0a8b655/readme.md b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/readme.md new file mode 100644 index 00000000..201f5ec3 --- /dev/null +++ b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/readme.md @@ -0,0 +1,2 @@ + +This css mod will show the zen logo as colored container indicator. Just install and it should work. diff --git a/themes/898df61d-3887-41da-8332-fa5ee0a8b655/theme.json b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/theme.json new file mode 100644 index 00000000..2bc006b9 --- /dev/null +++ b/themes/898df61d-3887-41da-8332-fa5ee0a8b655/theme.json @@ -0,0 +1,14 @@ +{ + "id": "898df61d-3887-41da-8332-fa5ee0a8b655", + "name": "Container Tab Zen Logo", + "description": "Replaces the container indicator with the Zen logo.", + "homepage": "https://github.com/irasnalida/Zen-Mods/tree/main/container-tab-zen-logo", + "style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/898df61d-3887-41da-8332-fa5ee0a8b655/chrome.css", + "readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/898df61d-3887-41da-8332-fa5ee0a8b655/readme.md", + "image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/898df61d-3887-41da-8332-fa5ee0a8b655/image.png", + "author": "irasnalida", + "version": "1.0.0", + "tags": [], + "createdAt": "2025-03-13", + "updatedAt": "2025-03-13" +} \ No newline at end of file