12d5bad230dc56e97c8bee8b9e616d5f37acb0b5
[Packages/TYPO3.CMS.git] / typo3 / sysext / rtehtmlarea / htmlarea / skins / default / htmlarea.css
1 /* Selectors for the htmlArea RTE editor */
2 .htmlarea {
3 background-color:#fff;
4 margin:0;padding:0;
5 }
6 .pleasewait {
7 position:relative;top:0px;text-align:left;
8 font-size:8pt;
9 margin-top:30px;
10 }
11 .editorWrap {
12 margin:0;padding:0;
13 }
14 /* Selectors for the editor toolbar */
15 .htmlarea div.toolbar {
16 background-color:#e4e0db;cursor:default;
17 width:100%;
18 border:1px solid #e4e0db;border-bottom:1px solid #000;margin:0;padding:0px 0px 2px 0px;
19 }
20 .htmlarea .toolbar ul {
21 background-color:transparent;
22 list-style-type:none;list-style-image:none;
23 border-style:none;margin:0;padding:0;
24 }
25 .htmlarea .toolbar ul.tb-line {
26 clear:both;
27 }
28 .htmlarea .toolbar ul.tb-group {
29 clear:none;float:left;
30 }
31 .htmlarea .toolbar ul li {
32 float:left;
33 background-color:transparent;
34 font:11px Tahoma,Verdana,sans-serif;
35 border-style:none;padding:0;
36 }
37 .htmlarea .toolbar ul.tb-line li {
38 margin:1px 0px 1px 0px;
39 }
40 .htmlarea .toolbar ul.free-float li, .htmlarea .toolbar ul.tb-group li {
41 height:22px;
42 margin:0;
43 }
44 .htmlarea .toolbar label {
45 float:left;
46 vertical-align:middle;
47 height:22px;
48 background-color:#e4e0db;
49 margin:0;padding:3px 3px 0px 3px;
50 }
51 .htmlarea .toolbar button {
52 vertical-align:top;
53 background-color:#e4e0db;background-position:1px 1px;background-repeat:no-repeat;color:ButtonText;
54 border:1px solid #e4e0db;margin:0;padding:1px;
55 width:22px;height:22px;
56 }
57 .htmlarea .toolbar button div.buttonImgContainer {
58 position:relative;top:0;left:0;
59 width:18px;height:18px;overflow:hidden;
60 margin:0;padding:0;
61 }
62 .htmlarea .toolbar .BiDiOverride {background-image:url("images/InlineElements/bidioverride.gif");}
63 .htmlarea .toolbar .Big {background-image:url("images/InlineElements/big.gif");}
64 .htmlarea .toolbar .Bold {background-image:url("images/InlineElements/bold.gif");}
65 .htmlarea .toolbar .Citation {background-image:url("images/InlineElements/citation.gif");}
66 .htmlarea .toolbar .Code {background-image:url("images/InlineElements/code.gif");}
67 .htmlarea .toolbar .Definition {background-image:url("images/InlineElements/definition.gif");}
68 .htmlarea .toolbar .DeletedText {background-image:url("images/InlineElements/deletedtext.gif");}
69 .htmlarea .toolbar .Emphasis {background-image:url("images/InlineElements/emphasis.gif");}
70 .htmlarea .toolbar .InsertedText {background-image:url("images/InlineElements/insertedtext.gif");}
71 .htmlarea .toolbar .Italic {background-image:url("images/InlineElements/italic.gif");}
72 .htmlarea .toolbar .Keyboard {background-image:url("images/InlineElements/keyboard.gif");}
73 .htmlarea .toolbar .MonoSpaced {background-image:url("images/InlineElements/monospaced.gif");}
74 .htmlarea .toolbar .Quotation {background-image:url("images/InlineElements/quotation.gif");}
75 .htmlarea .toolbar .Sample {background-image:url("images/InlineElements/sample.gif");}
76 .htmlarea .toolbar .Small {background-image:url("images/InlineElements/small.gif");}
77 .htmlarea .toolbar .Span {background-image:url("images/InlineElements/span.gif");}
78 .htmlarea .toolbar .StrikeThrough {background-image:url("images/InlineElements/strikethrough.gif");}
79 .htmlarea .toolbar .Strong {background-image:url("images/InlineElements/strong.gif");}
80 .htmlarea .toolbar .Subscript {background-image:url("images/InlineElements/subscript.gif");}
81 .htmlarea .toolbar .Superscript {background-image:url("images/InlineElements/superscript.gif");}
82 .htmlarea .toolbar .Underline {background-image:url("images/InlineElements/underline.gif");}
83 .htmlarea .toolbar .Variable {background-image:url("images/InlineElements/variable.gif");}
84 .htmlarea .toolbar .LeftToRight {background-image:url("images/ed_left_to_right.gif");}
85 .htmlarea .toolbar .RightToLeft {background-image:url("images/ed_right_to_left.gif");}
86 .htmlarea .toolbar .Indent {background-image:url("images/BlockElements/indent.gif");}
87 .htmlarea .toolbar .Outdent {background-image:url("images/BlockElements/outdent.gif");}
88 .htmlarea .toolbar .Blockquote {background-image:url("images/BlockElements/blockquote.gif");}
89 .htmlarea .toolbar .InsertParagraphBefore, .htmlarea-context-menu .InsertParagraphBefore {background-image:url("images/BlockElements/insertParagraphBefore.gif");}
90 .htmlarea .toolbar .InsertParagraphAfter, .htmlarea-context-menu .InsertParagraphAfter {background-image:url("images/BlockElements/insertParagraphAfter.gif");}
91 .htmlarea .toolbar .JustifyLeft, .htmlarea-context-menu .JustifyLeft {background-image:url("images/BlockElements/justifyLeft.gif");}
92 .htmlarea .toolbar .JustifyCenter, .htmlarea-context-menu .JustifyCenter {background-image:url("images/BlockElements/justifyCenter.gif");}
93 .htmlarea .toolbar .JustifyRight, .htmlarea-context-menu .JustifyRight {background-image:url("images/BlockElements/justifyRight.gif");}
94 .htmlarea .toolbar .JustifyFull, .htmlarea-context-menu .JustifyFull {background-image:url("images/BlockElements/justifyFull.gif");}
95 .htmlarea .toolbar .DefinitionList, .htmlarea-context-menu .DefinitionList {background-image:url("images/definitionList.gif");}
96 .htmlarea .toolbar .DefinitionItem, .htmlarea-context-menu .DefinitionItem {background-image:url("images/definitionItem.gif");}
97 .htmlarea .toolbar .InsertOrderedList {background-image:url("images/ed_list_num.gif");}
98 .htmlarea .toolbar .InsertUnorderedList {background-image:url("images/ed_list_bullet.gif");}
99 .htmlarea .toolbar .ForeColor {background-image:url("images/ed_color_fg.gif");}
100 .htmlarea .toolbar .HiliteColor {background-image:url("images/ed_color_bg.gif");}
101 .htmlarea .toolbar .CO-forecolor {background-image:url("images/SelectColor/CO-forecolor.gif");}
102 .htmlarea .toolbar .CO-hilitecolor {background-image:url("images/SelectColor/CO-hilitecolor.gif");}
103 .htmlarea .toolbar .InsertSmiley {background-image:url("images/InsertSmiley/ed_smiley.gif");}
104 .htmlarea .toolbar .InsertCharacter {background-image:url("images/CharacterMap/ed_charmap.gif");}
105 .htmlarea .toolbar .InsertHorizontalRule {background-image:url("images/ed_hr.gif");}
106 .htmlarea .toolbar .CreateLink, .htmlarea-context-menu .CreateLink {background-image:url("images/ed_link.gif");}
107 .htmlarea .toolbar .UnLink, .htmlarea-context-menu .UnLink {background-image:url("images/ed_unlink.gif");}
108 .htmlarea .toolbar .InsertImage, .htmlarea-context-menu .InsertImage {background-image:url("images/ed_image.gif");}
109 .htmlarea .toolbar .InsertTable {background-image:url("images/insert_table.gif");}
110 .htmlarea .toolbar .UserElements {background-image:url("images/UserElements/ed_user.gif");}
111 .htmlarea .toolbar .FindReplace {background-image:url("images/FindReplace/ed_find.gif");}
112 .htmlarea .toolbar .SpellCheck { background-image:url("images/SpellChecker/spell-check.gif"); }
113 .htmlarea .toolbar .InsertTag { background-image:url("images/QuickTag/ed_quicktag.gif"); }
114 .htmlarea .toolbar .Acronym { background-image:url("images/Acronym/ed_acronym.gif"); }
115 .htmlarea .toolbar .RemoveFormat { background-image:url("images/RemoveFormat/ed_clean.gif"); }
116 .htmlarea .toolbar .SplitBlock {background-image:url("images/ed_splitblock.gif"); }
117 .htmlarea .toolbar .HtmlMode { background-image:url("images/ed_html.gif"); }
118 .htmlarea .toolbar .Copy, .htmlarea-context-menu .Copy { background-image:url("images/ed_copy.gif");}
119 .htmlarea .toolbar .Cut, .htmlarea-context-menu .Cut { background-image:url("images/ed_cut.gif");}
120 .htmlarea .toolbar .Paste, .htmlarea-context-menu .Paste { background-image:url("images/ed_paste.gif");}
121 .htmlarea .toolbar .Undo { background-image:url("images/ed_undo.gif");}
122 .htmlarea .toolbar .Redo { background-image:url("images/ed_redo.gif");}
123 .htmlarea .toolbar .About { background-image:url("images/ed_about.gif");}
124 .htmlarea .toolbar .ShowHelp { background-image:url("images/TYPO3ViewHelp/module_help.gif");}
125 .htmlarea .toolbar .TO-toggle-borders, .htmlarea-context-menu .TO-toggle-borders {background-image:url("images/TableOperations/toggle-borders.gif");}
126 .htmlarea .toolbar .TO-table-prop, .htmlarea-context-menu .TO-table-prop {background-image:url("images/TableOperations/table-prop.gif");}
127 .htmlarea .toolbar .TO-table-restyle, .htmlarea-context-menu .TO-table-restyle {background-image:url("images/TableOperations/table-restyle.gif");}
128 .htmlarea .toolbar .TO-row-prop, .htmlarea-context-menu .TO-row-prop {background-image:url("images/TableOperations/row-prop.gif");}
129 .htmlarea .toolbar .TO-row-insert-above, .htmlarea-context-menu .TO-row-insert-above {background-image:url("images/TableOperations/row-insert-above.gif");}
130 .htmlarea .toolbar .TO-row-insert-under, .htmlarea-context-menu .TO-row-insert-under {background-image:url("images/TableOperations/row-insert-under.gif");}
131 .htmlarea .toolbar .TO-row-delete, .htmlarea-context-menu .TO-row-delete {background-image:url("images/TableOperations/row-delete.gif");}
132 .htmlarea .toolbar .TO-row-split, .htmlarea-context-menu .TO-row-split {background-image:url("images/TableOperations/row-split.gif");}
133 .htmlarea .toolbar .TO-col-prop, .htmlarea-context-menu .TO-col-prop {background-image:url("images/TableOperations/col-prop.gif");}
134 .htmlarea .toolbar .TO-col-insert-before, .htmlarea-context-menu .TO-col-insert-before {background-image:url("images/TableOperations/col-insert-before.gif");}
135 .htmlarea .toolbar .TO-col-insert-after, .htmlarea-context-menu .TO-col-insert-after {background-image:url("images/TableOperations/col-insert-after.gif");}
136 .htmlarea .toolbar .TO-col-delete, .htmlarea-context-menu .TO-col-delete {background-image:url("images/TableOperations/col-delete.gif");}
137 .htmlarea .toolbar .TO-col-split, .htmlarea-context-menu .TO-col-split {background-image:url("images/TableOperations/col-split.gif");}
138 .htmlarea .toolbar .TO-cell-prop, .htmlarea-context-menu .TO-cell-prop {background-image:url("images/TableOperations/cell-prop.gif");}
139 .htmlarea .toolbar .TO-cell-insert-before, .htmlarea-context-menu .TO-cell-insert-before {background-image:url("images/TableOperations/cell-insert-before.gif");}
140 .htmlarea .toolbar .TO-cell-insert-after, .htmlarea-context-menu .TO-cell-insert-after {background-image:url("images/TableOperations/cell-insert-after.gif");}
141 .htmlarea .toolbar .TO-cell-delete, .htmlarea-context-menu .TO-cell-delete {background-image:url("images/TableOperations/cell-delete.gif");}
142 .htmlarea .toolbar .TO-cell-split, .htmlarea-context-menu .TO-cell-split {background-image:url("images/TableOperations/cell-split.gif");}
143 .htmlarea .toolbar .TO-cell-merge, .htmlarea-context-menu .TO-cell-merge {background-image:url("images/TableOperations/cell-merge.gif");}
144 .htmlarea .toolbar button.buttonHover {
145 border:1px solid;border-color:#e4e0db #999999 #999999 #e4e0db;
146 }
147 .htmlarea .toolbar button.buttonActive {
148 border:1px solid;border-color:ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;padding:2px 0px 0px 2px;
149 }
150 .htmlarea .toolbar button.buttonPressed {
151 background-color:ButtonHighlight;
152 border:1px solid;border-color:#999999 #e4e0db #e4e0db #999999; padding:2px 0px 0px 2px;
153 text-decoration:none;
154 }
155 .htmlarea .toolbar div.indicator {
156 margin:4px 0px 0px 0px;
157 padding:0px 3px;
158 overflow:hidden;
159 width:20px;
160 text-align:center;
161 cursor:default;
162 border:1px solid ButtonShadow;
163 }
164 .htmlarea .toolbar button.buttonDisabled {
165 filter: alpha(opacity=25);
166 -moz-opacity: 0.25;
167 opacity: 0.25;
168 }
169 .htmlarea .toolbar div.separator {
170 position:relative;
171 border-left:1px solid #999;margin:0 3px;padding:0;
172 width:0px;height:20px;
173 }
174 .htmlarea .toolbar li.tb-first-cell .separator {
175 border-style:none;margin:0;padding:0;
176 }
177 .htmlarea .toolbar div.space {
178 float:left;
179 height:22px;
180 margin:0;padding:0px 1px 0px 0px;
181 }
182 .htmlarea .toolbar select {
183 font:10px Tahoma,Verdana,sans-serif;
184 height:18px;
185 border:1px solid #A2AAB8;
186 margin:0;padding:1px;
187 }
188 .htmlarea .toolbar select, .htmlarea .toolbar select:hover, .htmlarea .toolbar select:active {
189 background-color:#fff;color:ButtonText;
190 }
191 .htmlarea .toolbar select.buttonDisabled {
192 background-color:#e4e0db;
193 }
194 .htmlarea .editorIframe {
195 clear:both;
196 width:100%;
197 border:1px solid #000;border-top:0px;margin:0;padding:0;
198 }
199 .htmlarea .noStatusBar {
200 border-bottom:1px solid #000;
201 }
202 .htmlarea .statusBar {
203 clear:both;
204 background-color:#e4e0db;color:ButtonText;
205 font:11px Tahoma,Verdana,sans-serif;
206 width:100%;
207 border:1px solid;border-color:ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;margin:0;padding:0;
208 }
209 .htmlarea .statusBarTree {
210 padding:2px 5px;
211 }
212 .htmlarea .statusBar .statusBarTree a {
213 color:#00f;
214 padding:2px 5px;
215 }
216 .htmlarea .statusBar .statusBarTree a:visited {
217 color:#00f;
218 }
219 .htmlarea .statusBar .statusBarTree a:hover {
220 background-color:Highlight;color:HighlightText;
221 border:1px solid HighlightText;padding:1px 4px;
222 }
223 .htmlarea .statusBarTextMode {
224 padding:2px 5px;
225 }
226 /* Selectors for popup windows */
227 .dialog .buttonColor {
228 cursor:default;
229 border-style:solid;border-width:1px;border-color:ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;padding:1px;
230 }
231 .dialog .buttonColor-hilite {
232 border-color:black black black black;
233 }
234 .dialog .buttonColor .chooser, .dialog .buttonColor .nocolor {
235 height:0.6em;
236 border-width:1px;border-style:solid;border-width:1px;border-color:ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;padding:0px 1em;
237 }
238 .dialog .buttonColor .nocolor {
239 padding:0;
240 }
241 .dialog .buttonColor .nocolor-hilite {
242 background-color:#fff;color:#f00;cursor:pointer;
243 }
244 .popupwin {
245 background-color:#e4e0db;color:ButtonText;
246 font:11px Tahoma,Verdana,sans-serif;
247 }
248 .popupwin body {
249 background-color:#e4e0db;color:ButtonText;
250 font:11px Tahoma,Verdana,sans-serif;
251 border-style:none;margin:5px;padding:0;
252 }
253 .popupwin .title {
254 clear:both;
255 background-color:#ddf;color:#000;
256 font-weight:bold;font-size:120%;letter-spacing:2px;
257 border-top:0px;border-bottom:1px solid black;margin-top:0px;margin-bottom:10px;padding:3px 10px;
258 }
259 .popupwin p {
260 margin: 0.5em 0;
261 }
262 .popupwin h1 {
263 font-weight: bold; font-size: 1.2em;
264 padding: .3em 0; border-bottom: 1px solid #999;
265 }
266 .popupwin a:link, .popupwin a:visited {
267 color: #00f;
268 }
269 .popupwin a:hover {
270 color: #f00;
271 }
272 .popupwin a:active {
273 color: #f80;
274 }
275 .popupwin #tabbar { position: relative; left: 10px; }
276 .popupwin .tab {
277 color: #454; background-color: #66f; cursor: pointer;
278 margin-left: -5px; float: left; position: relative; top: -3px; left: -2px; z-index: 0;
279 border: 1px solid black; border-top: none; padding: 2px 10px 3px 10px;
280 -moz-border-radius: 0px 0px 4px 4px;
281 border-radius: 0px 0px 4px 4px;
282 }
283 .popupwin .tab-current {
284 color: #000; background-color: #ddf;
285 top: -4px; z-index: 10;
286 padding: 3px 10px 4px 10px;
287 }
288 .popupwin .content {
289 border-style:none;margin:0;padding:0;
290 }
291 .popupwin ul {
292 list-style-type:none;
293 border-style:none;margin:0;padding:0;
294 }
295 .popupwin li {
296 margin:4px 0;
297 }
298 .popupwin select {
299 display:inline;
300 }
301 .popupwin table {
302 border-collapse:collapse;border-style:none;margin:0;padding:0;
303 }
304 .popupwin thead {
305 font-weight: bold; background-color: #ddf;
306 }
307 .popupwin td {
308 padding: 0.2em;
309 }
310 .popupwin form {
311 background-color:#e4e0db;
312 border-style:none;margin:0;padding:0;
313 }
314 .popupwin form p {
315 margin-top:5px;margin-bottom:5px;
316 }
317 .popupwin fieldset {
318 display:block;
319 margin:5px 5px 0 5px;padding:0 5px 2px 5px;
320 }
321 .popupwin .floating {
322 float:left;
323 }
324 .popupwin legend {
325 font-weight:bold;padding:0 3px;
326 }
327 .popupwin .field {
328 float:left;text-align:left;
329 margin-left:5px;padding:2px 5px;
330 }
331 .popupwin label {
332 text-align:left;
333 margin-left:5px;padding:2px 5px;
334 }
335 .popupwin fieldset table {
336 font-size:11px;font-family:Tahoma,Verdana,sans-serif;
337 border-style:none;margin:2px 0;padding:0;
338 }
339 .popupwin .buttons {
340 clear:both;text-align:right;
341 border-top:1px solid #999;margin-top:10px;padding:5px;
342 }
343 .popupwin span.colorButton {
344 float:left;
345 padding:2px 0;
346 }
347 .popupwin span.colorButtonNoFloat {
348 padding:2px 0;
349 }
350 .popupwin select, .popupwin input, .popupwin button, .popupwin textarea, .popupwin table, .popupwin label {
351 font:11px Tahoma,Verdana,sans-serif;
352 }
353 .popupwin button {
354 background-color:#e4e0db;
355 width:8em;
356 padding:0;
357 }
358 .popupwin dl, .popupwin dt, .popupwin dd {
359 display: block;
360 }
361 .popupwin dt, .popupwin dd {
362 margin:3px 0;
363 }
364 .popupwin button.long-button {
365 width:10em;
366 }
367 .popupwin .fl {
368 float:left;text-align:right;
369 width:15em;
370 padding:2px 5px;
371 }
372 .popupwin .fl-borderCollapse {
373 float:left;text-align:right;
374 width:13em;
375 margin-left:10px;padding:2px 5px;
376 }
377 .popupwin .fr {
378 float:left;text-align:right;
379 width:9em;
380 padding:2px 5px;
381 }
382 .popupwin .space {
383 clear:left;
384 padding:2px;
385 }
386 .popupwin .label {
387 text-align:right;
388 width:8em;
389 }
390 .popupwin .checkbox {
391 text-align:left;
392 padding:2px 5px;
393 }
394 .popupwin .postlabel {
395 text-align:left;
396 padding:2px 5px;
397 }
398 .popupwin input.value {
399 width:30em;
400 }
401 .popupwin input.shorter-value {
402 width:17em;
403 }
404 .popupwin #HA-layout {
405 width:450px;
406 }
407 .colorTable {
408 border:black 1px solid;
409 }
410 .currentColor {
411 width:20px;height:20px;
412 border:black 1px solid;margin:0pt 15pt;
413 }
414 .colorTable tr {
415 height:6px;
416 }
417 .colorTable td {
418 width:6px;
419 cursor:pointer;
420 }
421 .colorTable td.colorTitle {
422 width:auto;
423 padding-left:10px;
424 }
425 /* Selectors for the InsertImage popup */
426 .popupwin div.imagepreview {
427 text-align:center;
428 }
429 .popupwin .imagepreview iframe {
430 width:300px;height:200px;
431 border:1px solid gray;
432 }
433 /* Selectors for the InsertSmiley plugin */
434 .popupwin div.smileytable {
435 height:125px;overflow:auto;
436 }
437 .popupwin .smileytable td {
438 width:35px;height:25px;
439 }
440 /* Selectors for the FindReplace plugin */
441 .popupwin .long-label {
442 text-align:left;
443 width:30em;
444 }
445 /* Selectors for the SpellChecker plugin */
446 .popupwin #b_recheck {
447 vertical-align:middle;
448 width:12em;
449 }
450 /* Selectors for the ContextMenu plugin */
451 .htmlarea-context-menu {
452 position:absolute;top:-1000px;left:-1000px;z-index:1000;
453 background-color:#cdf;cursor:default;
454 font:11px Tahoma,Verdana,sans-serif;
455 list-style:none;
456 border:1px solid #aca899;margin:0;padding:2px;
457 }
458 .htmlarea-context-menu li {
459 background-color:#cdf;
460 border:1px solid #cdf;margin:1px 0;padding:0;
461 }
462 .htmlarea-context-menu li .button {
463 text-align:left;vertical-align:middle;
464 background-color:transparent;background-repeat:no-repeat;background-position:2px 2px;
465 font-size:11px;
466 height:20px;
467 border-style:none;margin:0;padding:0 0 0 24px;
468 }
469 .htmlarea-context-menu li .button img {
470 width:18px;height:18px;
471 }
472 .htmlarea-context-menu li.separator {
473 border-top:1px solid #fff;
474 }
475 .htmlarea-context-menu li.hover {
476 background-color:#316ac5;
477 }
478 .htmlarea-context-menu li.hover .button {
479 color:#fff;
480 }