root / drupal7 / modules / system / system.base.css @ 01f36513
1 |
|
---|---|
2 |
/**
|
3 |
* @file
|
4 |
* Generic theme-independent base styles.
|
5 |
*/
|
6 |
|
7 |
/**
|
8 |
* Autocomplete.
|
9 |
*
|
10 |
* @see autocomplete.js
|
11 |
*/
|
12 |
/* Suggestion list */
|
13 |
#autocomplete {
|
14 |
border: 1px solid; |
15 |
overflow: hidden; |
16 |
position: absolute; |
17 |
z-index: 100; |
18 |
} |
19 |
#autocomplete ul { |
20 |
list-style: none; |
21 |
list-style-image: none; |
22 |
margin: 0; |
23 |
padding: 0; |
24 |
} |
25 |
#autocomplete li { |
26 |
background: #fff; |
27 |
color: #000; |
28 |
cursor: default; |
29 |
white-space: pre; |
30 |
zoom: 1; /* IE7 */ |
31 |
} |
32 |
/* Animated throbber */
|
33 |
html.js input.form-autocomplete { |
34 |
background-image: url(../../misc/throbber-inactive.png); |
35 |
background-position: 100% center; /* LTR */ |
36 |
background-repeat: no-repeat; |
37 |
} |
38 |
html.js input.throbbing { |
39 |
background-image: url(../../misc/throbber-active.gif); |
40 |
background-position: 100% center; /* LTR */ |
41 |
} |
42 |
|
43 |
/**
|
44 |
* Collapsible fieldsets.
|
45 |
*
|
46 |
* @see collapse.js
|
47 |
*/
|
48 |
html.js fieldset.collapsed { |
49 |
border-bottom-width: 0; |
50 |
border-left-width: 0; |
51 |
border-right-width: 0; |
52 |
height: 1em; |
53 |
} |
54 |
html.js fieldset.collapsed .fieldset-wrapper { |
55 |
display: none; |
56 |
} |
57 |
fieldset.collapsible { |
58 |
position: relative; |
59 |
} |
60 |
fieldset.collapsible .fieldset-legend { |
61 |
display: block; |
62 |
} |
63 |
|
64 |
/**
|
65 |
* Resizable textareas.
|
66 |
*
|
67 |
* @see textarea.js
|
68 |
*/
|
69 |
.form-textarea-wrapper textarea { |
70 |
display: block; |
71 |
margin: 0; |
72 |
width: 100%; |
73 |
-moz-box-sizing: border-box; |
74 |
-webkit-box-sizing: border-box; |
75 |
box-sizing: border-box; |
76 |
} |
77 |
.resizable-textarea .grippie { |
78 |
background: #eee url(../../misc/grippie.png) no-repeat center 2px; |
79 |
border: 1px solid #ddd; |
80 |
border-top-width: 0; |
81 |
cursor: s-resize; |
82 |
height: 9px; |
83 |
overflow: hidden; |
84 |
} |
85 |
|
86 |
/**
|
87 |
* TableDrag behavior.
|
88 |
*
|
89 |
* @see tabledrag.js
|
90 |
*/
|
91 |
body.drag { |
92 |
cursor: move; |
93 |
} |
94 |
.draggable a.tabledrag-handle { |
95 |
cursor: move; |
96 |
float: left; /* LTR */ |
97 |
height: 1.7em; |
98 |
margin-left: -1em; /* LTR */ |
99 |
overflow: hidden; |
100 |
text-decoration: none; |
101 |
} |
102 |
a.tabledrag-handle:hover { |
103 |
text-decoration: none; |
104 |
} |
105 |
a.tabledrag-handle .handle { |
106 |
background: url(../../misc/draggable.png) no-repeat 6px 9px; |
107 |
height: 13px; |
108 |
margin: -0.4em 0.5em; /* LTR */ |
109 |
padding: 0.42em 0.5em; /* LTR */ |
110 |
width: 13px; |
111 |
} |
112 |
a.tabledrag-handle-hover .handle { |
113 |
background-position: 6px -11px; |
114 |
} |
115 |
div.indentation { |
116 |
float: left; /* LTR */ |
117 |
height: 1.7em; |
118 |
margin: -0.4em 0.2em -0.4em -0.4em; /* LTR */ |
119 |
padding: 0.42em 0 0.42em 0.6em; /* LTR */ |
120 |
width: 20px; |
121 |
} |
122 |
div.tree-child { |
123 |
background: url(../../misc/tree.png) no-repeat 11px center; /* LTR */ |
124 |
} |
125 |
div.tree-child-last { |
126 |
background: url(../../misc/tree-bottom.png) no-repeat 11px center; /* LTR */ |
127 |
} |
128 |
div.tree-child-horizontal { |
129 |
background: url(../../misc/tree.png) no-repeat -11px center; |
130 |
} |
131 |
.tabledrag-toggle-weight-wrapper {
|
132 |
text-align: right; /* LTR */ |
133 |
} |
134 |
|
135 |
/**
|
136 |
* TableHeader behavior.
|
137 |
*
|
138 |
* @see tableheader.js
|
139 |
*/
|
140 |
table.sticky-header { |
141 |
background-color: #fff; |
142 |
margin-top: 0; |
143 |
} |
144 |
|
145 |
/**
|
146 |
* Progress behavior.
|
147 |
*
|
148 |
* @see progress.js
|
149 |
*/
|
150 |
/* Bar */
|
151 |
.progress .bar { |
152 |
background-color: #fff; |
153 |
border: 1px solid; |
154 |
} |
155 |
.progress .filled { |
156 |
background-color: #000; |
157 |
height: 1.5em; |
158 |
width: 5px; |
159 |
} |
160 |
.progress .percentage { |
161 |
float: right; /* LTR */ |
162 |
} |
163 |
/* Throbber */
|
164 |
.ajax-progress {
|
165 |
display: inline-block; |
166 |
} |
167 |
.ajax-progress .throbber { |
168 |
background: transparent url(../../misc/throbber-active.gif) no-repeat 0px center; |
169 |
float: left; /* LTR */ |
170 |
height: 15px; |
171 |
margin: 2px; |
172 |
width: 15px; |
173 |
} |
174 |
.ajax-progress .message { |
175 |
padding-left: 20px; |
176 |
} |
177 |
tr .ajax-progress .throbber { |
178 |
margin: 0 2px; |
179 |
} |
180 |
.ajax-progress-bar {
|
181 |
width: 16em; |
182 |
} |
183 |
|
184 |
/**
|
185 |
* Inline items.
|
186 |
*/
|
187 |
.container-inline div, |
188 |
.container-inline label { |
189 |
display: inline; |
190 |
} |
191 |
/* Fieldset contents always need to be rendered as block. */
|
192 |
.container-inline .fieldset-wrapper { |
193 |
display: block; |
194 |
} |
195 |
|
196 |
/**
|
197 |
* Prevent text wrapping.
|
198 |
*/
|
199 |
.nowrap {
|
200 |
white-space: nowrap; |
201 |
} |
202 |
|
203 |
/**
|
204 |
* For anything you want to hide on page load when JS is enabled, so
|
205 |
* that you can use the JS to control visibility and avoid flicker.
|
206 |
*/
|
207 |
html.js .js-hide { |
208 |
display: none; |
209 |
} |
210 |
|
211 |
/**
|
212 |
* Hide elements from all users.
|
213 |
*
|
214 |
* Used for elements which should not be immediately displayed to any user. An
|
215 |
* example would be a collapsible fieldset that will be expanded with a click
|
216 |
* from a user. The effect of this class can be toggled with the jQuery show()
|
217 |
* and hide() functions.
|
218 |
*/
|
219 |
.element-hidden {
|
220 |
display: none; |
221 |
} |
222 |
|
223 |
/**
|
224 |
* Hide elements visually, but keep them available for screen-readers.
|
225 |
*
|
226 |
* Used for information required for screen-reader users to understand and use
|
227 |
* the site where visual display is undesirable. Information provided in this
|
228 |
* manner should be kept concise, to avoid unnecessary burden on the user.
|
229 |
* "!important" is used to prevent unintentional overrides.
|
230 |
*/
|
231 |
.element-invisible {
|
232 |
position: absolute !important; |
233 |
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ |
234 |
clip: rect(1px, 1px, 1px, 1px); |
235 |
overflow: hidden; |
236 |
height: 1px; |
237 |
} |
238 |
|
239 |
/**
|
240 |
* The .element-focusable class extends the .element-invisible class to allow
|
241 |
* the element to be focusable when navigated to via the keyboard.
|
242 |
*/
|
243 |
.element-invisible.element-focusable:active, |
244 |
.element-invisible.element-focusable:focus { |
245 |
position: static !important; |
246 |
clip: auto; |
247 |
overflow: visible; |
248 |
height: auto; |
249 |
} |
250 |
|
251 |
/**
|
252 |
* Markup free clearing.
|
253 |
*
|
254 |
* @see http://perishablepress.com/press/2009/12/06/new-clearfix-hack
|
255 |
*/
|
256 |
.clearfix:after { |
257 |
content: "."; |
258 |
display: block; |
259 |
height: 0; |
260 |
clear: both; |
261 |
visibility: hidden; |
262 |
} |
263 |
/* IE6 */
|
264 |
* html .clearfix { |
265 |
height: 1%; |
266 |
} |
267 |
/* IE7 */
|
268 |
*:first-child + html .clearfix { |
269 |
min-height: 1%; |
270 |
} |
271 |
|