389 lines
15 KiB
CSS
389 lines
15 KiB
CSS
@import url("chrome://treestyletab/content/treestyletab-tmp.css"); /* hacks for Tab Mix Plus */
|
|
|
|
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
|
@namespace html url("http://www.w3.org/1999/xhtml");
|
|
|
|
|
|
/* twisty in tabs */
|
|
.treestyletab-twisty,
|
|
.tabbrowser-tabs[treestyletab-twisty-style="none"]
|
|
.treestyletab-twisty-container,
|
|
.tabbrowser-tabs:not([treestyletab-allow-subtree-collapse="true"])
|
|
.treestyletab-twisty-container {
|
|
display: none;
|
|
}
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"]
|
|
.tabbrowser-tab[treestyletab-children][treestyletab-allow-subtree-collapse="true"]
|
|
.treestyletab-twisty {
|
|
display: -moz-box;
|
|
}
|
|
|
|
/* collapsed children counter */
|
|
.treestyletab-counter-container {
|
|
display: none;
|
|
}
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"]
|
|
.tabbrowser-tab[treestyletab-children][treestyletab-subtree-collapsed="true"][treestyletab-allow-subtree-collapse="true"]
|
|
.treestyletab-counter-container {
|
|
display: -moz-box;
|
|
}
|
|
|
|
/* drop marker */
|
|
.tabbrowser-tab:not([treestyletab-drop-position])
|
|
.treestyletab-drop-marker {
|
|
display: none;
|
|
}
|
|
|
|
/* collapse/expand tree of tabs */
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"]
|
|
.tabbrowser-tab[treestyletab-collapsed-done="true"] {
|
|
visibility: collapse;
|
|
}
|
|
|
|
/* collapse/expand tree of tabs, horizontal stacked tabs */
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
|
|
.tabbrowser-tab {
|
|
position: relative;
|
|
}
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
|
|
.tabbrowser-tab[treestyletab-collapsed="true"][fadein] {
|
|
visibility: visible;
|
|
max-width: 20px;
|
|
min-width: 20px;
|
|
width: 20px;
|
|
-moz-box-flex: 0;
|
|
mask: url("res/tabEffects.svg#fadein-mask");
|
|
}
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
|
|
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-image-left > *,
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
|
|
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-image-middle > *,
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
|
|
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-image-right > *,
|
|
.tabbrowser-tabs[treestyletab-allow-subtree-collapse="true"][treestyletab-stack-collapsed-tabs="true"]
|
|
.tabbrowser-tab[treestyletab-collapsed-done="true"] .tab-close-button {
|
|
visibility: collapse;
|
|
}
|
|
|
|
/* fixed tab bar */
|
|
.tabbrowser-strip[treestyletab-tabbar-fixed="true"]+splitter {
|
|
visibility: collapse;
|
|
}
|
|
|
|
|
|
/* auto hide tab bar */
|
|
|
|
.tabbrowser-tabs[treestyletab-tabbar-autohide="hidden"],
|
|
.tabbrowser-strip[treestyletab-tabbar-autohide="hidden"],
|
|
.tabbrowser-strip[treestyletab-tabbar-autohide="hidden"]+splitter,
|
|
.tabbrowser-strip[collapsed="true"] + splitter:not([state="collapsed"]),
|
|
.treestyletab-tabbar-toggler,
|
|
#TabsToolbar[treestyletab-tabbar-autohide="hidden"] > *,
|
|
#TabsToolbar .treestyletab-splitter,
|
|
#treestyletab-tabbar-resizer-box,
|
|
tabbrowser[treestyletab-tabbar-autohide-mode="1"][tabcontainer]
|
|
.tabbrowser-strip[treestyletab-tabbar-placeholder="true"],
|
|
tabbrowser[treestyletab-tabbar-autohide-mode="1"][tabcontainer]
|
|
.tabbrowser-strip[treestyletab-tabbar-placeholder="true"]+splitter {
|
|
visibility: collapse;
|
|
}
|
|
|
|
tabbrowser[treestyletab-tabbar-autohide-mode="1"][tabcontainer]
|
|
.treestyletab-tabbar-toggler,
|
|
tabbrowser[treestyletab-tabbar-autohide-mode="1"][treestyletab-tabbar-autohide="hidden"]
|
|
.treestyletab-tabbar-toggler,
|
|
#TabsToolbar[treestyletab-mode="vertical"][treestyletab-tabbar-autohide][treestyletab-tabbar-autohide-state="expanded"]
|
|
#treestyletab-tabbar-resizer-box,
|
|
#TabsToolbar[treestyletab-mode="vertical"][treestyletab-tabbar-autohide][treestyletab-tabbar-autohide-state="expanded"]:not([treestyletab-tabbar-fixed="true"])
|
|
.treestyletab-splitter {
|
|
visibility: visible;
|
|
}
|
|
|
|
/* put resizer under tabs, and raise up tabs */
|
|
#TabsToolbar[treestyletab-mode="vertical"][treestyletab-tabbar-autohide][treestyletab-tabbar-autohide-state="expanded"]
|
|
> *,
|
|
.tabs-toolbar-inner-box[treestyletab-tabbar-autohide][treestyletab-tabbar-autohide-state="expanded"]:not([treestyletab-tabbar-fixed="true"])
|
|
> * {
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
#TabsToolbar[treestyletab-mode="vertical"][treestyletab-tabbar-autohide][treestyletab-tabbar-autohide-state="expanded"]
|
|
#treestyletab-tabbar-resizer-box {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
z-index: 1;
|
|
line-height: 0 !important; /* to avoid an useless space above the splitter */
|
|
font-size: 0 !important; /* to avoid an useless space above the splitter */
|
|
}
|
|
|
|
/* Firefox 3.0-3.6 (not for 4.0 or later) */
|
|
#appcontent {
|
|
margin: 0;
|
|
}
|
|
|
|
.tabbrowser-tabs[treestyletab-tabbar-autohide][treestyletab-tabbar-transparent]
|
|
.tabs-stack
|
|
> *:first-child
|
|
> :not(html|canvas),
|
|
.tabbrowser-tabs[treestyletab-tabbar-resizing]
|
|
.tabs-stack
|
|
> *:first-child
|
|
> html|canvas {
|
|
display: none !important;
|
|
}
|
|
|
|
|
|
|
|
/* vertical tab bar */
|
|
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"]
|
|
.tabbrowser-arrowscrollbox > scrollbox {
|
|
overflow-x: hidden !important;
|
|
overflow-y: auto !important;
|
|
}
|
|
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"]
|
|
.tabbrowser-arrowscrollbox
|
|
.scrollbox-innerbox {
|
|
-moz-box-flex: 1 !important;
|
|
-moz-box-pack: start !important;
|
|
}
|
|
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"]
|
|
.tabbrowser-tab {
|
|
-moz-box-flex: 0 !important;
|
|
}
|
|
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabs-alltabs-button, /* -Firefox 3.6 */
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .close-button.tabs-closebutton, /* -Firefox 3.6 */
|
|
#TabsToolbar[treestyletab-mode="vertical"] > toolbarbutton,
|
|
#TabsToolbar[treestyletab-mode="vertical"] > toolbarpaletteitem > toolbarbutton {
|
|
max-width: none !important;
|
|
}
|
|
|
|
/* hide horizontal tab bar UI for vertical tab bar */
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-arrowscrollbox > .scrollbutton-up,
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-arrowscrollbox > .scrollbutton-down-stack,
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-arrowscrollbox > .scrollbutton-down, /* Firefox 3 */
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabs-closebutton-box,
|
|
#TabsToolbar[treestyletab-mode="vertical"] .tabs-closebutton,
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .tab-drop-indicator-bar {
|
|
visibility: collapse !important;
|
|
}
|
|
|
|
/**
|
|
* Firefox 4.0 finishes opening and closing processes of tabs by its
|
|
* "transitionend" events about max-width property. I think this is very
|
|
* dirty and specific implementation but it won't fixed.
|
|
* (See: https://bugzilla.mozilla.org/show_bug.cgi?id=585417#c3 )
|
|
* So we have to define max-width for both states [fadein] (means "completely
|
|
* opened") and :not([fadein]) (means "in opening/removing process".
|
|
*/
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"]
|
|
.tabbrowser-tab:not([pinned]) {
|
|
max-width: 65000px !important;
|
|
}
|
|
#TabsToolbar[treestyletab-mode="vertical"]
|
|
.tabbrowser-tab:not([pinned]):not([fadein]) {
|
|
opacity: 0.5 !important;
|
|
}
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"]
|
|
.tabbrowser-tab:not([pinned])[fadein] {
|
|
max-width: 65250px !important;
|
|
min-width: 1px !important;
|
|
}
|
|
#TabsToolbar[treestyletab-mode="vertical"][treestyletab-animation-enabled="true"]
|
|
.tabbrowser-tab:not([pinned]):not([fadein])[treestyletab-removed="true"] {
|
|
max-height: 1px !important;
|
|
min-height: 1px !important;
|
|
opacity: 0 !important;
|
|
/**
|
|
* Sometimes "transitionend" event for "max-width" doesn't fire so ghotst
|
|
* tabs are left. To do cleanup process forcedly, we have to re-define new
|
|
* max-width to fire transitionend event.
|
|
*/
|
|
max-width: 64000px !important;
|
|
}
|
|
|
|
#TabsToolbar,
|
|
#navigator-toolbox[tabsontop="true"] > #TabsToolbar,
|
|
#navigator-toolbox:not([tabsontop="true"])
|
|
> #nav-bar + #customToolbars + #PersonalToolbar[collapsed="true"] + #TabsToolbar:last-child {
|
|
-moz-binding: url(treestyletab.xml#tabs-toolbar);
|
|
}
|
|
#TabsToolbar:not([treestyletab-tabbar-position="top"]),
|
|
#TabsToolbar[treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"]) {
|
|
line-height: 0 !important; /* to avoid an useless space above the tab bar */
|
|
position: fixed !important;
|
|
-moz-appearance: none !important;
|
|
}
|
|
#TabsToolbar:not([treestyletab-tabbar-position="top"])
|
|
.tabbrowser-tabs,
|
|
#TabsToolbar[treestyletab-tabbar-position="top"]:not([treestyletab-tabbar-fixed="true"])
|
|
.tabbrowser-tabs {
|
|
overflow: hidden !important;
|
|
}
|
|
|
|
/* animation effects */
|
|
|
|
.tabbrowser-tabs[treestyletab-animation-enabled="true"][treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"])
|
|
.tabbrowser-tab:not([treestyletab-collapsed-done="true"]) {
|
|
-moz-transition: margin-top 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-left 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
transition: margin-top 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-left 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
}
|
|
|
|
.tabbrowser-tabs[treestyletab-animation-enabled="true"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
|
|
.tabbrowser-tab:not([treestyletab-collapsed-done="true"]) {
|
|
-moz-transition: margin-top 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-right 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
transition: margin-top 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-right 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
}
|
|
|
|
.tabbrowser-tabs[treestyletab-animation-enabled="true"]:not([treestyletab-mode="vertical"]):not([treestyletab-tab-inverted="true"])
|
|
.tabbrowser-tab:not([treestyletab-collapsed-done="true"]) {
|
|
-moz-transition: margin-left 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-top 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
transition: margin-left 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-top 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
}
|
|
|
|
.tabbrowser-tabs[treestyletab-animation-enabled="true"]:not([treestyletab-mode="vertical"])[treestyletab-tab-inverted="true"]
|
|
.tabbrowser-tab:not([treestyletab-collapsed-done="true"]) {
|
|
-moz-transition: margin-left 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-bottom 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
transition: margin-left 0.15s ease-out,
|
|
opacity 0.15s ease-out,
|
|
margin-bottom 0.2s ease-out,
|
|
min-height 0.15s ease-out,
|
|
max-height 0.15s ease-out,
|
|
min-width 0.15s ease-out /* for Firefox itself */,
|
|
max-width 0.15s ease-out /* for Firefox itself */;
|
|
}
|
|
|
|
|
|
|
|
/* horizontal tab bar */
|
|
|
|
/* separating of groups */
|
|
.tabbrowser-tabs:not([treestyletab-mode="vertical"])
|
|
.tabbrowser-tab:not([treestyletab-nest="0"]) + .tabbrowser-tab[treestyletab-nest="0"],
|
|
.tabbrowser-tabs:not([treestyletab-mode="vertical"])
|
|
.tabbrowser-tab[treestyletab-nest="0"] + .tabbrowser-tab[treestyletab-nest="0"][treestyletab-children] {
|
|
margin-left: 0.8em !important;
|
|
}
|
|
|
|
|
|
|
|
/* compatibility for Firefox features */
|
|
|
|
/* hide all tabs button (by user's preference) */
|
|
.tabbrowser-tabs[treestyletab-hide-alltabs-button="true"]
|
|
.tabs-alltabs-stack,
|
|
.tabbrowser-tabs[treestyletab-hide-alltabs-button="true"]
|
|
.tabbrowser-arrowscrollbox ~ stack /* "all tabs" button in Firefox 3.0-3.5 */ {
|
|
visibility: collapse !important;
|
|
}
|
|
|
|
/* pinned tabs on Firefox 4.0 */
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"]
|
|
.tabbrowser-tab[pinned="true"] {
|
|
position: fixed !important;
|
|
z-index: 100;
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
|
|
/* print preview */
|
|
.tabbrowser-strip[treestyletab-tabbar-fixed="true"]+splitter,
|
|
.tabbrowser-strip[treestyletab-print-preview="true"],
|
|
.tabbrowser-strip[treestyletab-print-preview="true"]+splitter,
|
|
#TabsToolbar[treestyletab-print-preview="true"] {
|
|
visibility: collapse;
|
|
}
|
|
|
|
/* stylized window (opened by window.open() with features) */
|
|
window[chromehidden~="toolbar"]
|
|
.tabbrowser-strip[treestyletab-tabbar-placeholder="true"],
|
|
window[chromehidden~="toolbar"]
|
|
.tabbrowser-strip[treestyletab-tabbar-placeholder="true"]+splitter {
|
|
visibility: collapse;
|
|
}
|
|
|
|
|
|
/* addon compatibility */
|
|
|
|
/* some themes */
|
|
image.tab-icon {
|
|
display: -moz-stack;
|
|
-moz-binding: url(treestyletab.xml#tab-icon);
|
|
}
|
|
|
|
/* Tabbrowser Preferences, and some theme */
|
|
.tabbrowser-tabs .tabs-newbutton,
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .scrollbutton-up,
|
|
.tabbrowser-tabs[treestyletab-mode="vertical"] .scrollbutton-down {
|
|
max-width: none !important;
|
|
}
|
|
|
|
/* All-in-One Sidebar */
|
|
#aiostbx-tableft-toolbox:not([incustomisemode="true"]) > toolbar[currentset="__empty"],
|
|
#aiostbx-tableft-toolbox:not([incustomisemode="true"]) > toolbar:not([currentset]),
|
|
#aiostbx-tabright-toolbox:not([incustomisemode="true"]) > toolbar[currentset="__empty"],
|
|
#aiostbx-tabright-toolbox:not([incustomisemode="true"]) > toolbar:not([currentset]) {
|
|
visibility: collapse;
|
|
}
|
|
|
|
/* AutoHide */
|
|
#appcontent[ahFull="true"] .tabbrowser-strip[ahHIDE="true"]+splitter {
|
|
visibility: collapse;
|
|
}
|
|
|
|
/* Tab Utilities + Firefox 3.0 (not 3.5 and later!) */
|
|
tabbrowser[treestyletab-mode="vertical"]
|
|
.tabs-stack
|
|
> *:first-child + *
|
|
> hbox:not(.tabs-apptabs-container) {
|
|
-moz-box-flex: 1 !important;
|
|
}
|