diff --git a/themes/81f72fe0-2c90-492f-b916-045521d6dac7/chrome.css b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/chrome.css new file mode 100644 index 000000000..699037c4b --- /dev/null +++ b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/chrome.css @@ -0,0 +1,126 @@ + +@counter-style blank { + system: cyclic; + symbols: ""; +} +@counter-style tabhint { + system: fixed; + symbols: "1" "2" "3" "4" "5" "6" "7" "8"; + suffix: ""; + fallback: blank; +} + +#TabsToolbar { + counter-reset: tabcounter; +} + +@media not (-moz-pref("mod.tab_hotkey_hints.essentials")) { + #zen-essentials .tab-content::after { + display: none; + } +} + +@media -moz-pref("mod.tab_hotkey_hints.last_tab") { + zen-workspace[active="true"] .zen-workspace-tabs-section + > tab:not([pinned]):not([aria-hidden="true"]):not([folder-active="true"]):nth-last-child(2), + zen-workspace[active="true"] tab-group:not(:has(~ tab)) + tab:not([pinned]):not([aria-hidden="true"]):not([folder-active="true"]):nth-last-child(1) { + .tab-content::before { + content: "9"; + display: unset; + z-index: 1; + font-size: var(--mod-tab_hotkey_hints-font_size); + font-weight: var(--mod-tab_hotkey_hints-font_weight); + position: absolute; + opacity: var(--mod-tab_hotkey_hints-opacity); + color: var(--mod-tab_hotkey_hints-color); + text-shadow: var(--mod-tab_hotkey_hints-text_shadow); + @media (-moz-pref("mod.tab_hotkey_hints.position", "topright")) { + right: var(--mod-tab_hotkey_hints-h_margin); + top: var(--mod-tab_hotkey_hints-v_margin); + } + @media (-moz-pref("mod.tab_hotkey_hints.position", "topleft")) { + left: var(--mod-tab_hotkey_hints-h_margin); + top: var(--mod-tab_hotkey_hints-v_margin); + } + @media (-moz-pref("mod.tab_hotkey_hints.position", "botright")) { + right: var(--mod-tab_hotkey_hints-h_margin); + bottom: var(--mod-tab_hotkey_hints-v_margin); + } + @media (-moz-pref("mod.tab_hotkey_hints.position", "botleft")) { + left: var(--mod-tab_hotkey_hints-h_margin); + bottom: var(--mod-tab_hotkey_hints-v_margin); + } + } + } +} +@media not (-moz-pref("mod.tab_hotkey_hints.last_tab")) { + zen-workspace[active="true"] .zen-workspace-tabs-section + > tab:not([pinned]):not([aria-hidden="true"]):not([folder-active="true"]):nth-last-child(2), + zen-workspace[active="true"] tab-group:not(:has(~ tab)) + tab:not([pinned]):not([aria-hidden="true"]):not([folder-active="true"]):nth-last-child(1) { + .tab-content::before { + display: none; + } + } +} + +#tabbrowser-tabs { + #zen-essentials tab, + zen-workspace[active="true"] .zen-workspace-tabs-section > zen-folder:not([collapsed]) tab[aria-hidden="true"][folder-active="true"]:not([style*="height: 0px"]), + zen-workspace[active="true"] .zen-workspace-tabs-section > zen-folder:not([collapsed]) tab:not([aria-hidden="true"]):not([style*="height: 0px"]), + zen-workspace[active="true"] .zen-workspace-tabs-section > tab[aria-hidden="true"][folder-active="true"]:not([style*="height: 0px"]), + zen-workspace[active="true"] .zen-workspace-tabs-section > tab:not([aria-hidden="true"]):not([style*="height: 0px"]):not([zen-empty-tab="true"]):nth-child(-n+9) { + counter-increment: tabcounter; + } + #zen-essentials tab .tab-content::after, + zen-workspace[active="true"] .zen-workspace-tabs-section > zen-folder:not([collapsed]) tab[aria-hidden="true"][folder-active="true"]:not([style*="height: 0px"]) .tab-content::after, + zen-workspace[active="true"] .zen-workspace-tabs-section > zen-folder:not([collapsed]) tab:not([aria-hidden="true"]):not([style*="height: 0px"]) .tab-content::after, + zen-workspace[active="true"] .zen-workspace-tabs-section > tab[aria-hidden="true"][folder-active="true"]:not([style*="height: 0px"]) .tab-content::after, + zen-workspace[active="true"] .zen-workspace-tabs-section > tab:not([aria-hidden="true"]):not([style*="height: 0px"]):nth-child(-n+9) .tab-content::after { + content: counter(tabcounter, tabhint); + font-size: var(--mod-tab_hotkey_hints-font_size); + font-weight: var(--mod-tab_hotkey_hints-font_weight); + position: absolute; + opacity: var(--mod-tab_hotkey_hints-opacity); + color: var(--mod-tab_hotkey_hints-color); + text-shadow: var(--mod-tab_hotkey_hints-text_shadow); + } +} +#tabbrowser-tabs { + #zen-essentials .tab-content::after { + @media (-moz-pref("mod.tab_hotkey_hints.position_essentials", "topright")) { + right: var(--mod-tab_hotkey_hints-h_margin_essentials); + top: var(--mod-tab_hotkey_hints-v_margin_essentials); + } + @media (-moz-pref("mod.tab_hotkey_hints.position_essentials", "topleft")) { + left: var(--mod-tab_hotkey_hints-h_margin_essentials); + top: var(--mod-tab_hotkey_hints-v_margin_essentials); + } + @media (-moz-pref("mod.tab_hotkey_hints.position_essentials", "botright")) { + right: var(--mod-tab_hotkey_hints-h_margin_essentials); + bottom: var(--mod-tab_hotkey_hints-v_margin_essentials); + } + @media (-moz-pref("mod.tab_hotkey_hints.position_essentials", "botleft")) { + left: var(--mod-tab_hotkey_hints-h_margin_essentials); + bottom: var(--mod-tab_hotkey_hints-v_margin_essentials); + } + } + zen-workspace[active="true"] .tab-content::after { + @media (-moz-pref("mod.tab_hotkey_hints.position", "topright")) { + right: var(--mod-tab_hotkey_hints-h_margin); + top: var(--mod-tab_hotkey_hints-v_margin); + } + @media (-moz-pref("mod.tab_hotkey_hints.position", "topleft")) { + left: var(--mod-tab_hotkey_hints-h_margin); + top: var(--mod-tab_hotkey_hints-v_margin); + } + @media (-moz-pref("mod.tab_hotkey_hints.position", "botright")) { + right: var(--mod-tab_hotkey_hints-h_margin); + bottom: var(--mod-tab_hotkey_hints-v_margin); + } + @media (-moz-pref("mod.tab_hotkey_hints.position", "botleft")) { + left: var(--mod-tab_hotkey_hints-h_margin); + } + } +} diff --git a/themes/81f72fe0-2c90-492f-b916-045521d6dac7/image.png b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/image.png new file mode 100644 index 000000000..54e1099e2 Binary files /dev/null and b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/image.png differ diff --git a/themes/81f72fe0-2c90-492f-b916-045521d6dac7/preferences.json b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/preferences.json new file mode 100644 index 000000000..f8691d61d --- /dev/null +++ b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/preferences.json @@ -0,0 +1,125 @@ +[ + { + "property": "mod.tab_hotkey_hints.essentials", + "label": "Enabled for Essentials", + "type": "checkbox", + "defaultValue": true + }, + { + "property": "mod.tab_hotkey_hints.last_tab", + "label": "Enabled on last tab", + "type": "checkbox", + "defaultValue": false + }, + { + "property": "mod.tab_hotkey_hints.font_size", + "label": "Font size", + "type": "string", + "defaultValue": "0.8em", + "placeholder": "0.8em" + }, + { + "property": "mod.tab_hotkey_hints.font_weight", + "label": "Font weight", + "type": "string", + "defaultValue": "500", + "placeholder": "500" + }, + { + "property": "mod.tab_hotkey_hints.opacity", + "label": "Opacity", + "type": "string", + "defaultValue": "1", + "placeholder": "0.9" + }, + { + "property": "mod.tab_hotkey_hints.color", + "label": "Font color", + "type": "string", + "defaultValue": "inherit", + "placeholder": "inherit" + }, + { + "property": "mod.tab_hotkey_hints.text_shadow", + "label": "Shadow", + "type": "string", + "defaultValue": "inherit", + "placeholder": "0px 0px 3px hsl(from var(--zen-primary-color) h 80 15)" + }, + { + "property": "mod.tab_hotkey_hints.position", + "label": "Hint position anchor", + "type": "dropdown", + "defaultValue": "topright", + "options": [ + { + "label": "Top right", + "value": "topright" + }, + { + "label": "Top left", + "value": "topleft" + }, + { + "label": "Bottom right", + "value": "botright" + }, + { + "label": "Bottom left", + "value": "botleft" + } + ] + }, + { + "property": "mod.tab_hotkey_hints.v_margin", + "label": "Vertical margin", + "type": "string", + "defaultValue": "4px", + "placeholder": "4px" + }, + { + "property": "mod.tab_hotkey_hints.h_margin", + "label": "Horizontal margin", + "type": "string", + "defaultValue": "8px", + "placeholder": "8px" + }, + { + "property": "mod.tab_hotkey_hints.position_essentials", + "label": "Hint position anchor for essentials", + "type": "dropdown", + "defaultValue": "topright", + "options": [ + { + "label": "Top right", + "value": "topright" + }, + { + "label": "Top left", + "value": "topleft" + }, + { + "label": "Bottom right", + "value": "botright" + }, + { + "label": "Bottom left", + "value": "botleft" + } + ] + }, + { + "property": "mod.tab_hotkey_hints.v_margin_essentials", + "label": "Vertical margin for essentials", + "type": "string", + "defaultValue": "4px", + "placeholder": "4px" + }, + { + "property": "mod.tab_hotkey_hints.h_margin_essentials", + "label": "Horizontal margin for essentials", + "type": "string", + "defaultValue": "8px", + "placeholder": "8px" + } +] \ No newline at end of file diff --git a/themes/81f72fe0-2c90-492f-b916-045521d6dac7/readme.md b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/readme.md new file mode 100644 index 000000000..fc4e23d17 --- /dev/null +++ b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/readme.md @@ -0,0 +1,20 @@ + +# Tab Hotkey Indicators + +Adds number hints to tabs so you always know which hotkey to press. + +- Adds a number on the ten tabs that have hotkey available (Ctrl+number by default) +- Choose number style + * size + * font weight + * shadow + * opacity +- Choose number position +- Toggle for Essentials & last tab + +There is a measurable but unnoticeable performance impact to using this mod if you have VERY many tabs in the pinned section. Tested n=1000. + +Known issues: + * Collapsed sidebar has issues + * Last tab hint displays over other hints when tab count is small + * Subfolders diff --git a/themes/81f72fe0-2c90-492f-b916-045521d6dac7/theme.json b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/theme.json new file mode 100644 index 000000000..d4996056a --- /dev/null +++ b/themes/81f72fe0-2c90-492f-b916-045521d6dac7/theme.json @@ -0,0 +1,15 @@ +{ + "id": "81f72fe0-2c90-492f-b916-045521d6dac7", + "name": "Tab Hotkey Indicators", + "description": "Adds numbers on tabs to hint to its shortcut key", + "homepage": "https://github.com/ramla/zen-mods/tree/master/tabhotkeyindicators", + "style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/81f72fe0-2c90-492f-b916-045521d6dac7/chrome.css", + "readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/81f72fe0-2c90-492f-b916-045521d6dac7/readme.md", + "image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/81f72fe0-2c90-492f-b916-045521d6dac7/image.png", + "author": "ramla", + "version": "1.0.0", + "tags": [], + "createdAt": "2026-07-16", + "updatedAt": "2026-07-16", + "preferences": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/81f72fe0-2c90-492f-b916-045521d6dac7/preferences.json" +} \ No newline at end of file