ab3e964b9b3007a8f6247830be0f52a659b69657
[Packages/TYPO3.CMS.git] / typo3 / sysext / t3skin / rtehtmlarea / htmlarea.css
1 /* Selectors for the htmlArea RTE editor */
2 .htmlarea {
3 margin: 0 2px 0 0;
4 padding: 0;
5 }
6 .pleasewait {
7 position: relative;
8 margin-top:30px;
9 padding: 20px 0 20px 50px;
10 font-size: 11px !important;
11 text-align: left;
12 background: url("images/status/loading.gif") no-repeat 10px center;
13 vertical-align: middle;
14 color: #7F8083;
15 }
16 .editorWrap {
17 margin: 0;
18 margin-top: 2px;
19 padding: 0;
20 }
21 .editorWrap textarea {
22 border: 1px solid #A2AAB8;
23 border-style:solid;
24 border-color:#A2AAB8;
25 border-width:0px 1px 1px 1px;
26 padding:0px 1px;
27 margin:0;
28 }
29 .editorWrap .resizable {
30 background-image: url("images/status/resizable.gif");
31 background-position: bottom right;
32 background-repeat: no-repeat;
33 }
34 .editorWrap div.resizable {
35 padding-right: 7px;
36 padding-bottom: 5px;
37 }
38 /* Selectors for the editor toolbar */
39 .htmlarea .toolbar {
40 background-color: #EFEFF4;
41 cursor: default;
42 border: 1px solid #A2AAB8;
43 border-bottom: 0;
44 margin: 0;
45 padding: 2px;
46 font-family: Verdana, Helvetica, Geneva, Arial, sans-serif;
47 }
48 .htmlarea .toolbar .tb-group {
49 clear:none;
50 float:left;
51 margin:1px 2px 0px 0px;
52 padding:0;
53 }
54 .htmlarea .toolbar .x-form-item {
55 float: left;
56 margin:0;
57 }
58 .htmlarea .toolbar .x-form-item-label {
59 vertical-align:middle;
60 background-color:transparent;
61 border-style:none;
62 margin:0;padding:3px 3px 0px 3px;
63 }
64 /* Fix combo box left loat in IE6 */
65 body.ext-ie6 .htmlarea .toolbar .x-form-item {
66 width: 1%;
67 }
68 .htmlarea .toolbar .button {
69 background-color: transparent;
70 color: ButtonText;
71 border-style: solid;
72 border-width: 1px;
73 border-color: transparent;
74 border-collapse: separate;
75 margin: 0 0 4px 0;
76 padding: 0;
77 float: left;
78 }
79 .htmlarea .toolbar .x-btn-mc {
80 background-color: transparent;
81 background-image: none;
82 border-style: none;
83 margin: 0;
84 padding: 0;
85 }
86 .htmlarea .toolbar .x-btn-tl,
87 .htmlarea .toolbar .x-btn-tc,
88 .htmlarea .toolbar .x-btn-tr,
89 .htmlarea .toolbar .x-btn-ml,
90 .htmlarea .toolbar .x-btn-mr,
91 .htmlarea .toolbar .x-btn-bl,
92 .htmlarea .toolbar .x-btn-bc,
93 .htmlarea .toolbar .x-btn-br {
94 display: none;
95 }
96 .htmlarea .toolbar .x-btn-text {
97 background-image: url("images/sprites/actions.png");
98 background-repeat: no-repeat;
99 width: 20px;
100 height: 18px;
101 padding: 0;
102 margin: 1px 0 1px 2px;
103 }
104 .htmlarea .toolbar .buttonHover {
105 border-style: solid;
106 border-width: 1px;
107 border-color: white #C5C5D5 #C5C5D5 white;
108 background-color: #E0E0E9;
109 opacity: 1.00;
110 }
111 .htmlarea .toolbar .buttonActive,
112 .htmlarea .toolbar .buttonPressed,
113 .htmlarea-context-menu .buttonActive {
114 border-style: solid;
115 border-width: 1px;
116 border-color: #C5C5D5 #C5C5D5 #C5C5D5 #C5C5D5;
117 background-color: ButtonHighlight;
118 text-decoration: none;
119 opacity: 1.00;
120 }
121 .htmlarea .toolbar .indicator {
122 cursor: default;
123 background-color: white;
124 width: 20px;
125 height: 16px;
126 overflow: hidden;
127 text-align: center;
128 border: 1px solid ButtonShadow;
129 margin: 3px 1px 5px 1px;
130 padding: 0 3px;
131 float: left;
132 }
133 .htmlarea .toolbar .buttonDisabled {
134 filter: gray() alpha(opacity=25);
135 opacity: 0.25;
136 -moz-opacity: 0.25;
137 }
138 .htmlarea .toolbar .separator {
139 background-color: transparent;
140 background-image: url("images/separator.gif");
141 background-repeat: no-repeat;
142 background-position: 0 -1px;
143 width: 7px;
144 height: 23px;
145 border: 1px solid #EFEFF4;
146 margin-bottom: 1px;
147 float: left;
148 }
149 .htmlarea .toolbar .space {
150 background-color:transparent;
151 height:22px;
152 border-style:none;
153 margin:0;padding:0 1px;
154 float:left;
155 }
156 .htmlarea .toolbar .select {
157 color: WindowText;
158 margin: 0 0 4px 0;
159 }
160 .htmlarea .toolbar .x-form-item label.x-form-item-label{
161 padding-right: 0;
162 }
163 .htmlarea .toolbar .x-form-field-wrap .x-form-trigger {
164 right: 0;
165 }
166 .htmlarea .toolbar .select, .htmlarea .toolbar .select:hover, .htmlarea .toolbar .select:active {
167 background-color:Window;
168 }
169 .htmlarea .toolbar .select .buttonDisabled {
170 color:GrayText;
171 background-color:#EFEFF4;
172 }
173 .htmlarea .editorIframe {
174 clear:both;
175 width:100%;
176 border:1px solid #A2AAB8;border-bottom:1px solid #e4e0db;
177 margin:0;padding:0;
178 }
179 .htmlarea .noStatusBar {
180 border-bottom:1px solid #A2AAB8;
181 }
182 .htmlarea .statusBar {
183 color: #FFFFFF;
184 background-color: #EFEFF4;
185 background-image: url("images/alt_menu_mainitem_bg.gif");
186 background-repeat: repeat;
187 font-size: 10px;
188 font-family: Verdana, Helvetica, Geneva, Arial, sans-serif;
189 border: 1px solid;
190 border-color: #C5C5D5 #A2AAB8 #A2AAB8 #A2AAB8;
191 margin: 0;
192 padding: 0 3px;
193 line-height: 20px;
194 }
195 .htmlarea .statusBar .statusBarTree a {
196 color:#FFFFFF;
197 text-decoration:none;
198 font-weight:bold;
199 padding:0px 5px;
200 }
201 .htmlarea .statusBar .statusBarTree a:visited {
202 color:#FFFFFF;
203 }
204 .htmlarea .statusBar .statusBarTree a:hover {
205 text-decoration: underline;
206 }
207 /* Selectors for dialogue windows */
208 .htmlarea-window .x-panel-icon {
209 background-image: url("images/sprites/actions.png");
210 background-repeat: no-repeat;
211 margin-top: 2px;
212 height: 22px;
213 }
214 .htmlarea-window ul.x-tab-strip {
215 list-style: none;
216 }
217 .htmlarea-window .x-tab-panel-body {
218 background-color: #EFEFF4;
219 }
220 .htmlarea-window .x-fieldset {
221 margin: 3px;
222 }
223 .htmlarea-window .x-form-item-label {
224 font-size: 10px;
225 text-align: right;
226 margin: 0;
227 padding: 3px 5px 0 5px;
228 }
229 .htmlarea-window .x-btn-text {
230 font-weight: normal;
231 color: #000000;
232 }
233 .htmlarea-window .x-form-check-wrap {
234 padding-top: 3px;
235 }
236 .htmlarea-window iframe {
237 background-color: #FFF;
238 color: #000;
239 border: 1px solid #A2AAB8;
240 }
241 .htmlarea-window iframe.content-iframe {
242 background-color: #EFEFF4;
243 }
244 .htmlarea-window .show-color {
245 margin-top: 10px;
246 border-style: solid;
247 border-width: 1px;
248 border-color: white;
249 }
250 .htmlarea-custom-colors {
251 height: auto;
252 }
253 .htmlarea-custom-colors a {
254 border-color: transparent;
255 float: none;
256 display: block;
257 width: 100%;
258 }
259 .htmlarea-custom-colors em {
260 display: block;
261 border: 1px solid;
262 border-color: #C5C5D5;
263 width: 100%;
264 }
265 .htmlarea-custom-colors em span {
266 width: 100%;
267 }
268 /* Selectors for the About dialogue */
269 .htmlarea-window .about-plugins .x-list-body dt {
270 overflow: auto;
271 white-space: normal;
272 }
273 /* Selectors for the default image dialogue */
274 .htmlarea-window .image-preview {
275 height: 300px;
276 width: 99%;
277 float: right;
278 }
279 /* Selectors for the InsertSmiley plugin */
280 .htmlarea-window .emoticon-array {
281 padding: 10px;
282 }
283 .htmlarea-window .emoticon {
284 display: block;
285 float: left;
286 padding: 5px;
287 width: 20px;
288 height: 20px;
289 vertical-align: middle;
290 }
291 /* Selectors for the CharacterMap dialogue */
292 .htmlarea-window .character-map .character {
293 display: block;
294 float: left;
295 width: 20px;
296 font-size: 14px;
297 font-weight: bold;
298 text-align: center;
299 padding: 5px 3px;
300 border: 1px solid transparent;
301 }
302 .htmlarea-window .character-map .character:hover {
303 background-color: #FFFFFF;
304 border: 1px solid #A2AAB8;
305 }
306 /* Selectors for the SpellChecker dialogue */
307 .htmlarea-window .spell-check .controls {
308 text-align: center;
309 width: 175px;
310 margin: 3px;
311 }
312 .htmlarea-window .spell-check .controls .x-btn {
313 margin-top: 3px;
314 margin-left: 8px;
315 }
316 .htmlarea-window .spell-check .contentframe {
317 float: right;
318 height: 450px;
319 margin: 9px 0px;
320 }
321 /* Selectors for the ContextMenu plugin */
322 .htmlarea-context-menu {
323 background-color:#EFEFF4;
324 color:#212424;
325 font-family: Verdana, Helvetica, Geneva, Arial, sans-serif;
326 font-size:10px;
327 }
328 .htmlarea-context-menu ul {
329 list-style: none;
330 margin: 0;
331 }
332 .htmlarea-context-menu li {
333 margin: 0;
334 padding: 0;
335 border-width: 0;
336 }
337 .htmlarea-context-menu a {
338 font-weight: normal;
339 }
340 .htmlarea-context-menu .button {
341 background-color: transparent;
342 margin: 0 2px 0 0;
343 padding-top: 1px;
344 }
345 .htmlarea-context-menu .separator {
346 border-top: 1px solid #A2AAB8;
347 }
348 .htmlarea-context-menu .hover {
349 background-image: url("images/alt_menu_mainitem_bg.gif");
350 background-repeat: repeat-x;
351 color: #FFF;
352 margin: 0 2px 0 0;
353 padding-top: 1px;
354 border-color: #A2AAB8;
355 }
356 .htmlarea-context-menu .x-menu-item-icon {
357 background-image: url("images/sprites/actions.png");
358 background-repeat: no-repeat;
359 margin-top: -2px;
360 margin-left: -2px;
361 width: 18px;
362 height: 18px;
363 }
364 /* Window status bar selectors */
365 .htmlarea-window .status-ready {
366 padding-left: 21px !important;
367 background-repeat: no-repeat;
368 background-image: url("images/status/dialog-ok.png");
369 background-position: 0px 2px;
370 }
371 .htmlarea-window .status-info {
372 padding-left: 21px !important;
373 background-repeat: no-repeat;
374 background-image: url("images/status/dialog-information.png");
375 background-position: 0px 2px;
376 }
377 .htmlarea-window .status-wait {
378 padding-left: 45px !important;
379 background-repeat: no-repeat;
380 background-image: url("images/status/loading-balls.gif");
381 background-position: 0px 6px;
382 }
383 .x-statusbar .x-btn {
384 margin-left: 5px;
385 }
386 .x-statusbar .x-status-text {
387 cursor: default;
388 }
389
390 /* Button background positioning in window status bar*/
391 .x-statusbar .x-btn-tl{
392 background-position: 0 0;
393 }
394 .x-statusbar .x-btn-tr{
395 background-position: -3px 0;
396 }
397 .x-statusbar .x-btn-tc{
398 background-position: 0 -6px;
399 }
400 .x-statusbar .x-btn-ml{
401 background-position: 0 -24px;
402 }
403 .x-statusbar .x-btn-mr{
404 background-position: -3px -24px;
405 }
406 .x-statusbar .x-btn-mc{
407 background-position: 0 -1096px;
408 }
409 .x-statusbar .x-btn-bl{
410 background-position: 0 -3px;
411 }
412 .x-statusbar .x-btn-br{
413 background-position: -3px -3px;
414 }
415 .x-statusbar .x-btn-bc{
416 background-position: 0 -15px;
417 }
418 /* Action icon selectors for toolbar, context menu and window headers */
419 .htmlarea-action-abbreviation-edit { background-position: 0 0 !important; }
420 .htmlarea-action-bidi-override { background-position: 0 -58px !important; }
421 .htmlarea-action-big { background-position: 0 -116px !important; }
422 .htmlarea-action-blockquote { background-position: 0 -174px !important; }
423 .htmlarea-action-bold { background-position: 0 -232px !important; }
424 .htmlarea-action-cell-delete { background-position: 0 -290px !important; }
425 .htmlarea-action-cell-edit-properties { background-position: 0 -348px !important; }
426 .htmlarea-action-cell-insert-after { background-position: 0 -406px !important; }
427 .htmlarea-action-cell-insert-before { background-position: 0 -464px !important; }
428 .htmlarea-action-cell-merge { background-position: 0 -522px !important; }
429 .htmlarea-action-cell-split { background-position: 0 -580px !important; }
430 .htmlarea-action-character-insert-from-map { background-position: 0 -638px !important; }
431 .htmlarea-action-citation { background-position: 0 -696px !important; }
432 .htmlarea-action-code { background-position: 0 -754px !important; }
433 .htmlarea-action-color-background { background-position: 0 -812px !important; }
434 .htmlarea-action-color-foreground { background-position: 0 -870px !important; }
435 .htmlarea-action-column-delete { background-position: 0 -928px !important; }
436 .htmlarea-action-column-edit-properties { background-position: 0 -986px !important; }
437 .htmlarea-action-column-insert-after { background-position: 0 -1044px !important; }
438 .htmlarea-action-column-insert-before { background-position: 0 -1102px !important; }
439 .htmlarea-action-column-split { background-position: 0 -1160px !important; }
440 .htmlarea-action-copy { background-position: 0 -1218px !important; }
441 .htmlarea-action-cut { background-position: 0 -1276px !important; }
442 .htmlarea-action-definition-list-item { background-position: 0 -1334px !important; }
443 .htmlarea-action-definition-list { background-position: 0 -1392px !important; }
444 .htmlarea-action-definition { background-position: 0 -1450px !important; }
445 .htmlarea-action-delete-item { background-position: 0 -1508px !important; }
446 .htmlarea-action-deleted-text { background-position: 0 -1566px !important; }
447 .htmlarea-action-editor-show-about { background-position: 0 -1624px !important; }
448 .htmlarea-action-editor-toggle-mode { background-position: 0 -1682px !important; }
449 .htmlarea-action-emphasis { background-position: 0 -1740px !important; }
450 .htmlarea-action-find-replace { background-position: 0 -1798px !important; }
451 .htmlarea-action-horizontal-rule-insert { background-position: 0 -1856px !important; }
452 .htmlarea-action-image-edit { background-position: 0 -1914px !important; }
453 .htmlarea-action-indent { background-position: 0 -1972px !important; }
454 .htmlarea-action-inserted-text { background-position: 0 -2030px !important; }
455 .htmlarea-action-italic { background-position: 0 -2088px !important; }
456 .htmlarea-action-justify-center { background-position: 0 -2146px !important; }
457 .htmlarea-action-justify-full { background-position: 0 -2204px !important; }
458 .htmlarea-action-justify-left { background-position: 0 -2262px !important; }
459 .htmlarea-action-justify-right { background-position: 0 -2320px !important; }
460 .htmlarea-action-keyboard { background-position: 0 -2378px !important; }
461 .htmlarea-action-language-marks-show { background-position: 0 -2436px !important; }
462 .htmlarea-action-link-edit { background-position: 0 -2494px !important; }
463 .htmlarea-action-mono-spaced { background-position: 0 -2552px !important; }
464 .htmlarea-action-ordered-list { background-position: 0 -2610px !important; }
465 .htmlarea-action-outdent { background-position: 0 -2668px !important; }
466 .htmlarea-action-paragraph-insert-after { background-position: 0 -2726px !important; }
467 .htmlarea-action-paragraph-insert-before { background-position: 0 -2784px !important; }
468 .htmlarea-action-paste { background-position: 0 -2842px !important; }
469 .htmlarea-action-quotation { background-position: 0 -2900px !important; }
470 .htmlarea-action-redo { background-position: 0 -2958px !important; }
471 .htmlarea-action-remove-format { background-position: 0 -3016px !important; }
472 .htmlarea-action-row-delete { background-position: 0 -3074px !important; }
473 .htmlarea-action-row-edit-properties { background-position: 0 -3132px !important; }
474 .htmlarea-action-row-insert-above { background-position: 0 -3190px !important; }
475 .htmlarea-action-row-insert-under { background-position: 0 -3248px !important; }
476 .htmlarea-action-row-split { background-position: 0 -3306px !important; }
477 .htmlarea-action-sample { background-position: 0 -3364px !important; }
478 .htmlarea-action-small { background-position: 0 -3422px !important; }
479 .htmlarea-action-smiley-insert { background-position: 0 -3480px !important; }
480 .htmlarea-action-span { background-position: 0 -3538px !important; }
481 .htmlarea-action-spell-check { background-position: 0 -3596px !important; }
482 .htmlarea-action-strike-through { background-position: 0 -3654px !important; }
483 .htmlarea-action-strong { background-position: 0 -3712px !important; }
484 .htmlarea-action-subscript { background-position: 0 -3770px !important; }
485 .htmlarea-action-superscript { background-position: 0 -3828px !important; }
486 .htmlarea-action-table-edit-properties { background-position: 0 -3886px !important; }
487 .htmlarea-action-table-insert { background-position: 0 -3944px !important; }
488 .htmlarea-action-table-restyle { background-position: 0 -4002px !important; }
489 .htmlarea-action-table-show-borders { background-position: 0 -4060px !important; }
490 .htmlarea-action-tag-insert { background-position: 0 -4118px !important; }
491 .htmlarea-action-text-direction-left-to-right { background-position: 0 -4176px !important; }
492 .htmlarea-action-text-direction-right-to-left { background-position: 0 -4234px !important; }
493 .htmlarea-action-underline { background-position: 0 -4292px !important; }
494 .htmlarea-action-undo { background-position: 0 -4350px !important; }
495 .htmlarea-action-unlink { background-position: 0 -4408px !important; }
496 .htmlarea-action-unordered-list { background-position: 0 -4466px !important; }
497 .htmlarea-action-user-element-edit { background-position: 0 -4524px !important; }
498 .htmlarea-action-variable { background-position: 0 -4582px !important; }