From 0326d03d53bf46b4308a4714dc0098e9c87ae0ac Mon Sep 17 00:00:00 2001 From: piro Date: Thu, 1 Apr 2010 14:17:01 +0000 Subject: [PATCH] =?UTF-8?q?Metal,=20Sidebar=E3=81=8C=E3=82=A6=E3=82=A3?= =?UTF-8?q?=E3=83=B3=E3=83=89=E3=82=A6=E3=81=AE=E3=83=95=E3=82=A9=E3=83=BC?= =?UTF-8?q?=E3=82=AB=E3=82=B9=E7=8A=B6=E6=85=8B=E3=82=92=E5=8F=8D=E6=98=A0?= =?UTF-8?q?=E3=81=97=E3=81=AA=E3=81=8F=E3=81=AA=E3=81=A3=E3=81=A6=E3=81=84?= =?UTF-8?q?=E3=81=9F=E3=81=AE=E3=82=92=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit git-svn-id: http://www.cozmixng.org/repos/piro/treestyletab/trunk@6554 599a83e7-65a4-db11-8015-0010dcdd6dc2 --- chrome.manifest | 7 + platform/Darwin/chrome.manifest | 3 + .../treestyletab-inactive-3.0.css | 80 ++++ .../treestyletab-inactive-3.7.css | 80 ++++ .../classic/treestyletab/treestyletab.css | 121 +----- .../treestyletab/metal/base-inactive-3.0.css | 87 +++++ .../treestyletab/metal/base-inactive-3.7.css | 88 +++++ skin/classic/treestyletab/metal/base-tmp.css | 33 -- skin/classic/treestyletab/metal/base.css | 127 +------ skin/classic/treestyletab/metal/metal.css | 3 +- skin/classic/treestyletab/metal/tab-3.5.css | 122 ------ .../treestyletab/metal/tab-inactive-3.5.css | 100 +++++ .../treestyletab/metal/tab-inactive-3.7.css | 100 +++++ skin/classic/treestyletab/sidebar/base.css | 285 +++++++++++++++ .../treestyletab/sidebar/inactive-3.6.css | 52 +++ .../treestyletab/sidebar/inactive-3.7.css | 52 +++ skin/classic/treestyletab/sidebar/sidebar.css | 346 +----------------- 17 files changed, 959 insertions(+), 727 deletions(-) create mode 100644 platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.0.css create mode 100644 platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.7.css create mode 100644 skin/classic/treestyletab/metal/base-inactive-3.0.css create mode 100644 skin/classic/treestyletab/metal/base-inactive-3.7.css delete mode 100644 skin/classic/treestyletab/metal/base-tmp.css create mode 100644 skin/classic/treestyletab/metal/tab-inactive-3.5.css create mode 100644 skin/classic/treestyletab/metal/tab-inactive-3.7.css create mode 100644 skin/classic/treestyletab/sidebar/base.css create mode 100644 skin/classic/treestyletab/sidebar/inactive-3.6.css create mode 100644 skin/classic/treestyletab/sidebar/inactive-3.7.css diff --git a/chrome.manifest b/chrome.manifest index 8c20ca19..d7d7628e 100644 --- a/chrome.manifest +++ b/chrome.manifest @@ -30,6 +30,13 @@ override chrome://treestyletab/skin/group/group-icon chrome://treestyletab/skin/ override chrome://treestyletab/skin/group/group-icon chrome://treestyletab/skin/group/group-fx3-aero.png os=WINNT osversion>=6 override chrome://treestyletab/skin/metal/tab.css chrome://treestyletab/skin/metal/tab-3.5.css appversion>=3.5 +override chrome://treestyletab/skin/metal/tab-inactive.css chrome://treestyletab/skin/metal/tab-inactive-3.5.css +override chrome://treestyletab/skin/metal/tab-inactive.css chrome://treestyletab/skin/metal/tab-inactive-3.7.css appversion>=3.7a4pre +override chrome://treestyletab/skin/metal/base-inactive.css chrome://treestyletab/skin/metal/base-inactive-3.0.css +override chrome://treestyletab/skin/metal/base-inactive.css chrome://treestyletab/skin/metal/base-inactive-3.7.css appversion>=3.7a4pre + +override chrome://treestyletab/skin/sidebar/inactive.css chrome://treestyletab/skin/sidebar/inactive-3.6.css +override chrome://treestyletab/skin/sidebar/inactive.css chrome://treestyletab/skin/sidebar/inactive-3.7.css appversion>=3.7a4pre override chrome://treestyletab/skin/config.css chrome://treestyletab/skin/config-3.7.png appversion>=3.7a1pre diff --git a/platform/Darwin/chrome.manifest b/platform/Darwin/chrome.manifest index a31ee61b..128a03f2 100644 --- a/platform/Darwin/chrome.manifest +++ b/platform/Darwin/chrome.manifest @@ -1,3 +1,6 @@ skin treestyletab-platform classic/1.0 jar:chrome/treestyletab.jar!/skin/classic/treestyletab/ style chrome://browser/content/browser.xul chrome://treestyletab-platform/skin/treestyletab-3.5.css appversion>=3.5 + +override chrome://treestyletab-platform/skin/metal/treestyletab-inactive.css chrome://treestyletab-platform/skin/metal/treestyletab-inactive-3.0.css +override chrome://treestyletab-platform/skin/metal/treestyletab-inactive.css chrome://treestyletab-platform/skin/metal/treestyletab-inactive-3.7.css appversion>=3.7a4pre diff --git a/platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.0.css b/platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.0.css new file mode 100644 index 00000000..8ed49fb3 --- /dev/null +++ b/platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.0.css @@ -0,0 +1,80 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* Square */ + +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab > .tab-image-middle, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab > .tab-close-button, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab[selected="true"] > .tab-image-middle, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab[selected="true"] > .tab-close-button, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab > .tab-image-middle, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab > .tab-close-button, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab[selected="true"] > .tab-image-middle, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab[selected="true"] > .tab-close-button { + height: auto; + margin: 0 !important; + padding: 0 !important; + background: transparent; + width: 0; +} + + +/* Metal */ + +/* horizontal tree */ + +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-image-middle, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-close-button, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-image-middle, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-image-middle { + background-position: left bottom; + background-repeat: repeat-x; +} + +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-image-left, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-image-left, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-image-left, +#main-window:not([active="true"]) + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-image-left { + background-position: left bottom; + background-repeat: no-repeat; +} + diff --git a/platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.7.css b/platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.7.css new file mode 100644 index 00000000..bbaa8cfc --- /dev/null +++ b/platform/Darwin/skin/classic/treestyletab/treestyletab-inactive-3.7.css @@ -0,0 +1,80 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* Square */ + +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab > .tab-image-middle, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab > .tab-close-button, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab[selected="true"] > .tab-image-middle, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab[selected="true"] > .tab-close-button, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab > .tab-image-middle, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab > .tab-close-button, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab[selected="true"] > .tab-image-middle, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab[selected="true"] > .tab-close-button { + height: auto; + margin: 0 !important; + padding: 0 !important; + background: transparent; + width: 0; +} + + +/* Metal */ + +/* horizontal tree */ + +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-image-middle, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-close-button, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-close-button, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-close-button { + background-position: left bottom; + background-repeat: repeat-x; +} + +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-image-right, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab:not([selected="true"]) + .tab-image-right, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-image-right, +#main-window:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] + .tabbrowser-tab[selected="true"] + .tab-image-right { + background-position: left bottom; + background-repeat: no-repeat; +} + diff --git a/platform/Darwin/skin/classic/treestyletab/treestyletab.css b/platform/Darwin/skin/classic/treestyletab/treestyletab.css index c822c641..801b39da 100644 --- a/platform/Darwin/skin/classic/treestyletab/treestyletab.css +++ b/platform/Darwin/skin/classic/treestyletab/treestyletab.css @@ -1,3 +1,5 @@ +@import url("treestyletab-inactive.css"); + @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* Square */ @@ -13,61 +15,6 @@ tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="right"]:n -moz-border-left-colors: ThreeDShadow !important; } -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab > .tab-image-middle, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab > .tab-image-middle, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab > .tab-close-button, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab > .tab-close-button, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab[selected="true"] > .tab-image-middle, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab[selected="true"] > .tab-image-middle, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab[selected="true"] > .tab-close-button, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] - .tabbrowser-tab[selected="true"] > .tab-close-button, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab > .tab-image-middle, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab > .tab-image-middle, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab > .tab-close-button, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab > .tab-close-button, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab[selected="true"] > .tab-image-middle, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab[selected="true"] > .tab-image-middle, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab[selected="true"] > .tab-close-button, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] - .tabbrowser-tab[selected="true"] > .tab-close-button { - height: auto; - margin: 0 !important; - padding: 0 !important; - background: transparent; - width: 0; -} - /* Metal */ @@ -102,43 +49,11 @@ tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="right"]:n .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tab:not([selected="true"]) .tab-close-button, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-image-middle, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-image-middle, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-close-button, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-close-button, #main-window .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tab[selected="true"] .tab-image-middle, #main-window - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-close-button, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-image-middle, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-close-button, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-image-middle, -#main-window:-moz-window-inactive .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tab[selected="true"] .tab-close-button { @@ -154,43 +69,11 @@ tabbrowser[treestyletab-style~="square"][treestyletab-tabbar-position="right"]:n .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tab:not([selected="true"]) .tab-image-right, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-image-left, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-image-right, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-image-left, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab:not([selected="true"]) - .tab-image-right, #main-window .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tab[selected="true"] .tab-image-left, #main-window - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-image-right, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-image-left, -#main-window:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-image-right, -#main-window:not([active="true"]) - .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] - .tabbrowser-tab[selected="true"] - .tab-image-left, -#main-window:-moz-window-inactive .tabbrowser-tabs[treestyletab-style][treestyletab-mode="horizontal"][treestyletab-tabs-indented="true"] .tabbrowser-tab[selected="true"] .tab-image-right { diff --git a/skin/classic/treestyletab/metal/base-inactive-3.0.css b/skin/classic/treestyletab/metal/base-inactive-3.0.css new file mode 100644 index 00000000..b6a2abdc --- /dev/null +++ b/skin/classic/treestyletab/metal/base-inactive-3.0.css @@ -0,0 +1,87 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* tab bar */ + +:root:not([active="true"]) + .tabbrowser-strip[treestyletab-style="metal"][treestyletab-mode="vertical"] { + background: #acacac !important; + border-color: #797979 !important; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([overflow="true"]) + .tabbrowser-arrowscrollbox, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][overflow="true"] + .tabbrowser-arrowscrollbox .scrollbox-innerbox { + background: url("shadow-inactive-l.png") repeat-y top right !important; +} +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"]) + .tabbrowser-arrowscrollbox, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"] + .tabbrowser-arrowscrollbox .scrollbox-innerbox { + background: url("shadow-inactive-r.png") repeat-y top left !important; +} + +:root:not([active="true"]) tabbrowser[treestyletab-style="metal"] + .treestyletab-splitter { + border-color: #666666 !important; + background: #e4e4e4 !important; +} + + +/* buttons in the tab bar */ + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-newtab-button, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-newtab-button:hover, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-alltabs-button, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-alltabs-button:hover, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-container > .tabs-closebutton, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + > .tabs-closebutton, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-container > .tabs-closebutton:hover, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + > .tabs-closebutton:hover { + background: #e4e4e4 !important; + border-color: #666666 !important; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"]) + .tabbrowser-arrowscrollbox .tabs-newtab-button { + background: #cecece url("shadow-inactive-l.png") repeat-y top right !important; + border-color: #9a9a9a !important; +} +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-arrowscrollbox .tabs-newtab-button { + background: #cecece url("shadow-inactive-r.png") repeat-y top left !important; + border-color: #9a9a9a !important; +} + + +/* hacks for Tab Mix Plus */ + +:root[treestyletab-enable-compatibility-tmp="true"]:not([active="true"]) + tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton, +:root[treestyletab-enable-compatibility-tmp="true"]:not([active="true"]) + tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton:hover { + background: #e4e4e4 !important; + border-color: #666666 !important; +} diff --git a/skin/classic/treestyletab/metal/base-inactive-3.7.css b/skin/classic/treestyletab/metal/base-inactive-3.7.css new file mode 100644 index 00000000..c2340a97 --- /dev/null +++ b/skin/classic/treestyletab/metal/base-inactive-3.7.css @@ -0,0 +1,88 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* tab bar */ + +:root:-moz-window-inactive + .tabbrowser-strip[treestyletab-style="metal"][treestyletab-mode="vertical"] { + background: #acacac !important; + border-color: #797979 !important; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([overflow="true"]) + .tabbrowser-arrowscrollbox, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][overflow="true"] + .tabbrowser-arrowscrollbox .scrollbox-innerbox { + background: url("shadow-inactive-l.png") repeat-y top right !important; +} +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"]) + .tabbrowser-arrowscrollbox, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"] + .tabbrowser-arrowscrollbox .scrollbox-innerbox { + background: url("shadow-inactive-r.png") repeat-y top left !important; +} + +:root:-moz-window-inactive tabbrowser[treestyletab-style="metal"] + .treestyletab-splitter { + border-color: #666666 !important; + background: #e4e4e4 !important; +} + + +/* buttons in the tab bar */ + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-newtab-button, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-newtab-button:hover, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-alltabs-button, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-alltabs-button:hover, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-container > .tabs-closebutton, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + > .tabs-closebutton, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tabs-container > .tabs-closebutton:hover, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + > .tabs-closebutton:hover { + background: #e4e4e4 !important; + border-color: #666666 !important; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"]) + .tabbrowser-arrowscrollbox .tabs-newtab-button { + background: #cecece url("shadow-inactive-l.png") repeat-y top right !important; + border-color: #9a9a9a !important; +} +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-arrowscrollbox .tabs-newtab-button { + background: #cecece url("shadow-inactive-r.png") repeat-y top left !important; + border-color: #9a9a9a !important; +} + + + +/* hacks for Tab Mix Plus */ + +:root[treestyletab-enable-compatibility-tmp="true"]:-moz-window-inactive + tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton, +:root[treestyletab-enable-compatibility-tmp="true"]:-moz-window-inactive + tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton:hover { + background: #e4e4e4 !important; + border-color: #666666 !important; +} diff --git a/skin/classic/treestyletab/metal/base-tmp.css b/skin/classic/treestyletab/metal/base-tmp.css deleted file mode 100644 index b822ce48..00000000 --- a/skin/classic/treestyletab/metal/base-tmp.css +++ /dev/null @@ -1,33 +0,0 @@ -/* hacks for Tab Mix Plus */ - -/* buttons in the tab bar */ - -:root[treestyletab-enable-compatibility-tmp="true"] - tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton, -:root[treestyletab-enable-compatibility-tmp="true"] - tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton:hover { - background: #b3b2b3 !important; - border-top: 1px solid #666666 !important; -} - -:root[treestyletab-enable-compatibility-tmp="true"] - tabbrowser[treestyletab-style="metal"][treestyletab-tabbar-position="left"] .tabs-closebutton-topbox > .tabs-closebutton { - border-right: 1px solid #666666 !important; -} - -:root[treestyletab-enable-compatibility-tmp="true"] - tabbrowser[treestyletab-style="metal"][treestyletab-tabbar-position="right"] .tabs-closebutton-topbox > .tabs-closebutton { - border-left: 1px solid #666666 !important; -} - -:root[treestyletab-enable-compatibility-tmp="true"]:not([active="true"]) - tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton, -:root[treestyletab-enable-compatibility-tmp="true"]:-moz-window-inactive - tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton, -:root[treestyletab-enable-compatibility-tmp="true"]:not([active="true"]) - tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton:hover, -:root[treestyletab-enable-compatibility-tmp="true"]:-moz-window-inactive - tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton:hover { - background: #e4e4e4 !important; - border-color: #666666 !important; -} diff --git a/skin/classic/treestyletab/metal/base.css b/skin/classic/treestyletab/metal/base.css index c1d00c97..09a125b7 100644 --- a/skin/classic/treestyletab/metal/base.css +++ b/skin/classic/treestyletab/metal/base.css @@ -38,13 +38,6 @@ border-width: 1px 0 0 !important; padding: 0 !important; } -:root:not([active="true"]) - .tabbrowser-strip[treestyletab-style="metal"][treestyletab-mode="vertical"], -:root:-moz-window-inactive - .tabbrowser-strip[treestyletab-style="metal"][treestyletab-mode="vertical"] { - background: #acacac !important; - border-color: #797979 !important; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] { background: transparent !important; @@ -64,34 +57,6 @@ .tabbrowser-arrowscrollbox .scrollbox-innerbox { background: url("shadow-active-r.png") repeat-y top left !important; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([overflow="true"]) - .tabbrowser-arrowscrollbox, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([overflow="true"]) - .tabbrowser-arrowscrollbox, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][overflow="true"] - .tabbrowser-arrowscrollbox .scrollbox-innerbox, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][overflow="true"] - .tabbrowser-arrowscrollbox .scrollbox-innerbox { - background: url("shadow-inactive-l.png") repeat-y top right !important; -} -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"]) - .tabbrowser-arrowscrollbox, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"]) - .tabbrowser-arrowscrollbox, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"] - .tabbrowser-arrowscrollbox .scrollbox-innerbox, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"] - .tabbrowser-arrowscrollbox .scrollbox-innerbox { - background: url("shadow-inactive-r.png") repeat-y top left !important; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-container, @@ -106,13 +71,6 @@ tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] min-width: 5px; -moz-appearance: none !important; } -:root:not([active="true"]) tabbrowser[treestyletab-style="metal"] - .treestyletab-splitter, -:root:-moz-window-inactive tabbrowser[treestyletab-style="metal"] - .treestyletab-splitter { - border-color: #666666 !important; - background: #e4e4e4 !important; -} tabbrowser[treestyletab-style="metal"][treestyletab-tabbar-position="left"] .treestyletab-splitter, .tabbrowser-strip[treestyletab-style="metal"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"], @@ -274,73 +232,26 @@ tabbrowser[treestyletab-style="metal"][treestyletab-tabbar-position="right"] border-left: 1px solid #666666 !important; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-newtab-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-newtab-button, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-newtab-button:hover, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-newtab-button:hover, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-alltabs-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-alltabs-button, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-alltabs-button:hover, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-alltabs-button:hover, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-container > .tabs-closebutton, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-container > .tabs-closebutton, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - > .tabs-closebutton, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - > .tabs-closebutton, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-container > .tabs-closebutton:hover, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tabs-container > .tabs-closebutton:hover, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - > .tabs-closebutton:hover, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - > .tabs-closebutton:hover { - background: #e4e4e4 !important; - border-color: #666666 !important; + + +/* hacks for Tab Mix Plus */ + +/* buttons in the tab bar */ + +:root[treestyletab-enable-compatibility-tmp="true"] + tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton, +:root[treestyletab-enable-compatibility-tmp="true"] + tabbrowser[treestyletab-style="metal"][treestyletab-mode="vertical"] .tabs-closebutton-topbox > .tabs-closebutton:hover { + background: #b3b2b3 !important; + border-top: 1px solid #666666 !important; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"]) - .tabbrowser-arrowscrollbox .tabs-newtab-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"]) - .tabbrowser-arrowscrollbox .tabs-newtab-button { - background: #cecece url("shadow-inactive-l.png") repeat-y top right !important; - border-color: #9a9a9a !important; +:root[treestyletab-enable-compatibility-tmp="true"] + tabbrowser[treestyletab-style="metal"][treestyletab-tabbar-position="left"] .tabs-closebutton-topbox > .tabs-closebutton { + border-right: 1px solid #666666 !important; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tabbrowser-arrowscrollbox .tabs-newtab-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tabbrowser-arrowscrollbox .tabs-newtab-button { - background: #cecece url("shadow-inactive-r.png") repeat-y top left !important; - border-color: #9a9a9a !important; + +:root[treestyletab-enable-compatibility-tmp="true"] + tabbrowser[treestyletab-style="metal"][treestyletab-tabbar-position="right"] .tabs-closebutton-topbox > .tabs-closebutton { + border-left: 1px solid #666666 !important; } diff --git a/skin/classic/treestyletab/metal/metal.css b/skin/classic/treestyletab/metal/metal.css index 8bcb56c6..d8c9c4db 100644 --- a/skin/classic/treestyletab/metal/metal.css +++ b/skin/classic/treestyletab/metal/metal.css @@ -1,4 +1,5 @@ @import url("base.css"); -@import url("base-tmp.css"); /* hacks for Tab Mix Plus */ +@import url("base-inactive.css"); @import url("tab.css"); +@import url("tab-inactive.css"); diff --git a/skin/classic/treestyletab/metal/tab-3.5.css b/skin/classic/treestyletab/metal/tab-3.5.css index 4f618e24..03c953ff 100644 --- a/skin/classic/treestyletab/metal/tab-3.5.css +++ b/skin/classic/treestyletab/metal/tab-3.5.css @@ -83,14 +83,6 @@ border-right-width: 0; -moz-border-image: url("tab-active-l.png") 10 / 10px 0 10px 10px; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-left, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-left { - -moz-border-image: url("tab-inactive-l.png") 10 / 10px 0 10px 10px; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] .tab-image-middle, @@ -100,34 +92,12 @@ border-right-width: 0; -moz-border-image: url("tab-active-l.png") 10 / 10px 0 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-middle, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-middle, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-close-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-close-button { - -moz-border-image: url("tab-inactive-l.png") 10 / 10px 0 10px 0; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] .tab-image-right { border-left-width: 0; -moz-border-image: url("tab-active-l.png") 10 / 10px 10px 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-right, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-right { - -moz-border-image: url("tab-inactive-l.png") 10 / 10px 10px 10px 0; -} @@ -137,14 +107,6 @@ .tab-image-left { -moz-border-image: url("tab-active-r.png") 10 / 10px 0 10px 10px; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-left, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-left { - -moz-border-image: url("tab-inactive-r.png") 10 / 10px 0 10px 10px; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tab-image-middle, @@ -152,34 +114,11 @@ .tab-close-button { -moz-border-image: url("tab-active-r.png") 10 / 10px 0 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-middle, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-middle, -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-close-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-close-button { - -moz-border-image: url("tab-inactive-r.png") 10 / 10px 0 10px 0; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tab-image-right { -moz-border-image: url("tab-active-r.png") 10 / 10px 10px 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-right, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-right { - -moz-border-image: url("tab-inactive-r.png") 10 / 10px 10px 10px 0; -} - /* foreground, left */ @@ -188,14 +127,6 @@ .tab-image-left[selected="true"] { -moz-border-image: url("tab-active-selected-l.png") 10 / 10px 0 10px 10px; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-left[selected="true"], -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-left[selected="true"] { - -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 0 10px 10px; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] .tab-image-middle[selected="true"], @@ -203,33 +134,11 @@ [selected="true"] .tab-close-button { -moz-border-image: url("tab-active-selected-l.png") 10 / 10px 0 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-middle[selected="true"], -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-middle[selected="true"], -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - [selected="true"] .tab-close-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - [selected="true"] .tab-close-button { - -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 0 10px 0; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] .tab-image-right[selected="true"] { -moz-border-image: url("tab-active-selected-l.png") 10 / 10px 10px 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-right[selected="true"], -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] - .tab-image-right[selected="true"] { - -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 10px 10px 0; -} @@ -239,14 +148,6 @@ .tab-image-left[selected="true"] { -moz-border-image: url("tab-active-selected-r.png") 10 / 10px 0 10px 10px; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-left[selected="true"], -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-left[selected="true"] { - -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 0 10px 10px; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tab-image-middle[selected="true"], @@ -254,31 +155,8 @@ [selected="true"] .tab-close-button { -moz-border-image: url("tab-active-selected-r.png") 10 / 10px 0 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-middle[selected="true"], -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-middle[selected="true"], -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - [selected="true"] .tab-close-button, -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - [selected="true"] .tab-close-button { - -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 0 10px 0; -} .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tab-image-right[selected="true"] { -moz-border-image: url("tab-active-selected-r.png") 10 / 10px 10px 10px 0; } -:root:not([active="true"]) - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-right[selected="true"], -:root:-moz-window-inactive - .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] - .tab-image-right[selected="true"] { - -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 10px 10px 0; -} - diff --git a/skin/classic/treestyletab/metal/tab-inactive-3.5.css b/skin/classic/treestyletab/metal/tab-inactive-3.5.css new file mode 100644 index 00000000..a04bfdab --- /dev/null +++ b/skin/classic/treestyletab/metal/tab-inactive-3.5.css @@ -0,0 +1,100 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* background, left */ + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-left { + -moz-border-image: url("tab-inactive-l.png") 10 / 10px 0 10px 10px; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-middle, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-close-button { + -moz-border-image: url("tab-inactive-l.png") 10 / 10px 0 10px 0; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-right { + -moz-border-image: url("tab-inactive-l.png") 10 / 10px 10px 10px 0; +} + + + +/* background, right */ + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-left { + -moz-border-image: url("tab-inactive-r.png") 10 / 10px 0 10px 10px; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-middle, +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-close-button { + -moz-border-image: url("tab-inactive-r.png") 10 / 10px 0 10px 0; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-right { + -moz-border-image: url("tab-inactive-r.png") 10 / 10px 10px 10px 0; +} + + + +/* foreground, left */ + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-left[selected="true"] { + -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 0 10px 10px; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-middle[selected="true"], +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + [selected="true"] .tab-close-button { + -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 0 10px 0; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-right[selected="true"] { + -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 10px 10px 0; +} + + + +/* foreground, right */ + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-left[selected="true"] { + -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 0 10px 10px; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-middle[selected="true"], +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + [selected="true"] .tab-close-button { + -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 0 10px 0; +} + +:root:not([active="true"]) + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-right[selected="true"] { + -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 10px 10px 0; +} + diff --git a/skin/classic/treestyletab/metal/tab-inactive-3.7.css b/skin/classic/treestyletab/metal/tab-inactive-3.7.css new file mode 100644 index 00000000..23ecaeac --- /dev/null +++ b/skin/classic/treestyletab/metal/tab-inactive-3.7.css @@ -0,0 +1,100 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* background, left */ + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-left { + -moz-border-image: url("tab-inactive-l.png") 10 / 10px 0 10px 10px; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-middle, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-close-button { + -moz-border-image: url("tab-inactive-l.png") 10 / 10px 0 10px 0; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-right { + -moz-border-image: url("tab-inactive-l.png") 10 / 10px 10px 10px 0; +} + + + +/* background, right */ + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-left { + -moz-border-image: url("tab-inactive-r.png") 10 / 10px 0 10px 10px; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-middle, +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-close-button { + -moz-border-image: url("tab-inactive-r.png") 10 / 10px 0 10px 0; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-right { + -moz-border-image: url("tab-inactive-r.png") 10 / 10px 10px 10px 0; +} + + + +/* foreground, left */ + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-left[selected="true"] { + -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 0 10px 10px; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-middle[selected="true"], +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + [selected="true"] .tab-close-button { + -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 0 10px 0; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"] + .tab-image-right[selected="true"] { + -moz-border-image: url("tab-inactive-selected-l.png") 10 / 10px 10px 10px 0; +} + + + +/* foreground, right */ + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-left[selected="true"] { + -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 0 10px 10px; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-middle[selected="true"], +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + [selected="true"] .tab-close-button { + -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 0 10px 0; +} + +:root:-moz-window-inactive + .tabbrowser-tabs[treestyletab-style="metal"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tab-image-right[selected="true"] { + -moz-border-image: url("tab-inactive-selected-r.png") 10 / 10px 10px 10px 0; +} + diff --git a/skin/classic/treestyletab/sidebar/base.css b/skin/classic/treestyletab/sidebar/base.css new file mode 100644 index 00000000..09c05205 --- /dev/null +++ b/skin/classic/treestyletab/sidebar/base.css @@ -0,0 +1,285 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* Unset bottom border, instead let's have a border on the right-hand + side, much like the sidebar does. */ +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"], +#TabsToolbar[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { + border-top: 1px solid #404040; + border-bottom: none !important; +} + +/* Background colour for the tree sidebar (light blue when window is + active, grey otherwise) */ +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { + background: transparent !important; + background-color: #d4dde5 !important; +} + +/* Don't display unnecessary clutter */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabs-bottom, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabs-left, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tab-text-shadow, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter grippy { + display: none !important; +} + +/* Use the splitter to display the border of .tabbrowser-strip */ +tabbrowser[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter { + width: 1px !important; + min-width: 1px !important; + background-image: none; + background-color: #404040; +} +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"] { + border-right: 1px solid #404040; +} +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="right"][treestyletab-tabbar-fixed="true"] { + border-left: 1px solid #404040; +} + +/* Style tabs themselves. Get rid of most of the initial XUL styling */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab { + -moz-appearance: none !important; + background: transparent !important; + -moz-border-top-colors: none !important; + -moz-border-bottom-colors: none !important; + -moz-border-right-colors: none !important; + -moz-border-left-colors: none !important; + -moz-border-radius-topleft : 0 !important; + -moz-border-radius-topright : 0 !important; + -moz-border-radius-bottomleft : 0 !important; + -moz-border-radius-bottomright : 0 !important; + -moz-box-align: stretch !important; + margin: 0 !important; + padding: 0 3px 2px 10px !important; + height: 21px !important; /* height including border! */ + text-align: left !important; + border: none; + border-top: 1px solid transparent !important; +} + +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] { + border-top: 1px solid #94A1C0 !important; + background: -moz-linear-gradient(top, #A0B0CF, #7386AB) repeat-x !important; +} + +/* Keep the close button at a safe distance from the tab label. */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tab-close-button { + margin-left: 3px; +} + +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tab-close-button image { + list-style-image: url("closetab.png"); + opacity: 0.27; /* turn black into #b9b9b9 */ +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tab-close-button:active image { + opacity: 0.46; /* turn black into #8a8a8a */ +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] +.tab-close-button image { + list-style-image: url("closetab-white.png"); + opacity: 1; +} + +/* Always display the favicon at 100% opacity */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab:not(:hover):not([selected="true"]) .tab-icon-image { + opacity: 1.0 !important; +} + +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab:not(:hover):not([selected="true"]) > .tab-close-button { + display: none !important; +} + +/* Tab label is without special decoration except when selected: then + the text is white and bold. */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tab-text { + font-size: 11px; + font-weight: normal !important; + color: #000000 !important; + text-shadow: none !important; + margin-bottom: 1px; +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab[selected="true"] .tab-text { + font-weight: bold !important; + color: #ffffff !important; + text-shadow: 0 1px #404040 !important; +} + + +/* Make the tab counter look like the bubbles in Mail.app et.al. */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter-container { + padding: 0 6px !important; + background-color: #91a0c0 !important; + -moz-border-radius: 8px !important; +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter { + color: #ffffff !important; + font-weight: bold !important; + text-shadow: none !important; +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab[selected="true"] .treestyletab-counter-container { + background-color: #ffffff !important; +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab[selected="true"] .treestyletab-counter { + color: #91a0c0 !important; +} + + + + + +/* Drag'n'drop styling: + First we need to disable the standard settings from TreeStyleTab. + Its initial CSS rules are quite explicit. :( */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="self"][selected="true"], +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="self"][selected="true"]:hover, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="self"]:not([selected="true"]), +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="self"]:not([selected="true"]):hover { + -moz-border-top-colors: none !important; + -moz-border-bottom-colors: none !important; + -moz-border-right-colors: none !important; + -moz-border-left-colors: none !important; +} + +/* Round blue rectangle around tabs that are dropping targets. */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="self"]:not([selected="true"]) { + border: 2px solid #577bf3 !important; /* not OSX's colour but Firefox's */ + background: #d0def5 !important; + -moz-border-radius: 8px !important; +} + +/* White-blue-white separator for drop indicator. */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="before"][selected="true"], +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="before"][selected="true"]:hover, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="before"]:not([selected="true"]), +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="before"]:not([selected="true"]):hover { + border-top: 4px solid red !important; + -moz-border-top-colors: #ffffff #577bf3 #577bf3 #ffffff !important; +} + +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="after"][selected="true"], +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="after"][selected="true"]:hover, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="after"]:not([selected="true"]), +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="after"]:not([selected="true"]):hover { + border-bottom: 4px solid #577bf3 !important; + -moz-border-bottom-colors: #ffffff #577bf3 #577bf3 #ffffff !important; +} + +/* Let's hack in the little round end of the drop indicator using the + drop marker image. */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="before"] .treestyletab-drop-marker, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="after"] .treestyletab-drop-marker { + list-style-image: url("dropmarker.png"); +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="before"] .treestyletab-drop-marker-container { + margin: -11px 22px 11px -22px; +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[treestyletab-drop-position="after"] .treestyletab-drop-marker-container { + margin: 12px 22px -12px -22px; +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"] + .tabbrowser-tab[treestyletab-drop-position="before"] .treestyletab-drop-marker-container, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"] + .tabbrowser-tab[treestyletab-drop-position="after"] .treestyletab-drop-marker-container { + margin-left: -30px; +} + + + +/* changed from original SidebarStyleTab */ + +#TabsToolbar[treestyletab-style="sidebar"]:not([treestyletab-tabbar-position="top"]), +#TabsToolbar[treestyletab-style="sidebar"][treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"]) { + background: transparent !important; + border: 0 none !important; + margin: 0 !important; + padding: 0 !important; + -moz-appearance: none !important; + -moz-box-shadow: none !important; +} + +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .treestyletab-counter-paren { + display: none !important; +} + +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabs-newtab-button, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabs-newtab-button:hover, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabs-alltabs-button, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabs-alltabs-button:hover, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabs-container > .tabs-closebutton, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + > .tabs-closebutton, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabs-container > .tabs-closebutton:hover, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + > .tabs-closebutton:hover { + -moz-appearance: none !important; + background: transparent !important; + border: 0 none !important; +} + +/* for rightside tab bar: "display:none" breaks the order of tab contents. */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab:not(:hover):not([selected="true"]) > .tab-close-button { + display: -moz-box !important; + visibility: collapse !important; +} + +/* for Windows (Winstrip/Strata) */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tab-close-button image, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tab-close-button:active image, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tab-close-button:hover image, +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab[selected="true"] .tab-close-button image { + -moz-image-region: auto !important; +} +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { + background: transparent !important; + margin: 0; + -moz-appearance: none !important; +} + +/* for Linux (Gnomestrip) */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tab-close-button { + -moz-appearance: none !important; +} + +/* for Multiple Tab Handler */ +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] + .tabbrowser-tab:not(:hover):not([selected="true"])[multipletab-ready-to-close="true"] > .tab-close-button { + visibility: visible !important; +} diff --git a/skin/classic/treestyletab/sidebar/inactive-3.6.css b/skin/classic/treestyletab/sidebar/inactive-3.6.css new file mode 100644 index 00000000..5b30c144 --- /dev/null +++ b/skin/classic/treestyletab/sidebar/inactive-3.6.css @@ -0,0 +1,52 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* Unset bottom border, instead let's have a border on the right-hand + side, much like the sidebar does. */ +#main-window:not([active="true"]) +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"], +#main-window:not([active="true"]) +#TabsToolbar[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { + border-top: 1px solid #868686; +} + +/* Background colour for the tree sidebar (light blue when window is + active, grey otherwise) */ +#main-window:not([active="true"]) +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { + background-color: #e8e8e8 !important; +} + +/* Use the splitter to display the border of .tabbrowser-strip */ +#main-window:not([active="true"]) +tabbrowser[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter { + background-color: #868686; +} +#main-window:not([active="true"]) +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"] { + border-right-color: #868686; +} +#main-window:not([active="true"]) +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="right"][treestyletab-tabbar-fixed="true"] { + border-left-color: #868686; +} + +/* Style tabs themselves. Get rid of most of the initial XUL styling */ +#main-window:not([active="true"]) +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] { + border-top: 1px solid #979797 !important; + background: -moz-linear-gradient(top, #B4B4B4, #8A8A8A) repeat-x !important; +} + +/* Make the tab counter look like the bubbles in Mail.app et.al. */ +#main-window:not([active="true"]) +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter-container { + background-color: #b5b5b5 !important; +} +#main-window:not([active="true"]) .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab[selected="true"] .treestyletab-counter-container { + background-color: #ffffff !important; +} +#main-window:not([active="true"]) .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab[selected="true"] .treestyletab-counter { + color: #929292 !important; +} diff --git a/skin/classic/treestyletab/sidebar/inactive-3.7.css b/skin/classic/treestyletab/sidebar/inactive-3.7.css new file mode 100644 index 00000000..4d80cf72 --- /dev/null +++ b/skin/classic/treestyletab/sidebar/inactive-3.7.css @@ -0,0 +1,52 @@ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* Unset bottom border, instead let's have a border on the right-hand + side, much like the sidebar does. */ +#main-window:-moz-window-inactive +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"], +#main-window:-moz-window-inactive +#TabsToolbar[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { + border-top: 1px solid #868686; +} + +/* Background colour for the tree sidebar (light blue when window is + active, grey otherwise) */ +#main-window:-moz-window-inactive +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { + background-color: #e8e8e8 !important; +} + +/* Use the splitter to display the border of .tabbrowser-strip */ +#main-window:-moz-window-inactive +tabbrowser[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter { + background-color: #868686; +} +#main-window:-moz-window-inactive +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"] { + border-right-color: #868686; +} +#main-window:-moz-window-inactive +.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="right"][treestyletab-tabbar-fixed="true"] { + border-left-color: #868686; +} + +/* Style tabs themselves. Get rid of most of the initial XUL styling */ +#main-window:-moz-window-inactive +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] { + border-top: 1px solid #979797 !important; + background: -moz-linear-gradient(top, #B4B4B4, #8A8A8A) repeat-x !important; +} + +/* Make the tab counter look like the bubbles in Mail.app et.al. */ +#main-window:-moz-window-inactive +.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter-container { + background-color: #b5b5b5 !important; +} +#main-window:-moz-window-inactive .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab[selected="true"] .treestyletab-counter-container { + background-color: #ffffff !important; +} +#main-window:-moz-window-inactive .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] +.tabbrowser-tab[selected="true"] .treestyletab-counter { + color: #929292 !important; +} diff --git a/skin/classic/treestyletab/sidebar/sidebar.css b/skin/classic/treestyletab/sidebar/sidebar.css index d35eaca9..9d7b4940 100644 --- a/skin/classic/treestyletab/sidebar/sidebar.css +++ b/skin/classic/treestyletab/sidebar/sidebar.css @@ -1,344 +1,2 @@ -@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); - -/* Unset bottom border, instead let's have a border on the right-hand - side, much like the sidebar does. */ -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"], -#TabsToolbar[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { - border-top: 1px solid #404040; - border-bottom: none !important; -} -#main-window:not([active="true"]) -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"], -#main-window:-moz-window-inactive -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"], -#main-window:not([active="true"]) -#TabsToolbar[treestyletab-style="sidebar"][treestyletab-mode="vertical"], -#main-window:-moz-window-inactive -#TabsToolbar[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { - border-top: 1px solid #868686; -} - -/* Background colour for the tree sidebar (light blue when window is - active, grey otherwise) */ -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { - background: transparent !important; - background-color: #d4dde5 !important; -} -#main-window:not([active="true"]) -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"], -#main-window:-moz-window-inactive -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { - background-color: #e8e8e8 !important; -} - -/* Don't display unnecessary clutter */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabs-bottom, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabs-left, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tab-text-shadow, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter grippy { - display: none !important; -} - -/* Use the splitter to display the border of .tabbrowser-strip */ -tabbrowser[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter { - width: 1px !important; - min-width: 1px !important; - background-image: none; - background-color: #404040; -} -#main-window:not([active="true"]) -tabbrowser[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter, -#main-window:-moz-window-inactive -tabbrowser[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-splitter { - background-color: #868686; -} -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"] { - border-right: 1px solid #404040; -} -#main-window:not([active="true"]) -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"], -#main-window:-moz-window-inactive -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="left"][treestyletab-tabbar-fixed="true"] { - border-right-color: #868686; -} -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="right"][treestyletab-tabbar-fixed="true"] { - border-left: 1px solid #404040; -} -#main-window:not([active="true"]) -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="right"][treestyletab-tabbar-fixed="true"], -#main-window:-moz-window-inactive -.tabbrowser-strip[treestyletab-style="sidebar"][treestyletab-tabbar-position="right"][treestyletab-tabbar-fixed="true"] { - border-left-color: #868686; -} - -/* Style tabs themselves. Get rid of most of the initial XUL styling */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab { - -moz-appearance: none !important; - background: transparent !important; - -moz-border-top-colors: none !important; - -moz-border-bottom-colors: none !important; - -moz-border-right-colors: none !important; - -moz-border-left-colors: none !important; - -moz-border-radius-topleft : 0 !important; - -moz-border-radius-topright : 0 !important; - -moz-border-radius-bottomleft : 0 !important; - -moz-border-radius-bottomright : 0 !important; - -moz-box-align: stretch !important; - margin: 0 !important; - padding: 0 3px 2px 10px !important; - height: 21px !important; /* height including border! */ - text-align: left !important; - border: none; - border-top: 1px solid transparent !important; -} - -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] { - border-top: 1px solid #94A1C0 !important; - background: -moz-linear-gradient(top, #A0B0CF, #7386AB) repeat-x !important; -} -#main-window:not([active="true"]) -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"], -#main-window:-moz-window-inactive -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] { - border-top: 1px solid #979797 !important; - background: -moz-linear-gradient(top, #B4B4B4, #8A8A8A) repeat-x !important; -} - -/* Keep the close button at a safe distance from the tab label. */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tab-close-button { - margin-left: 3px; -} - -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tab-close-button image { - list-style-image: url("closetab.png"); - opacity: 0.27; /* turn black into #b9b9b9 */ -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tab-close-button:active image { - opacity: 0.46; /* turn black into #8a8a8a */ -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] -.tab-close-button image { - list-style-image: url("closetab-white.png"); - opacity: 1; -} - -/* Always display the favicon at 100% opacity */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab:not(:hover):not([selected="true"]) .tab-icon-image { - opacity: 1.0 !important; -} - -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab:not(:hover):not([selected="true"]) > .tab-close-button { - display: none !important; -} - -/* Tab label is without special decoration except when selected: then - the text is white and bold. */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .tab-text { - font-size: 11px; - font-weight: normal !important; - color: #000000 !important; - text-shadow: none !important; - margin-bottom: 1px; -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab[selected="true"] .tab-text { - font-weight: bold !important; - color: #ffffff !important; - text-shadow: 0 1px #404040 !important; -} - - -/* Make the tab counter look like the bubbles in Mail.app et.al. */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter-container { - padding: 0 6px !important; - background-color: #91a0c0 !important; - -moz-border-radius: 8px !important; -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter { - color: #ffffff !important; - font-weight: bold !important; - text-shadow: none !important; -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab[selected="true"] .treestyletab-counter-container { - background-color: #ffffff !important; -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab[selected="true"] .treestyletab-counter { - color: #91a0c0 !important; -} -#main-window:not([active="true"]) -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter-container, -#main-window:-moz-window-inactive -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] .treestyletab-counter-container { - background-color: #b5b5b5 !important; -} -#main-window:not([active="true"]) .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab[selected="true"] .treestyletab-counter-container, -#main-window:-moz-window-inactive .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab[selected="true"] .treestyletab-counter-container { - background-color: #ffffff !important; -} -#main-window:not([active="true"]) .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab[selected="true"] .treestyletab-counter, -#main-window:-moz-window-inactive .tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab[selected="true"] .treestyletab-counter { - color: #929292 !important; -} - - - - - -/* Drag'n'drop styling: - First we need to disable the standard settings from TreeStyleTab. - Its initial CSS rules are quite explicit. :( */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="self"][selected="true"], -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="self"][selected="true"]:hover, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="self"]:not([selected="true"]), -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="self"]:not([selected="true"]):hover { - -moz-border-top-colors: none !important; - -moz-border-bottom-colors: none !important; - -moz-border-right-colors: none !important; - -moz-border-left-colors: none !important; -} - -/* Round blue rectangle around tabs that are dropping targets. */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="self"]:not([selected="true"]) { - border: 2px solid #577bf3 !important; /* not OSX's colour but Firefox's */ - background: #d0def5 !important; - -moz-border-radius: 8px !important; -} - -/* White-blue-white separator for drop indicator. */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="before"][selected="true"], -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="before"][selected="true"]:hover, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="before"]:not([selected="true"]), -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="before"]:not([selected="true"]):hover { - border-top: 4px solid red !important; - -moz-border-top-colors: #ffffff #577bf3 #577bf3 #ffffff !important; -} - -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="after"][selected="true"], -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="after"][selected="true"]:hover, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="after"]:not([selected="true"]), -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="after"]:not([selected="true"]):hover { - border-bottom: 4px solid #577bf3 !important; - -moz-border-bottom-colors: #ffffff #577bf3 #577bf3 #ffffff !important; -} - -/* Let's hack in the little round end of the drop indicator using the - drop marker image. */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="before"] .treestyletab-drop-marker, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="after"] .treestyletab-drop-marker { - list-style-image: url("dropmarker.png"); -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="before"] .treestyletab-drop-marker-container { - margin: -11px 22px 11px -22px; -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[treestyletab-drop-position="after"] .treestyletab-drop-marker-container { - margin: 12px 22px -12px -22px; -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"] - .tabbrowser-tab[treestyletab-drop-position="before"] .treestyletab-drop-marker-container, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"][treestyletab-allow-subtree-collapse="true"] - .tabbrowser-tab[treestyletab-drop-position="after"] .treestyletab-drop-marker-container { - margin-left: -30px; -} - - - -/* changed from original SidebarStyleTab */ - -#TabsToolbar[treestyletab-style="sidebar"]:not([treestyletab-tabbar-position="top"]), -#TabsToolbar[treestyletab-style="sidebar"][treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"]) { - background: transparent !important; - border: 0 none !important; - margin: 0 !important; - padding: 0 !important; - -moz-appearance: none !important; - -moz-box-shadow: none !important; -} - -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .treestyletab-counter-paren { - display: none !important; -} - -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabs-newtab-button, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabs-newtab-button:hover, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabs-alltabs-button, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabs-alltabs-button:hover, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabs-container > .tabs-closebutton, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - > .tabs-closebutton, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabs-container > .tabs-closebutton:hover, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - > .tabs-closebutton:hover { - -moz-appearance: none !important; - background: transparent !important; - border: 0 none !important; -} - -/* for rightside tab bar: "display:none" breaks the order of tab contents. */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] -.tabbrowser-tab:not(:hover):not([selected="true"]) > .tab-close-button { - display: -moz-box !important; - visibility: collapse !important; -} - -/* for Windows (Winstrip/Strata) */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tab-close-button image, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tab-close-button:active image, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tab-close-button:hover image, -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab[selected="true"] .tab-close-button image { - -moz-image-region: auto !important; -} -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] { - background: transparent !important; - margin: 0; - -moz-appearance: none !important; -} - -/* for Linux (Gnomestrip) */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tab-close-button { - -moz-appearance: none !important; -} - -/* for Multiple Tab Handler */ -.tabbrowser-tabs[treestyletab-style="sidebar"][treestyletab-mode="vertical"] - .tabbrowser-tab:not(:hover):not([selected="true"])[multipletab-ready-to-close="true"] > .tab-close-button { - visibility: visible !important; -} +@import url("base.css"); +@import url("inactive.css");