diff --git a/skin/classic/treestyletab/square/square.css b/skin/classic/treestyletab/square/square.css index ad05a219..ca331fe1 100644 --- a/skin/classic/treestyletab/square/square.css +++ b/skin/classic/treestyletab/square/square.css @@ -8,7 +8,7 @@ margin: 0; -moz-appearance: none; } -.tabbrowser-strip[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) { +.tabbrowser-strip[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) { background: darkgray !important; -moz-appearance: none; } @@ -16,8 +16,10 @@ .tabbrowser-strip[treestyletab-style~="square"][treestyletab-mode="vertical"], #TabsToolbar[treestyletab-style~="square"][treestyletab-mode="vertical"], .tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"], -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-arrowscrollbox, -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabs-container { +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-arrowscrollbox, +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabs-container { height: auto !important; max-height: none !important; padding-left: 0 !important; @@ -43,14 +45,19 @@ -moz-border-left-colors: none !important; } -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabs-left, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabs-bottom, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tab-text-shadow /* Mac OS X */ { +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabs-left, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabs-bottom, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tab-text-shadow /* Mac OS X */ { display: none !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]) { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]) { -moz-appearance: none !important; min-height: 2em; margin: 0 !important; @@ -68,15 +75,18 @@ -moz-border-radius-bottomright : 0 !important; -moz-box-align: stretch !important; } -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:not([selected="true"]):first-child { +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] + .tabbrowser-tab:not([selected="true"]):first-child { -moz-border-top-colors: ThreeDShadow transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tab-icon-image { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tab-icon-image { margin-left: 0; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"] { margin: 0 !important; padding: 0 0.2em !important; background-color: ThreeDHighlight !important; @@ -84,10 +94,14 @@ -moz-border-bottom-colors: ThreeDShadow transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab > .tab-image-left, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab > .tab-image-right, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]) > .tab-image-left, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]) > .tab-image-right { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab > .tab-image-left, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab > .tab-image-right, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]) > .tab-image-left, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]) > .tab-image-right { height: auto; margin: 0 !important; padding: 0 !important; @@ -96,45 +110,59 @@ } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab > .tab-image-middle, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab > .tab-close-button, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle > .tab-close-button { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab > .tab-image-middle, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab > .tab-close-button, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]):not(:hover) > .tab-image-middle > .tab-close-button { height: auto; margin: 0 !important; padding: 0 !important; background: transparent; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"] > .tab-image-middle, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"] > .tab-close-button { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"] > .tab-image-middle, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"] > .tab-close-button { background: transparent; } -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab, -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab:not([selected="true"]) { +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab, +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab:not([selected="true"]) { border-left: 2px solid !important; -moz-border-left-colors: ThreeDLightShadow transparent !important; border-right: 2px solid !important; -moz-border-right-colors: ThreeDLightShadow transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab[selected="true"] { -moz-border-left-colors: ThreeDLightShadow transparent !important; -moz-border-right-colors: ThreeDLightShadow transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab .tab-close-button { +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab .tab-close-button { margin-right: 0 !important; } -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab, -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] .tabbrowser-tab:not([selected="true"]) { +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab, +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-tabbar-position="bottom"] + .tabbrowser-tab:not([selected="true"]) { border-right: 2px solid !important; -moz-border-right-colors: ThreeDShadow transparent !important; border-left: 2px solid !important; -moz-border-left-colors: ThreeDShadow transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] .tabbrowser-tab { /* Mac OS X */ +/* Mac OS X */ +.tabbrowser-tabs[treestyletab-style~="square"][treestyletab-mode="vertical"] + .tabbrowser-tab { text-align: start !important; -moz-box-pack: start !important; } @@ -145,54 +173,57 @@ .tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) { background: transparent !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) { - border-right: 1px solid #aaa !important; -} -.tabbrowser-tabs[treestyletab-style~="vertigo"][reestyletab-tabbar-position="right"] { - border-left: 1px solid #aaa !important; -} -.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-tabbar-position="bottom"] { - border-top: 1px solid #aaa !important; -} -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]) { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]) { background: transparent !important; -moz-border-top-colors: transparent transparent !important; -moz-border-bottom-colors: transparent transparent !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]):hover { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]):hover { background-color: #e0e8f6 !important; -moz-border-top-colors: #e0e8f6 #e0e8f6 !important; -moz-border-bottom-colors: #e0e8f6 #e0e8f6 !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"] { background-color: #c1d2ee !important; -moz-border-top-colors: #c1d2ee #c1d2ee !important; -moz-border-bottom-colors: #c1d2ee #c1d2ee !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"]:hover { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"]:hover { background-color: #d1e2fe !important; -moz-border-top-colors: #d1e2fe #d1e2fe !important; -moz-border-bottom-colors: #d1e2fe #d1e2fe !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]), -.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab:not([selected="true"]) { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]), +.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-tab:not([selected="true"]) { -moz-border-left-colors: transparent transparent !important; -moz-border-right-colors: transparent transparent !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]):hover, -.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab:not([selected="true"]):hover { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]):hover, +.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-tab:not([selected="true"]):hover { -moz-border-left-colors: #e0e8f6 #e0e8f6 !important; -moz-border-right-colors: #e0e8f6 #e0e8f6 !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"], -.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"], +.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-tab[selected="true"] { -moz-border-left-colors: #c1d2ee #c1d2ee !important; -moz-border-right-colors: #c1d2ee #c1d2ee !important; } -.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"]:hover, -.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"]:hover { +.tabbrowser-tabs[treestyletab-style~="vertigo"]:not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"]:hover, +.tabbrowser-tabs[treestyletab-style~="vertigo"][treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-tab[selected="true"]:hover { -moz-border-left-colors: #d1e2fe #d1e2fe !important; -moz-border-right-colors: #d1e2fe #d1e2fe !important; } @@ -200,69 +231,84 @@ /* Mixed style */ -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"] .tabbrowser-tab { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"] + .tabbrowser-tab { -moz-border-right-colors: transparent transparent !important; -moz-border-left-colors: transparent transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]):hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]):hover { background-color: #e0e8f6 !important; -moz-border-top-colors: #e0e8f6 transparent !important; -moz-border-left-colors: #e0e8f6 transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:first-child:not([selected="true"]):hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] + .tabbrowser-tab:first-child:not([selected="true"]):hover { -moz-border-top-colors: ThreeDShadow #e0e8f6 !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab:not([selected="true"]):hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-tab:not([selected="true"]):hover { -moz-border-right-colors: #e0e8f6 transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"] { background-color: #c1d2ee !important; -moz-border-top-colors: #c1d2ee transparent !important; -moz-border-left-colors: #c1d2ee transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:first-child[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] + .tabbrowser-tab:first-child[selected="true"] { -moz-border-top-colors: ThreeDShadow #c1d2ee !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-tab[selected="true"] { -moz-border-right-colors: #c1d2ee transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"]:hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"]:hover { background-color: #d1e2fe !important; -moz-border-top-colors: #d1e2fe transparent !important; -moz-border-left-colors: #d1e2fe transparent !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] .tabbrowser-tab:first-child[selected="true"]:hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-firsttab-border="true"] + .tabbrowser-tab:first-child[selected="true"]:hover { -moz-border-top-colors: ThreeDShadow #d1e2fe !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] .tabbrowser-tab[selected="true"]:hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"])[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"] + .tabbrowser-tab[selected="true"]:hover { -moz-border-right-colors: #d1e2fe transparent !important; } /* tab surface */ -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab, -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]) { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab, +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]) { background-image: url("tab-bg.png") !important; background-repeat: repeat-x !important; background-position: 1px 1px !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"] { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"] { background-image: url("tab-bg-highlighted.png") !important; } /* animation */ -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab:not([selected="true"]):hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab:not([selected="true"]):hover { background-color: ThreeDFace !important; background-image: url("tab-bg-hover.png") !important; } -.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) .tabbrowser-tab[selected="true"]:hover { +.tabbrowser-tabs[treestyletab-style~="square"]:not([treestyletab-style~="vertigo"]):not([treestyletab-tabbar-position="top"]) + .tabbrowser-tab[selected="true"]:hover { background-color: #c1d2ee !important; background-image: url("tab-bg-selected-hover.png") !important; }