Commit | Line | Data |
---|---|---|
9099c61d RK |
1 | /* This Source Code Form is subject to the terms of the Mozilla Public |
2 | * License, v. 2.0. If a copy of the MPL was not distributed with this | |
3 | * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ | |
351107c9 | 4 | |
b1eaa419 | 5 | /* ===== button.css ===================================================== |
9545fc93 | 6 | == Styles used by the XUL (and XHTML in netError.xhtml) button element. |
b1eaa419 | 7 | ======================================================================= */ |
351107c9 | 8 | |
b1eaa419 | 9 | /* :::::::::: button :::::::::: */ |
351107c9 | 10 | |
b1eaa419 | 11 | button { |
569543b3 | 12 | border-radius: 3px; |
2b722888 | 13 | margin: 1px 2px; |
b1eaa419 | 14 | min-width: 6.3em; |
15 | border: none; | |
16 | background-color: #000000; | |
17 | color: #FFCF00; | |
a064a540 | 18 | text-shadow: none; |
b1eaa419 | 19 | } |
3a121502 | 20 | |
b1eaa419 | 21 | .button-box { |
569543b3 | 22 | border-radius: 3px; |
3a121502 | 23 | border: 1px solid transparent; |
02920d2b RK |
24 | padding-top: 1px; |
25 | padding-bottom: 2px; | |
26 | -moz-padding-start: 3px; | |
27 | -moz-padding-end: 4px; | |
b1eaa419 | 28 | } |
351107c9 | 29 | |
c79d2bbe | 30 | .button-icon { |
8caa872d | 31 | -moz-margin-end: 2px; |
c79d2bbe RK |
32 | } |
33 | ||
b1eaa419 | 34 | .button-text { |
569543b3 | 35 | border-radius: 3px; |
351107c9 | 36 | margin: 0px !important; |
b1eaa419 | 37 | text-align: center; |
351107c9 | 38 | } |
39 | ||
b1eaa419 | 40 | /* .......... focused state .......... */ |
41 | ||
024ec655 | 42 | button:-moz-focusring > .button-box { |
0c7f928d | 43 | border: 1px dotted #008484; |
351107c9 | 44 | } |
45 | ||
b1eaa419 | 46 | /* .......... default state .......... */ |
47 | ||
48 | button[default="true"] > .button-box { | |
49 | font-weight: bold; | |
50 | list-style-image: url("chrome://global/skin/icons/return.gif"); | |
61290d60 | 51 | -moz-box-direction: reverse; |
c79d2bbe RK |
52 | } |
53 | ||
54 | button[default="true"] > .button-box > .button-icon { | |
8caa872d RK |
55 | -moz-margin-end: 0px; |
56 | -moz-margin-start: 2px; | |
351107c9 | 57 | } |
58 | ||
b1eaa419 | 59 | button[default="true"]:hover > .button-box, |
60 | button[default="true"]:hover:active > .button-box { | |
61 | list-style-image: url("chrome://global/skin/icons/return-hover.gif"); | |
62 | } | |
63 | ||
64 | button[default="true"][disabled="true"] > .button-box { | |
65 | font-weight: bold; | |
66 | list-style-image: url("chrome://global/skin/icons/return-disabled.gif") !important; | |
67 | } | |
68 | ||
69 | /* .......... active/open/checked state .......... */ | |
70 | ||
71 | button:hover, | |
72 | button:hover:active { | |
4c18c82c | 73 | border: none; |
b1eaa419 | 74 | background-color: #FFCF00; |
75 | color: #000000; | |
76 | } | |
77 | ||
78 | button[open="true"] { | |
4c18c82c | 79 | border: none; |
b1eaa419 | 80 | background-color: #FF9F00; |
81 | color: #000000; | |
82 | } | |
83 | ||
4c18c82c RK |
84 | button[checked="true"]:not(:hover) { |
85 | border: none; | |
b1eaa419 | 86 | background-color: #008484; |
87 | color: #000000; | |
88 | } | |
89 | ||
90 | button:hover:active > .button-box, | |
91 | button[open="true"] > .button-box, | |
92 | button[checked="true"] > .button-box { | |
02920d2b RK |
93 | padding-top: 2px; |
94 | padding-bottom: 1px; | |
95 | -moz-padding-start: 4px; | |
96 | -moz-padding-end: 3px; | |
b1eaa419 | 97 | } |
351107c9 | 98 | |
b1eaa419 | 99 | /* .......... disabled state .......... */ |
100 | ||
3a121502 | 101 | button[disabled="true"], |
102 | button[disabled="true"]:hover:active { | |
b1eaa419 | 103 | border: none; |
104 | background-color: #000000 !important; | |
105 | color: #8050B0 !important; | |
106 | } | |
107 | ||
108 | button[disabled="true"] > .button-box { | |
02920d2b RK |
109 | padding-top: 1px !important; |
110 | padding-bottom: 2px !important; | |
111 | -moz-padding-start: 3px !important; | |
112 | -moz-padding-end: 4px !important; | |
b1eaa419 | 113 | } |
114 | ||
115 | /* ::::: menu/menu-button buttons ::::: */ | |
116 | ||
7f3c87b9 RK |
117 | .button-menubutton-button, |
118 | .button-menubutton-button:hover, | |
119 | .button-menubutton-button:hover:active, | |
120 | .button-menubutton-button[open="true"], | |
121 | .button-menubutton-button[disabled="true"] { | |
351107c9 | 122 | margin: 0px; |
7f3c87b9 RK |
123 | background-color: transparent; |
124 | } | |
125 | ||
126 | button[type="menu-button"]:hover:active > .button-menubutton-button > .button-box, | |
127 | button[type="menu-button"][open="true"] > .button-menubutton-button > .button-box { | |
128 | padding-top: 2px; | |
129 | padding-bottom: 1px; | |
130 | -moz-padding-start: 4px; | |
131 | -moz-padding-end: 3px; | |
132 | } | |
133 | ||
134 | button[type="menu-button"]:hover > .button-menubutton-button, | |
135 | button[type="menu-button"]:hover:active > .button-menubutton-button, | |
136 | button[type="menu-button"][open="true"] > .button-menubutton-button { | |
137 | color: #000000; | |
b1eaa419 | 138 | } |
139 | ||
140 | .button-menu-dropmarker, | |
141 | .button-menubutton-dropmarker { | |
7f3c87b9 | 142 | margin: 2px; |
8b17a53f RK |
143 | width: 11px; |
144 | height: 11px; | |
7f3c87b9 RK |
145 | background-color: transparent; |
146 | border: none; | |
147 | } | |
148 | ||
149 | button[type="menu-button"]:hover > .button-menubutton-dropmarker, | |
150 | button[type="menu-button"]:hover:active > .button-menubutton-dropmarker, | |
151 | button[type="menu-button"][open="true"] > .button-menubutton-dropmarker { | |
152 | list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif"); | |
b1eaa419 | 153 | } |
154 | ||
b1eaa419 | 155 | /* ::::: plain buttons ::::: */ |
156 | ||
157 | button.plain { | |
158 | border: 0px !important; | |
159 | margin: 0px !important; | |
160 | padding: 0px !important; | |
351107c9 | 161 | } |
c79d2bbe RK |
162 | |
163 | button[type="disclosure"] { | |
164 | border: 0px !important; | |
165 | margin: 0px !important; | |
166 | padding: 0px !important; | |
167 | list-style-image: url("chrome://global/skin/tree/twisty-closed.gif"); | |
168 | min-width: 0px !important; | |
169 | background-color: transparent; | |
170 | } | |
171 | ||
172 | button[type="disclosure"][open="true"] { | |
173 | list-style-image: url("chrome://global/skin/tree/twisty-open.gif"); | |
174 | } | |
9545fc93 RK |
175 | |
176 | /* ::::: xhtml buttons ::::: */ | |
177 | ||
178 | button::-moz-focus-inner { | |
179 | padding: 0px; | |
180 | border: 0px none; | |
181 | } |