333 lines
12 KiB
CSS

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab,
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover,
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"]:hover {
appearance: none !important;
-moz-appearance: none !important;
border: 2px solid transparent !important;
border-radius: 0 !important;
-moz-border-radius: 0 !important;
color: black !important;
height: auto !important;
max-height: none !important;
min-height: 6px !important;
margin-top: -2px !important;
margin-right: 0;
margin-bottom: -2px !important;
margin-left: 0;
padding: 0 !important;
-moz-border-top-colors: transparent transparent !important;
-moz-border-right-colors: transparent transparent !important;
-moz-border-bottom-colors: transparent transparent !important;
-moz-border-left-colors: transparent transparent !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
:-moz-any(.tabbrowser-tab:not([pinned]),
.tabbrowser-tab[pinned]:not([titlechanged])),
.tabbrowser-tabs[treestyletab-mode="vertical"]
:-moz-any(.tabbrowser-tab:not([pinned]),
.tabbrowser-tab[pinned]:not([titlechanged])):hover,
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"]:hover {
background: none transparent !important;
}
/* for Mac OS X */
.tabbrowser-tabs[treestyletab-mode="vertical"]
:-moz-any(.tab-content:not([pinned]):not([selected="true"]),
.tab-content[pinned]:not([titlechanged]):not([selected="true"]),
.tab-content:not([pinned])[selected="true"],
.tab-content[pinned]:not([titlechanged])[selected="true"],
.tab-background-start:not([selected="true"]),
.tab-background-middle:not([selected="true"]):not([pinned]),
.tab-background-middle:not([selected="true"])[pinned]:not([titlechanged]),
.tab-background-end:not([selected="true"]),
.tab-background-start[selected="true"],
.tab-background-middle[selected="true"],
.tab-background-end[selected="true"]) {
border: 0 none !important;
background: transparent !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
:-moz-any(.tab-background-start:not([selected="true"]),
.tab-background-middle:not([selected="true"]),
.tab-background-end:not([selected="true"]),
.tab-background-start[selected="true"],
.tab-background-middle[selected="true"],
.tab-background-end[selected="true"]) {
mask: none !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
:-moz-any(.tab-background-start[pinned][titlechanged],
.tab-background-end[pinned][titlechanged]) {
visibility: collapse !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tab-background {
margin: 0 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tab-content {
appearance: none !important;
-moz-appearance: none !important;
border: 10px solid transparent;
margin: 0 !important;
padding: 2px 5px 2px 10px;
position: relative !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tab-content {
padding: 2px 10px 2px 5px;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]:not([treestyletab-tab-inverted="true"])
.tabbrowser-tab:not([treestyletab-drop-position="self"]) {
border-right: 0 none !important;
-moz-border-right-colors: none !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tabbrowser-tab:not([treestyletab-drop-position="self"]) {
border-left: 0 none !important;
-moz-border-left-colors: none !important;
}
/* background, left */
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not([pinned])
.tab-stack {
-moz-border-image: url("tab-active-l.png") 10 5 10 10 / 10px 5px 10px 10px !important;
/**
* For Firefox 11 and olders, "fill" is not available in "-moz-border-image".
* However, on Firefox 12, we must put "fill" to fill the background.
* So, now we write "-moz-border-image-slice" with "fill" after "-moz-boder-image"
* because "-slice" works only on Firefox 12.
*/
-moz-border-image-slice: 10 5 10 10 fill !important;
border-image: url("tab-active-l.png") 10 5 10 10 fill / 10px 5px 10px 10px !important;
}
/* background, right */
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tabbrowser-tab:not([pinned])
.tab-stack {
-moz-border-image: url("tab-active-r.png") 10 10 10 5 / 10px 10px 10px 5px !important;
-moz-border-image-slice: 10 10 10 5 fill !important;
border-image: url("tab-active-r.png") 10 10 10 5 fill / 10px 10px 10px 5px !important;
}
/* foreground, left */
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"]:not([pinned])
.tab-stack {
-moz-border-image: url("tab-active-selected-l.png") 10 5 10 10 / 10px 5px 10px 10px !important;
-moz-border-image-slice: 10 5 10 10 fill !important;
border-image: url("tab-active-selected-l.png") 10 5 10 10 fill / 10px 5px 10px 10px !important;
}
/* foreground, right */
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tabbrowser-tab[selected="true"]:not([pinned])
.tab-stack {
-moz-border-image: url("tab-active-selected-r.png") 10 10 10 5 / 10px 10px 10px 5px !important;
-moz-border-image-slice: 10 10 10 5 fill !important;
border-image: url("tab-active-selected-r.png") 10 10 10 5 fill / 10px 10px 10px 5px !important;
}
/* pinned tabs */
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected]:not(:hover)
.tab-content[pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected]:hover
.tab-content[pinned] {
-moz-border-image: none !important;
border-image: none !important;
margin: 0 !important;
padding: 0 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[pinned]:not([titlechanged]),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned]:not([titlechanged]),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[pinned][selected],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned][selected] {
background: none !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned]:not(:hover),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned]:hover,
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned][selected="true"]:not(:hover),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned][selected="true"]:hover {
border: none !important;
border-radius: 0 !important;
-moz-border-radius: 0 !important;
padding: 0 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned]:not([titlechanged]):not(:hover),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned]:not([titlechanged]):hover,
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned][selected="true"]:not(:hover),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[pinned][selected="true"]:hover {
background: none !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab
.tab-content[pinned]
* {
margin: 0 !important;
padding: 0 !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[pinned][selected="true"],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned][selected="true"] {
line-height: 1 !important;
border: 1px solid #666666 !important;
border-radius: 4px !important;
-moz-border-radius: 4px !important;
margin: 1px 0 0 1px !important;
padding: 2px 4px 2px 3px !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[pinned]:not([titlechanged]),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned]:not([titlechanged]),
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[selected="true"][pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[selected="true"][pinned] {
background: #9d9d9d !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not(:hover)
.tab-content[selected="true"][pinned],
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[selected="true"][pinned] {
background-color: #b3b2b3 !important;
}
/* inactive */
/* background, left */
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:not([pinned])
.tab-stack {
-moz-border-image: url("tab-inactive-l.png") 10 5 10 10 / 10px 5px 10px 10px !important;
-moz-border-image-slice: 10 5 10 10 fill !important;
border-image: url("tab-inactive-l.png") 10 5 10 10 fill / 10px 5px 10px 10px !important;
}
/* background, right */
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tabbrowser-tab:not([pinned])
.tab-stack {
-moz-border-image: url("tab-inactive-r.png") 10 10 10 5 / 10px 10px 10px 5px !important;
-moz-border-image-slice: 10 10 10 5 fill !important;
border-image: url("tab-inactive-r.png") 10 10 10 5 fill / 10px 10px 10px 5px !important;
}
/* foreground, left */
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab[selected="true"]:not([pinned])
.tab-stack{
-moz-border-image: url("tab-inactive-selected-l.png") 10 5 10 10 / 10px 5px 10px 10px !important;
-moz-border-image-slice: 10 5 10 10 fill !important;
border-image: url("tab-inactive-selected-l.png") 10 5 10 10 fill / 10px 5px 10px 10px !important;
}
/* foreground, right */
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]
.tabbrowser-tab[selected="true"]:not([pinned])
.tab-stack{
-moz-border-image: url("tab-inactive-selected-r.png") 10 10 10 5 / 10px 10px 10px 5px !important;
-moz-border-image-slice: 10 10 10 5 fill !important;
border-image: url("tab-inactive-selected-r.png") 10 10 10 5 fill / 10px 10px 10px 5px !important;
}
/* pinned tabs */
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab
.tab-content[pinned]:not([titlechanged]),
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned]:not([titlechanged]) {
background: #cecece !important;
}
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab
.tab-content[pinned][selected="true"],
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab:hover
.tab-content[pinned][selected="true"] {
background: #e4e4e4 !important;
}
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"]
.tabbrowser-tab
.tab-content[pinned] {
border-color: #9a9a9a !important;
}