Skip to content

Instantly share code, notes, and snippets.

@frantic1048
Created November 27, 2015 12:09
Show Gist options
  • Save frantic1048/10d06f011173e2d5cc58 to your computer and use it in GitHub Desktop.
Save frantic1048/10d06f011173e2d5cc58 to your computer and use it in GitHub Desktop.
A stylish style restyling awesome Tree Style Tab addon on Firefox, e.g. adding a background image XD
/* author:
* frantic1048 (https://github.com/frantic1048)
* description:
* a simple stylish style costmizing key style of Tree Style Tab addon for Firefox
* Tree Style Tab: https://addons.mozilla.org/en-US/firefox/addon/tree-style-tab/
* usage:
* create a blank stylish style, paste this file into editor, click save ~
* comment:
* modify the rules to fit your flavor :P
*/
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
/* whole widget */
.tabbrowser-strip[treestyletab-mode="vertical"] {
background-image: url("<background image URL as you wish>") !important;
background-position: bottom left !important;
background-size: contain !important;
background-repeat: no-repeat, !important;
background-attachment: scroll !important;
background-color: transparent !important;
}
#main-window:-moz-window-inactive
.tabbrowser-strip:not([treestyletab-style~="aero"])[treestyletab-mode="vertical"] {
/* inactive styles */
}
/* tabs */
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[visuallyselected="true"] {
background: rgba(227, 45, 70, 0.7) !important;
border: none !important;
box-shadow: none !important;
}
#main-window:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[visuallyselected="true"] {
/* inactive style */
background: rgba(227, 45, 70, 0.7) !important;
border: none !important;
box-shadow: none !important;
}
/* tab label */
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tab-text {
font-size: 11px;
font-weight: normal !important;
color: #000000 !important;
text-align: start;
text-shadow: none !important;
margin-bottom: 1px;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[visuallyselected="true"] .tab-text {
/* inactive style */
font-weight: bold !important;
color: #fff !important;
text-shadow: none !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment