tweaks for making devtools look nicer
[themes.git] / LCARStrek / global / button.css
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/. */
4
5 /* ===== button.css =====================================================
6   == Styles used by the XUL (and XHTML in netError.xhtml) button element.
7   ======================================================================= */
8
9 /* :::::::::: button :::::::::: */
10
11 button {
12   border-radius: 300px;
13   margin: 1px 2px;
14   min-width: 6.3em;
15   border: none;
16   background-color: #C09070;
17   color: #000000;
18   text-shadow: none;
19 }
20
21 .button-box {
22   border-radius: 300px;
23   border: 1px solid transparent;
24   padding-top: 1px;
25   padding-bottom: 2px;
26   -moz-padding-start: .5em;
27   -moz-padding-end: calc(.5em + 1px);
28 }
29
30 .button-icon {
31   -moz-margin-end: 2px;
32 }
33
34 .button-text {
35   border-radius: 3px;
36   margin: 0px !important;
37   text-align: center;
38 }
39
40 /* .......... focused state .......... */
41
42 button:-moz-focusring > .button-box {
43   border: 1px dotted #008484;
44 }
45
46 /* .......... default state .......... */
47
48 button[default="true"] {
49   background-color: #A06060;
50 }
51
52 button[default="true"] > .button-box {
53   font-weight: bold;
54 }
55
56 /* .......... active/open/checked state .......... */
57
58 button:hover,
59 button:hover:active {
60   border: none;
61   background-color: #FFCF00;
62   color: #000000;
63 }
64
65 button[open="true"] {
66   border: none;
67   background-color: #FF9F00;
68   color: #000000;
69 }
70
71 button[checked="true"]:not(:hover) {
72   border: none;
73   background-color: #008484;
74   color: #000000;
75 }
76
77 button:hover:active > .button-box,
78 button[open="true"] > .button-box,
79 button[checked="true"] > .button-box {
80   padding-top: 2px;
81   padding-bottom: 1px;
82   -moz-padding-start: calc(.5em + 1px);
83   -moz-padding-end: .5em;
84 }
85
86 /* .......... disabled state .......... */
87
88 button[disabled="true"],
89 button[disabled="true"]:hover:active {
90   border: none;
91   background-color: #402858 !important;
92   color: #000000 !important;
93 }
94
95 button[disabled="true"] > .button-box {
96   padding-top: 1px !important;
97   padding-bottom: 2px !important;
98   -moz-padding-start: .5em !important;
99   -moz-padding-end: calc(.5em + 1px) !important;
100 }
101
102 /* ::::: menu/menu-button buttons ::::: */
103
104 .button-menubutton-button,
105 .button-menubutton-button:hover,
106 .button-menubutton-button:hover:active,
107 .button-menubutton-button[open="true"],
108 .button-menubutton-button[disabled="true"] {
109   margin: 0px;
110   background-color: transparent;
111 }
112
113 button[type="menu-button"]:hover:active > .button-menubutton-button > .button-box,
114 button[type="menu-button"][open="true"] > .button-menubutton-button > .button-box {
115   padding-top: 2px;
116   padding-bottom: 1px;
117   -moz-padding-start: calc(.5em + 1px);
118   -moz-padding-end: .5em;
119 }
120
121 button[type="menu-button"]:hover > .button-menubutton-button,
122 button[type="menu-button"]:hover:active > .button-menubutton-button,
123 button[type="menu-button"][open="true"] > .button-menubutton-button {
124   color: #000000;
125 }
126
127 .button-menu-dropmarker,
128 .button-menubutton-dropmarker {
129   margin: 2px;
130   width: 11px;
131   height: 11px;
132   background-color: transparent;
133   border: none;
134 }
135
136 button[type="menu-button"]:hover > .button-menubutton-dropmarker,
137 button[type="menu-button"]:hover:active > .button-menubutton-dropmarker,
138 button[type="menu-button"][open="true"] > .button-menubutton-dropmarker {
139   list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
140 }
141
142 /* ::::: plain buttons ::::: */
143
144 button.plain {
145   border: 0px !important;
146   margin: 0px !important;
147   padding: 0px !important;
148 }
149
150 button[type="disclosure"] {
151   border: 0px !important;
152   margin: 0px !important;
153   padding: 0px !important;
154   list-style-image: url("chrome://global/skin/tree/twisty-closed.gif");
155   min-width: 0px !important;
156   background-color: transparent;
157 }
158
159 button[type="disclosure"][open="true"] {
160   list-style-image: url("chrome://global/skin/tree/twisty-open.gif");
161 }
162
163 /* ::::: xhtml buttons ::::: */
164
165 button::-moz-focus-inner {
166   padding: 0px;
167   border: 0px none;
168 }
169
170 /* ::::: toolbar buttons (sync look with toolbarbutton) ::::: */
171
172 /* The #throbber-box rules are only needed for the SeaMonkey editor,
173  * the toolbaritem ones for buttons in customizable toolbars. */
174 toolbaritem > button,
175 #throbber-box > button {
176   border-radius: 3px;
177   background-color: #000000;
178   color: #FFCF00;
179 }
180
181 toolbaritem > button > .button-box,
182 #throbber-box > button > .button-box {
183   border-radius: 3px;
184   -moz-padding-start: 0;
185   -moz-padding-end: 1px;
186 }
187
188 toolbaritem > button > button:hover:active > .button-box,
189 toolbaritem > button > button[open="true"] > .button-box,
190 toolbaritem > button > button[checked="true"] > .button-box,
191 #throbber-box > button:hover:active > .button-box,
192 #throbber-box > button > button[open="true"] > .button-box,
193 #throbber-box > button > button[checked="true"] > .button-box {
194   -moz-padding-start: 1px;
195   -moz-padding-end: 0;
196 }
197
198 toolbaritem > button > button[disabled="true"] > .button-box,
199 #throbber-box > button[disabled="true"] > .button-box {
200   -moz-padding-start: 0 !important;
201   -moz-padding-end: 1px !important;
202 }