Skip to content

Instantly share code, notes, and snippets.

@arthurattwell
Last active July 3, 2023 11:51
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save arthurattwell/19d868330a3c9f668a3f3a69230ac28c to your computer and use it in GitHub Desktop.
Save arthurattwell/19d868330a3c9f668a3f3a69230ac28c to your computer and use it in GitHub Desktop.
Add numbers to Firefox tabs for easier Ctrl+n tab switching
/* userChrome.css can change the Firefox UI.
For details, see https://www.userchrome.org/
Instructions
------------
Save it to your Firefox 'Profile Folder'. To find that folder:
enter about:support in the Firefox address bar and look for it in the list.
Save this file to that folder. Then tell Firefox to load it:
enter about:config in the address bar, and search for userprof
and if that setting exists, set the following value to true:
toolkit.legacyUserProfileCustomizations.stylesheets
Then restart Firefox.
*/
/* Add numbers to tabs, to make switching
with Ctrl/Cmd+[number key] easier.
Thanks to https://github.com/tuomassalo/tab-numbering
*/
tabs {
counter-reset: tab-counter;
}
tab:nth-child(1) .tab-label::before,
tab:nth-child(2) .tab-label::before,
tab:nth-child(3) .tab-label::before,
tab:nth-child(4) .tab-label::before,
tab:nth-child(5) .tab-label::before,
tab:nth-child(6) .tab-label::before,
tab:nth-child(7) .tab-label::before,
tab:nth-child(8) .tab-label::before {
background-color: white;
border-radius: 0.25em;
border: 1px solid white;
box-sizing: border-box;
color: black;
content: counter(tab-counter) "";
counter-increment: tab-counter;
display: block;
float: left;
font-size: 0.8em;
font-weight: bold;
height: 1.5em;
line-height: 1;
margin: 0 0.5em 0 0;
padding: 0.1em 0.25em 0.25em 0.25em;
position: relative;
text-align: center;
top: 0.35em;
vertical-align: middle;
width: 1.4em;
}
@jestho
Copy link

jestho commented Jun 27, 2020

Instead of repeating the nth-child selector, this can be written in one line like this: tab:nth-child(-n+8) .tab-level::before {...}

@gioxx
Copy link

gioxx commented Jul 1, 2020

Instead of repeating the nth-child selector, this can be written in one line like this: tab:nth-child(-n+8) .tab-level::before {...}

I have tried to insert the modification you suggested but it doesn't work (when tested on Firefox).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment