michael@0: /* This Source Code Form is subject to the terms of the Mozilla Public
michael@0:  * License, v. 2.0. If a copy of the MPL was not distributed with this
michael@0:  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
michael@0: 
michael@0: /* ===== tabbox.css =================================================
michael@0:   == Styles used by XUL tab-related elements.
michael@0:   ======================================================================= */
michael@0: 
michael@0: @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
michael@0: 
michael@0: /* ::::: tabs ::::: */
michael@0: 
michael@0: .tabs-left,
michael@0: .tabs-right {
michael@0:   border-bottom: 2px solid;
michael@0:   -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
michael@0: }
michael@0: 
michael@0: /* ::::: tabpanels ::::: */
michael@0: 
michael@0: tabpanels {
michael@0:   -moz-appearance: tabpanels; 
michael@0:   border-right: 2px solid;
michael@0:   border-bottom: 2px solid;
michael@0:   border-left: 2px solid;
michael@0:   -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
michael@0:   -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow;
michael@0:   -moz-border-left-colors: ThreeDHighlight ThreeDLightShadow;
michael@0:   padding: 8px;
michael@0:   background-color: -moz-Dialog;
michael@0:   color: -moz-DialogText;
michael@0: }
michael@0: 
michael@0: /* ::::: tab ::::: */
michael@0: 
michael@0: tab 
michael@0: {
michael@0:   -moz-appearance: tab;
michael@0:   margin-top: 2px;
michael@0:   border-top: 2px solid;
michael@0:   border-right: 2px solid;
michael@0:   border-left: 2px solid;
michael@0:   border-bottom: 1px solid ThreeDHighlight;
michael@0:   -moz-border-top-colors: ThreeDHighlight ThreeDLightShadow;
michael@0:   -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
michael@0:   -moz-border-left-colors: ThreeDHighlight ThreeDLightShadow;
michael@0:   border-top-left-radius: 2px;
michael@0:   border-top-right-radius: 2px;
michael@0:   padding: 1px 4px 2px 4px;
michael@0:   background-color: -moz-Dialog;
michael@0:   color: -moz-DialogText;
michael@0: }
michael@0: 
michael@0: tab:-moz-locale-dir(rtl) {
michael@0:   border-bottom-left-radius: 1px;
michael@0:   border-bottom-right-radius: 0px;
michael@0: }
michael@0: 
michael@0: .tab-text {
michael@0:   margin: 0 !important;
michael@0: }
michael@0: 
michael@0: tab[selected="true"] {
michael@0:   margin-top: 0;
michael@0:   border-bottom-color: transparent;
michael@0:   padding: 1px 6px 4px 6px;
michael@0: }
michael@0: 
michael@0: tab:-moz-focusring > .tab-middle {
michael@0:   /* Don't specify the outline-color, we should always use initial value. */
michael@0:   outline: 1px dotted;
michael@0: }
michael@0: 
michael@0: tab[beforeselected="true"]:-moz-locale-dir(ltr),
michael@0: tab[selected="true"]:-moz-locale-dir(rtl) + tab {
michael@0:   border-right: none;
michael@0:   border-top-right-radius: 0;
michael@0: }
michael@0: 
michael@0: tab[selected="true"]:-moz-locale-dir(ltr) + tab,
michael@0: tab[beforeselected="true"]:-moz-locale-dir(rtl) {
michael@0:   border-left: none;
michael@0:   border-top-left-radius: 0;
michael@0: }
michael@0: 
michael@0: tab:first-of-type[selected="true"] {
michael@0:   padding-right: 5px;
michael@0:   padding-left: 5px;
michael@0: }
michael@0: 
michael@0: /* ::::: tab-bottom ::::::::::
michael@0:    :: Tabs that are attached to the bottom of a panel, but not necessarily
michael@0:    :: a tabpanels.
michael@0:    ::::: */
michael@0: 
michael@0: .tab-bottom {
michael@0:   margin-top: 0;
michael@0:   margin-bottom: 2px;
michael@0:   border-top: 1px solid;
michael@0:   border-bottom: 2px solid;
michael@0:   -moz-border-top-colors: ThreeDShadow;
michael@0:   -moz-border-bottom-colors: ThreeDShadow ThreeDLightShadow;
michael@0:   border-top-left-radius: 0;
michael@0:   border-top-right-radius: 0;
michael@0:   border-bottom-right-radius: 2px;
michael@0:   border-bottom-left-radius: 2px;
michael@0:   padding: 2px 4px 1px 4px;
michael@0: }
michael@0: 
michael@0: .tab-bottom[selected="true"] {
michael@0:   margin-bottom: 0;
michael@0:   -moz-border-top-colors: -moz-Dialog;
michael@0:   padding: 4px 6px 1px 6px;
michael@0: }
michael@0: 
michael@0: .tab-bottom[beforeselected="true"]:-moz-locale-dir(ltr),
michael@0: .tab-bottom[selected="true"]:-moz-locale-dir(rtl) + .tab-bottom {
michael@0:   border-bottom-right-radius: 0;
michael@0: }
michael@0: 
michael@0: .tab-bottom[selected="true"]:-moz-locale-dir(ltr) + .tab-bottom,
michael@0: .tab-bottom[beforeselected="true"]:-moz-locale-dir(rtl) {
michael@0:   border-bottom-left-radius: 0;
michael@0: }
michael@0: 
michael@0: /* ::::: tabs-bottom ::::: */
michael@0: 
michael@0: .tabs-bottom > .tabs-left,
michael@0: .tabs-bottom > .tabs-right {
michael@0:   border-top: 1px solid ThreeDShadow;
michael@0:   border-bottom: none;
michael@0: }
michael@0: