diff options
Diffstat (limited to 'sources/skins/moono/dialog.css')
-rw-r--r-- | sources/skins/moono/dialog.css | 1060 |
1 files changed, 0 insertions, 1060 deletions
diff --git a/sources/skins/moono/dialog.css b/sources/skins/moono/dialog.css deleted file mode 100644 index 93907be..0000000 --- a/sources/skins/moono/dialog.css +++ /dev/null | |||
@@ -1,1060 +0,0 @@ | |||
1 | /* | ||
2 | Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved. | ||
3 | For licensing, see LICENSE.md or http://ckeditor.com/license | ||
4 | */ | ||
5 | |||
6 | /* | ||
7 | dialog.css | ||
8 | ============ | ||
9 | |||
10 | This file styles dialogs and all widgets available inside of it (tabs, buttons, | ||
11 | fields, etc.). | ||
12 | |||
13 | Dialogs are a complex system because they're very flexible. The CKEditor API | ||
14 | makes it easy to create and customize dialogs by code, by making use of several | ||
15 | different widgets inside its contents. | ||
16 | |||
17 | All dialogs share a main dialog strucuture, which can be visually represented | ||
18 | as follows: | ||
19 | |||
20 | +-- .cke_dialog -------------------------------------------------+ | ||
21 | | +-- .cke_dialog_body ----------------------------------------+ | | ||
22 | | | +-- .cke_dialog_title --+ +-- .cke_dialog_close_button --+ | | | ||
23 | | | | | | | | | | ||
24 | | | +-----------------------+ +------------------------------+ | | | ||
25 | | | +-- .cke_dialog_tabs ------------------------------------+ | | | ||
26 | | | | | | | | ||
27 | | | +--------------------------------------------------------+ | | | ||
28 | | | +-- .cke_dialog_contents --------------------------------+ | | | ||
29 | | | | +-- .cke_dialog_contents_body -----------------------+ | | | | ||
30 | | | | | | | | | | ||
31 | | | | +----------------------------------------------------+ | | | | ||
32 | | | | +-- .cke_dialog_footer ------------------------------+ | | | | ||
33 | | | | | | | | | | ||
34 | | | | +----------------------------------------------------+ | | | | ||
35 | | | +--------------------------------------------------------+ | | | ||
36 | | +------------------------------------------------------------+ | | ||
37 | +----------------------------------------------------------------+ | ||
38 | |||
39 | Comments in this file will give more details about each of the above blocks. | ||
40 | */ | ||
41 | |||
42 | /* The outer container of the dialog. */ | ||
43 | .cke_dialog | ||
44 | { | ||
45 | /* Mandatory: Because the dialog.css file is loaded on demand, we avoid | ||
46 | showing an unstyled dialog by hidding it. Here, we restore its visibility. */ | ||
47 | visibility: visible; | ||
48 | } | ||
49 | |||
50 | /* The inner boundary container. */ | ||
51 | .cke_dialog_body | ||
52 | { | ||
53 | z-index: 1; | ||
54 | background: #eaeaea; | ||
55 | border: 1px solid #b2b2b2; | ||
56 | border-bottom-color: #999; | ||
57 | border-radius: 3px; | ||
58 | box-shadow: 0 0 3px rgba(0, 0, 0, .15); | ||
59 | } | ||
60 | |||
61 | /* Due to our reset we have to recover the styles of some elements. */ | ||
62 | .cke_dialog strong | ||
63 | { | ||
64 | font-weight: bold; | ||
65 | } | ||
66 | |||
67 | /* The dialog title. */ | ||
68 | .cke_dialog_title | ||
69 | { | ||
70 | font-weight: bold; | ||
71 | font-size: 13px; | ||
72 | cursor: move; | ||
73 | position: relative; | ||
74 | |||
75 | color: #474747; | ||
76 | text-shadow: 0 1px 0 rgba(255,255,255,.75); | ||
77 | |||
78 | border-bottom: 1px solid #999; | ||
79 | padding: 6px 10px; | ||
80 | |||
81 | border-radius: 2px 2px 0 0; | ||
82 | box-shadow: 0 1px 0 #fff inset; | ||
83 | |||
84 | background: #cfd1cf; | ||
85 | background-image: linear-gradient(to bottom, #f5f5f5, #cfd1cf); | ||
86 | filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f5f5f5', endColorstr='#cfd1cf'); | ||
87 | } | ||
88 | |||
89 | .cke_dialog_spinner | ||
90 | { | ||
91 | border-radius: 50%; | ||
92 | |||
93 | width: 12px; | ||
94 | height: 12px; | ||
95 | overflow: hidden; | ||
96 | |||
97 | text-indent: -9999em; | ||
98 | |||
99 | border-top: 2px solid rgba(102, 102, 102, 0.2); | ||
100 | border-right: 2px solid rgba(102, 102, 102, 0.2); | ||
101 | border-bottom: 2px solid rgba(102, 102, 102, 0.2); | ||
102 | border-left: 2px solid rgba(102, 102, 102, 1); | ||
103 | |||
104 | -webkit-animation: dialog_spinner 1s infinite linear; | ||
105 | animation: dialog_spinner 1s infinite linear; | ||
106 | } | ||
107 | |||
108 | /* A GIF fallback for IE8 and IE9 which does not support CSS animations. */ | ||
109 | .cke_browser_ie8 .cke_dialog_spinner, | ||
110 | .cke_browser_ie9 .cke_dialog_spinner | ||
111 | { | ||
112 | background: url(images/spinner.gif) center top no-repeat; | ||
113 | width: 16px; | ||
114 | height: 16px; | ||
115 | border: 0; | ||
116 | } | ||
117 | |||
118 | @-webkit-keyframes dialog_spinner | ||
119 | { | ||
120 | 0% { | ||
121 | -webkit-transform: rotate(0deg); | ||
122 | transform: rotate(0deg); | ||
123 | } | ||
124 | 100% { | ||
125 | -webkit-transform: rotate(360deg); | ||
126 | transform: rotate(360deg); | ||
127 | } | ||
128 | } | ||
129 | |||
130 | @keyframes dialog_spinner | ||
131 | { | ||
132 | 0% { | ||
133 | -webkit-transform: rotate(0deg); | ||
134 | transform: rotate(0deg); | ||
135 | } | ||
136 | 100% { | ||
137 | -webkit-transform: rotate(360deg); | ||
138 | transform: rotate(360deg); | ||
139 | } | ||
140 | } | ||
141 | |||
142 | /* The outer part of the dialog contants, which contains the contents body | ||
143 | and the footer. */ | ||
144 | .cke_dialog_contents | ||
145 | { | ||
146 | background-color: #fff; | ||
147 | overflow: auto; | ||
148 | padding: 15px 10px 5px 10px; | ||
149 | margin-top: 30px; | ||
150 | border-top: 1px solid #bfbfbf; | ||
151 | border-radius: 0 0 3px 3px; | ||
152 | } | ||
153 | |||
154 | /* The contents body part, which will hold all elements available in the dialog. */ | ||
155 | .cke_dialog_contents_body | ||
156 | { | ||
157 | overflow: auto; | ||
158 | padding: 17px 10px 5px 10px; | ||
159 | margin-top: 22px; | ||
160 | } | ||
161 | |||
162 | /* The dialog footer, which usually contains the "Ok" and "Cancel" buttons as | ||
163 | well as a resize handler. */ | ||
164 | .cke_dialog_footer | ||
165 | { | ||
166 | text-align: right; | ||
167 | position: relative; | ||
168 | border: none; | ||
169 | outline: 1px solid #bfbfbf; | ||
170 | box-shadow: 0 1px 0 #fff inset; | ||
171 | border-radius: 0 0 2px 2px; | ||
172 | background: #cfd1cf; | ||
173 | background-image: linear-gradient(to bottom, #ebebeb, #cfd1cf); | ||
174 | filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ebebeb', endColorstr='#cfd1cf'); | ||
175 | } | ||
176 | |||
177 | .cke_rtl .cke_dialog_footer | ||
178 | { | ||
179 | text-align: left; | ||
180 | } | ||
181 | |||
182 | .cke_hc .cke_dialog_footer | ||
183 | { | ||
184 | outline: none; | ||
185 | border-top: 1px solid #fff; | ||
186 | } | ||
187 | |||
188 | .cke_dialog .cke_resizer | ||
189 | { | ||
190 | margin-top: 22px; | ||
191 | } | ||
192 | |||
193 | .cke_dialog .cke_resizer_rtl | ||
194 | { | ||
195 | margin-left: 5px; | ||
196 | } | ||
197 | |||
198 | .cke_dialog .cke_resizer_ltr | ||
199 | { | ||
200 | margin-right: 5px; | ||
201 | } | ||
202 | |||
203 | /* | ||
204 | Dialog tabs | ||
205 | ------------- | ||
206 | |||
207 | Tabs are presented on some of the dialogs to make it possible to have its | ||
208 | contents split on different groups, visible one after the other. | ||
209 | |||
210 | The main element that holds the tabs can be made hidden, in case of no tabs | ||
211 | available. | ||
212 | |||
213 | The following is the visual representation of the tabs block: | ||
214 | |||
215 | +-- .cke_dialog_tabs ------------------------------------+ | ||
216 | | +-- .cke_dialog_tab --+ +-- .cke_dialog_tab --+ ... | | ||
217 | | | | | | | | ||
218 | | +---------------------+ +---------------------+ | | ||
219 | +--------------------------------------------------------+ | ||
220 | |||
221 | The .cke_dialog_tab_selected class is appended to the active tab. | ||
222 | */ | ||
223 | |||
224 | /* The main tabs container. */ | ||
225 | .cke_dialog_tabs | ||
226 | { | ||
227 | height: 24px; | ||
228 | display: inline-block; | ||
229 | margin: 5px 0 0; | ||
230 | position: absolute; | ||
231 | z-index: 2; | ||
232 | left: 10px; | ||
233 | } | ||
234 | |||
235 | .cke_rtl .cke_dialog_tabs | ||
236 | { | ||
237 | right: 10px; | ||
238 | } | ||
239 | |||
240 | /* A single tab (an <a> element). */ | ||
241 | a.cke_dialog_tab | ||
242 | { | ||
243 | |||
244 | height: 16px; | ||
245 | padding: 4px 8px; | ||
246 | margin-right: 3px; | ||
247 | display: inline-block; | ||
248 | cursor: pointer; | ||
249 | line-height: 16px; | ||
250 | outline: none; | ||
251 | color: #595959; | ||
252 | border: 1px solid #bfbfbf; | ||
253 | |||
254 | border-radius: 3px 3px 0 0; | ||
255 | |||
256 | background: #d4d4d4; | ||
257 | background-image: linear-gradient(to bottom, #fafafa, #ededed); | ||
258 | filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#fafafa', endColorstr='#ededed'); | ||
259 | } | ||
260 | |||
261 | .cke_rtl a.cke_dialog_tab | ||
262 | { | ||
263 | margin-right: 0; | ||
264 | margin-left: 3px; | ||
265 | } | ||
266 | |||
267 | /* A hover state of a regular inactive tab. */ | ||
268 | a.cke_dialog_tab:hover, | ||
269 | a.cke_dialog_tab:focus | ||
270 | { | ||
271 | background: #ebebeb; | ||
272 | background: linear-gradient(to bottom, #ebebeb 0%,#dfdfdf 100%); | ||
273 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebebeb', endColorstr='#dfdfdf',GradientType=0 ); | ||
274 | } | ||
275 | |||
276 | a.cke_dialog_tab_selected | ||
277 | { | ||
278 | background: #fff; | ||
279 | color: #383838; | ||
280 | border-bottom-color: #fff; | ||
281 | cursor: default; | ||
282 | filter: none; | ||
283 | } | ||
284 | |||
285 | /* A hover state for selected tab. */ | ||
286 | a.cke_dialog_tab_selected:hover, | ||
287 | a.cke_dialog_tab_selected:focus | ||
288 | { | ||
289 | background: #ededed; | ||
290 | background: linear-gradient(to bottom, #ededed 0%,#ffffff 100%); | ||
291 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff',GradientType=0 ); | ||
292 | } | ||
293 | |||
294 | .cke_hc a.cke_dialog_tab:hover, | ||
295 | .cke_hc a.cke_dialog_tab:focus, | ||
296 | .cke_hc a.cke_dialog_tab_selected | ||
297 | { | ||
298 | border: 3px solid; | ||
299 | padding: 2px 6px; | ||
300 | } | ||
301 | |||
302 | a.cke_dialog_tab_disabled | ||
303 | { | ||
304 | color: #bababa; | ||
305 | cursor: default; | ||
306 | } | ||
307 | |||
308 | /* The .cke_single_page class is appended to the dialog outer element in case | ||
309 | of dialogs that has no tabs. */ | ||
310 | .cke_single_page .cke_dialog_tabs | ||
311 | { | ||
312 | display: none; | ||
313 | } | ||
314 | |||
315 | .cke_single_page .cke_dialog_contents | ||
316 | { | ||
317 | padding-top: 5px; | ||
318 | margin-top: 0; | ||
319 | border-top: none; | ||
320 | } | ||
321 | |||
322 | /* The close button at the top of the dialog. */ | ||
323 | |||
324 | a.cke_dialog_close_button | ||
325 | { | ||
326 | background-image: url(images/close.png); | ||
327 | background-repeat: no-repeat; | ||
328 | background-position: 50%; | ||
329 | position: absolute; | ||
330 | cursor: pointer; | ||
331 | text-align: center; | ||
332 | height: 20px; | ||
333 | width: 20px; | ||
334 | top: 4px; | ||
335 | z-index: 5; | ||
336 | opacity: 0.8; | ||
337 | filter: alpha(opacity = 80); | ||
338 | } | ||
339 | |||
340 | .cke_dialog_close_button:hover | ||
341 | { | ||
342 | opacity: 1; | ||
343 | filter: alpha(opacity = 100); | ||
344 | } | ||
345 | |||
346 | .cke_hidpi .cke_dialog_close_button | ||
347 | { | ||
348 | background-image: url(images/hidpi/close.png); | ||
349 | background-size: 16px; | ||
350 | } | ||
351 | |||
352 | .cke_dialog_close_button span | ||
353 | { | ||
354 | display: none; | ||
355 | } | ||
356 | |||
357 | .cke_hc .cke_dialog_close_button span | ||
358 | { | ||
359 | display: inline; | ||
360 | cursor: pointer; | ||
361 | font-weight: bold; | ||
362 | position: relative; | ||
363 | top: 3px; | ||
364 | } | ||
365 | |||
366 | .cke_ltr .cke_dialog_close_button | ||
367 | { | ||
368 | right: 5px; | ||
369 | } | ||
370 | |||
371 | .cke_rtl .cke_dialog_close_button | ||
372 | { | ||
373 | left: 6px; | ||
374 | } | ||
375 | |||
376 | .cke_dialog_close_button | ||
377 | { | ||
378 | top: 4px; | ||
379 | } | ||
380 | |||
381 | /* | ||
382 | Dialog UI Elements | ||
383 | -------------------- | ||
384 | |||
385 | The remaining styles define the UI elements that can be used inside dialog | ||
386 | contents. | ||
387 | |||
388 | Most of the UI elements on dialogs contain a textual label. All of them share | ||
389 | the same labelling structure, having the label text inside an element with | ||
390 | .cke_dialog_ui_labeled_label and the element specific part inside the | ||
391 | .cke_dialog_ui_labeled_content class. | ||
392 | */ | ||
393 | |||
394 | /* If an element is supposed to be disabled, the .cke_disabled class is | ||
395 | appended to it. */ | ||
396 | div.cke_disabled .cke_dialog_ui_labeled_content div * | ||
397 | { | ||
398 | background-color: #ddd; | ||
399 | cursor: default; | ||
400 | } | ||
401 | |||
402 | /* | ||
403 | Horizontal-Box and Vertical-Box | ||
404 | --------------------------------- | ||
405 | |||
406 | There are basic layou element used by the editor to properly align elements in | ||
407 | the dialog. They're basically tables that have each cell filled by UI elements. | ||
408 | |||
409 | The following is the visual representation of a H-Box: | ||
410 | |||
411 | +-- .cke_dialog_ui_hbox --------------------------------------------------------------------------------+ | ||
412 | | +-- .cke_dialog_ui_hbox_first --+ +-- .cke_dialog_ui_hbox_child --+ +-- .cke_dialog_ui_hbox_last --+ | | ||
413 | | + + + + + + | | ||
414 | | +-------------------------------+ +-------------------------------+ +------------------------------+ | | ||
415 | +-------------------------------------------------------------------------------------------------------+ | ||
416 | |||
417 | It is possible to have nested V/H-Boxes. | ||
418 | */ | ||
419 | |||
420 | .cke_dialog_ui_vbox table, | ||
421 | .cke_dialog_ui_hbox table | ||
422 | { | ||
423 | margin: auto; | ||
424 | } | ||
425 | |||
426 | .cke_dialog_ui_vbox_child | ||
427 | { | ||
428 | padding: 5px 0px; | ||
429 | } | ||
430 | |||
431 | .cke_dialog_ui_hbox | ||
432 | { | ||
433 | width: 100%; | ||
434 | } | ||
435 | |||
436 | .cke_dialog_ui_hbox_first, | ||
437 | .cke_dialog_ui_hbox_child, | ||
438 | .cke_dialog_ui_hbox_last | ||
439 | { | ||
440 | vertical-align: top; | ||
441 | } | ||
442 | |||
443 | .cke_ltr .cke_dialog_ui_hbox_first, | ||
444 | .cke_ltr .cke_dialog_ui_hbox_child | ||
445 | { | ||
446 | padding-right: 10px; | ||
447 | } | ||
448 | |||
449 | .cke_rtl .cke_dialog_ui_hbox_first, | ||
450 | .cke_rtl .cke_dialog_ui_hbox_child | ||
451 | { | ||
452 | padding-left: 10px; | ||
453 | } | ||
454 | |||
455 | .cke_ltr .cke_dialog_footer_buttons .cke_dialog_ui_hbox_first, | ||
456 | .cke_ltr .cke_dialog_footer_buttons .cke_dialog_ui_hbox_child | ||
457 | { | ||
458 | padding-right: 5px; | ||
459 | } | ||
460 | |||
461 | .cke_rtl .cke_dialog_footer_buttons .cke_dialog_ui_hbox_first, | ||
462 | .cke_rtl .cke_dialog_footer_buttons .cke_dialog_ui_hbox_child | ||
463 | { | ||
464 | padding-left: 5px; | ||
465 | padding-right: 0; | ||
466 | } | ||
467 | |||
468 | /* Applies to all labeled dialog fields */ | ||
469 | .cke_hc div.cke_dialog_ui_input_text, | ||
470 | .cke_hc div.cke_dialog_ui_input_password, | ||
471 | .cke_hc div.cke_dialog_ui_input_textarea, | ||
472 | .cke_hc div.cke_dialog_ui_input_select, | ||
473 | .cke_hc div.cke_dialog_ui_input_file | ||
474 | { | ||
475 | border: 1px solid; | ||
476 | } | ||
477 | |||
478 | /* | ||
479 | Text Input | ||
480 | ------------ | ||
481 | |||
482 | The basic text field to input text. | ||
483 | |||
484 | +-- .cke_dialog_ui_text --------------------------+ | ||
485 | | +-- .cke_dialog_ui_labeled_label ------------+ | | ||
486 | | | | | | ||
487 | | +--------------------------------------------+ | | ||
488 | | +-- .cke_dialog_ui_labeled_content ----------+ | | ||
489 | | | +-- div.cke_dialog_ui_input_text --------+ | | | ||
490 | | | | +-- input.cke_dialog_ui_input_text --+ | | | | ||
491 | | | | | | | | | | ||
492 | | | | +------------------------------------+ | | | | ||
493 | | | +----------------------------------------+ | | | ||
494 | | +--------------------------------------------+ | | ||
495 | +-------------------------------------------------+ | ||
496 | */ | ||
497 | |||
498 | /* | ||
499 | Textarea | ||
500 | ---------- | ||
501 | |||
502 | The textarea field to input larger text. | ||
503 | |||
504 | +-- .cke_dialog_ui_textarea --------------------------+ | ||
505 | | +-- .cke_dialog_ui_labeled_label ----------------+ | | ||
506 | | | | | | ||
507 | | +------------------------------------------------+ | | ||
508 | | +-- .cke_dialog_ui_labeled_content --------------+ | | ||
509 | | | +-- div.cke_dialog_ui_input_textarea --------+ | | | ||
510 | | | | +-- input.cke_dialog_ui_input_textarea --+ | | | | ||
511 | | | | | | | | | | ||
512 | | | | +----------------------------------------+ | | | | ||
513 | | | +--------------------------------------------+ | | | ||
514 | | +------------------------------------------------+ | | ||
515 | +-----------------------------------------------------+ | ||
516 | */ | ||
517 | |||
518 | textarea.cke_dialog_ui_input_textarea | ||
519 | { | ||
520 | overflow: auto; | ||
521 | resize: none; | ||
522 | } | ||
523 | |||
524 | input.cke_dialog_ui_input_text, | ||
525 | input.cke_dialog_ui_input_password, | ||
526 | textarea.cke_dialog_ui_input_textarea | ||
527 | { | ||
528 | background-color: #fff; | ||
529 | border: 1px solid #c9cccf; | ||
530 | border-top-color: #aeb3b9; | ||
531 | padding: 4px 6px; | ||
532 | outline: none; | ||
533 | width: 100%; | ||
534 | *width: 95%; | ||
535 | |||
536 | box-sizing: border-box; | ||
537 | |||
538 | border-radius: 3px; | ||
539 | |||
540 | box-shadow: 0 1px 2px rgba(0,0,0,.15) inset; | ||
541 | } | ||
542 | |||
543 | input.cke_dialog_ui_input_text:hover, | ||
544 | input.cke_dialog_ui_input_password:hover, | ||
545 | textarea.cke_dialog_ui_input_textarea:hover | ||
546 | { | ||
547 | border: 1px solid #aeb3b9; | ||
548 | border-top-color: #a0a6ad; | ||
549 | } | ||
550 | |||
551 | input.cke_dialog_ui_input_text:focus, | ||
552 | input.cke_dialog_ui_input_password:focus, | ||
553 | textarea.cke_dialog_ui_input_textarea:focus, | ||
554 | select.cke_dialog_ui_input_select:focus | ||
555 | { | ||
556 | outline: none; | ||
557 | border: 1px solid #139ff7; | ||
558 | border-top-color: #1392e9; | ||
559 | } | ||
560 | |||
561 | /* | ||
562 | Button | ||
563 | -------- | ||
564 | |||
565 | The buttons used in the dialog footer or inside the contents. | ||
566 | |||
567 | +-- a.cke_dialog_ui_button -----------+ | ||
568 | | +-- span.cke_dialog_ui_button --+ | | ||
569 | | | | | | ||
570 | | +-------------------------------+ | | ||
571 | +-------------------------------------+ | ||
572 | */ | ||
573 | |||
574 | /* The outer part of the button. */ | ||
575 | a.cke_dialog_ui_button | ||
576 | { | ||
577 | display: inline-block; | ||
578 | *display: inline; | ||
579 | *zoom: 1; | ||
580 | |||
581 | padding: 4px 0; | ||
582 | margin: 0; | ||
583 | |||
584 | text-align: center; | ||
585 | color: #333; | ||
586 | vertical-align: middle; | ||
587 | cursor: pointer; | ||
588 | |||
589 | border: 1px solid #b6b6b6; | ||
590 | border-bottom-color: #999; | ||
591 | border-radius: 3px; | ||
592 | box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset; | ||
593 | |||
594 | background: #e4e4e4; | ||
595 | background-image: linear-gradient(to bottom, #ffffff, #e4e4e4); | ||
596 | filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ffffff', endColorstr='#e4e4e4'); | ||
597 | |||
598 | } | ||
599 | |||
600 | span.cke_dialog_ui_button | ||
601 | { | ||
602 | padding: 0 10px; | ||
603 | } | ||
604 | |||
605 | a.cke_dialog_ui_button:hover | ||
606 | { | ||
607 | border-color: #9e9e9e; | ||
608 | |||
609 | background: #ccc; | ||
610 | background-image: linear-gradient(to bottom, #f2f2f2, #ccc); | ||
611 | filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f2f2f2', endColorstr='#cccccc'); | ||
612 | } | ||
613 | |||
614 | /* :focus/:active styles for dialog buttons: regular and footer. */ | ||
615 | a.cke_dialog_ui_button:focus, | ||
616 | a.cke_dialog_ui_button:active | ||
617 | { | ||
618 | border-color: #969696; | ||
619 | outline: none; | ||
620 | box-shadow: 0 0 6px rgba(0,0,0,.4) inset; | ||
621 | } | ||
622 | |||
623 | .cke_hc a.cke_dialog_ui_button:hover, | ||
624 | .cke_hc a.cke_dialog_ui_button:focus, | ||
625 | .cke_hc a.cke_dialog_ui_button:active | ||
626 | { | ||
627 | border: 3px solid; | ||
628 | padding-top: 1px; | ||
629 | padding-bottom: 1px; | ||
630 | } | ||
631 | |||
632 | .cke_hc a.cke_dialog_ui_button:hover span, | ||
633 | .cke_hc a.cke_dialog_ui_button:focus span, | ||
634 | .cke_hc a.cke_dialog_ui_button:active span | ||
635 | { | ||
636 | padding-left: 10px; | ||
637 | padding-right: 10px; | ||
638 | } | ||
639 | |||
640 | /* | ||
641 | a.cke_dialog_ui_button[style*="width"] | ||
642 | { | ||
643 | display: block !important; | ||
644 | width: auto !important; | ||
645 | } | ||
646 | */ | ||
647 | /* The inner part of the button (both in dialog tabs and dialog footer). */ | ||
648 | .cke_dialog_footer_buttons a.cke_dialog_ui_button span | ||
649 | { | ||
650 | color: inherit; | ||
651 | font-size: 12px; | ||
652 | font-weight: bold; | ||
653 | line-height: 18px; | ||
654 | padding: 0 12px; | ||
655 | } | ||
656 | |||
657 | /* Special class appended to the Ok button. */ | ||
658 | a.cke_dialog_ui_button_ok | ||
659 | { | ||
660 | color: #fff; | ||
661 | text-shadow: 0 -1px 0 #55830c; | ||
662 | border-color: #62a60a #62a60a #4d9200; | ||
663 | |||
664 | background: #69b10b; | ||
665 | background-image: linear-gradient(to bottom, #9ad717, #69b10b); | ||
666 | filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#9ad717', endColorstr='#69b10b'); | ||
667 | } | ||
668 | |||
669 | a.cke_dialog_ui_button_ok:hover | ||
670 | { | ||
671 | border-color: #5b9909 #5b9909 #478500; | ||
672 | |||
673 | background: #88be14; | ||
674 | background: linear-gradient(to bottom, #88be14 0%,#5d9c0a 100%); | ||
675 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#88be14', endColorstr='#5d9c0a',GradientType=0 ); | ||
676 | } | ||
677 | |||
678 | a.cke_dialog_ui_button_ok.cke_disabled { | ||
679 | border-color: #7D9F51; | ||
680 | |||
681 | background: #8DAD62; | ||
682 | background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B3D271), to(#8DAD62)); | ||
683 | background-image: -webkit-linear-gradient(top, #B3D271, #8DAD62); | ||
684 | background-image: -o-linear-gradient(top, #B3D271, #8DAD62); | ||
685 | background-image: linear-gradient(to bottom, #B3D271, #8DAD62); | ||
686 | background-image: -moz-linear-gradient(top, #B3D271, #8DAD62); | ||
687 | filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#B3D271', endColorstr='#8DAD62'); | ||
688 | } | ||
689 | |||
690 | a.cke_dialog_ui_button_ok.cke_disabled span { | ||
691 | color: #E0E8D1; | ||
692 | } | ||
693 | |||
694 | /* Default text shadow used for inner parts of all dialog buttons (both in dialog tabs and dialog footer). */ | ||
695 | a.cke_dialog_ui_button span | ||
696 | { | ||
697 | text-shadow: 0 1px 0 #fff; | ||
698 | } | ||
699 | |||
700 | /* Text shadow used for inner part of OK dialog button in footer. */ | ||
701 | a.cke_dialog_ui_button_ok span | ||
702 | { | ||
703 | text-shadow: 0 -1px 0 #55830c; | ||
704 | } | ||
705 | |||
706 | span.cke_dialog_ui_button | ||
707 | { | ||
708 | cursor: pointer; | ||
709 | } | ||
710 | |||
711 | /* :focus/:active styles for dialog footer buttons (ok & cancel) */ | ||
712 | a.cke_dialog_ui_button_ok:focus, | ||
713 | a.cke_dialog_ui_button_ok:active, | ||
714 | a.cke_dialog_ui_button_cancel:focus, | ||
715 | a.cke_dialog_ui_button_cancel:active | ||
716 | { | ||
717 | border-width: 2px; | ||
718 | padding: 3px 0; | ||
719 | } | ||
720 | |||
721 | a.cke_dialog_ui_button_ok:focus, | ||
722 | a.cke_dialog_ui_button_ok:active | ||
723 | { | ||
724 | border-color: #568C0A; | ||
725 | } | ||
726 | |||
727 | a.cke_dialog_ui_button_ok.cke_disabled:focus, | ||
728 | a.cke_dialog_ui_button_ok.cke_disabled:active | ||
729 | { | ||
730 | border-color: #6F8C49; | ||
731 | } | ||
732 | |||
733 | /* :focus/:active styles for dialog footer buttons (ok & cancel) spans */ | ||
734 | a.cke_dialog_ui_button_ok:focus span, | ||
735 | a.cke_dialog_ui_button_ok:active span, | ||
736 | a.cke_dialog_ui_button_cancel:focus span, | ||
737 | a.cke_dialog_ui_button_cancel:active span | ||
738 | { | ||
739 | padding: 0 11px; /* Thick button border must be compensated. */ | ||
740 | } | ||
741 | |||
742 | /* A special container that holds the footer buttons. */ | ||
743 | .cke_dialog_footer_buttons | ||
744 | { | ||
745 | display: inline-table; | ||
746 | margin: 5px; | ||
747 | width: auto; | ||
748 | position: relative; | ||
749 | vertical-align: middle; | ||
750 | } | ||
751 | |||
752 | /* | ||
753 | Styles for other dialog element types. | ||
754 | */ | ||
755 | |||
756 | div.cke_dialog_ui_input_select | ||
757 | { | ||
758 | display: table; | ||
759 | } | ||
760 | |||
761 | select.cke_dialog_ui_input_select | ||
762 | { | ||
763 | height: 25px; | ||
764 | line-height: 25px; | ||
765 | |||
766 | background-color: #fff; | ||
767 | border: 1px solid #c9cccf; | ||
768 | border-top-color: #aeb3b9; | ||
769 | padding: 3px 3px 3px 6px; | ||
770 | outline: none; | ||
771 | border-radius: 3px; | ||
772 | box-shadow: 0 1px 2px rgba(0,0,0,.15) inset; | ||
773 | } | ||
774 | |||
775 | .cke_dialog_ui_input_file | ||
776 | { | ||
777 | width: 100%; | ||
778 | height: 25px; | ||
779 | } | ||
780 | |||
781 | .cke_hc .cke_dialog_ui_labeled_content input:focus, | ||
782 | .cke_hc .cke_dialog_ui_labeled_content select:focus, | ||
783 | .cke_hc .cke_dialog_ui_labeled_content textarea:focus | ||
784 | { | ||
785 | outline: 1px dotted; | ||
786 | } | ||
787 | |||
788 | /* | ||
789 | * Some utility CSS classes for dialog authors. | ||
790 | */ | ||
791 | .cke_dialog .cke_dark_background | ||
792 | { | ||
793 | background-color: #DEDEDE; | ||
794 | } | ||
795 | |||
796 | .cke_dialog .cke_light_background | ||
797 | { | ||
798 | background-color: #EBEBEB; | ||
799 | } | ||
800 | |||
801 | .cke_dialog .cke_centered | ||
802 | { | ||
803 | text-align: center; | ||
804 | } | ||
805 | |||
806 | .cke_dialog a.cke_btn_reset | ||
807 | { | ||
808 | float: right; | ||
809 | background: url(images/refresh.png) top left no-repeat; | ||
810 | width: 16px; | ||
811 | height: 16px; | ||
812 | border: 1px none; | ||
813 | font-size: 1px; | ||
814 | } | ||
815 | |||
816 | .cke_hidpi .cke_dialog a.cke_btn_reset { | ||
817 | background-size: 16px; | ||
818 | background-image: url(images/hidpi/refresh.png); | ||
819 | } | ||
820 | |||
821 | .cke_rtl .cke_dialog a.cke_btn_reset | ||
822 | { | ||
823 | float: left; | ||
824 | } | ||
825 | |||
826 | .cke_dialog a.cke_btn_locked, | ||
827 | .cke_dialog a.cke_btn_unlocked | ||
828 | { | ||
829 | float: left; | ||
830 | width: 16px; | ||
831 | height: 16px; | ||
832 | background-repeat: no-repeat; | ||
833 | border: none 1px; | ||
834 | font-size: 1px; | ||
835 | } | ||
836 | |||
837 | .cke_dialog a.cke_btn_locked .cke_icon | ||
838 | { | ||
839 | display: none; | ||
840 | } | ||
841 | |||
842 | .cke_rtl .cke_dialog a.cke_btn_locked, | ||
843 | .cke_rtl .cke_dialog a.cke_btn_unlocked | ||
844 | { | ||
845 | float: right; | ||
846 | } | ||
847 | |||
848 | .cke_dialog a.cke_btn_locked | ||
849 | { | ||
850 | background-image: url(images/lock.png); | ||
851 | } | ||
852 | |||
853 | .cke_dialog a.cke_btn_unlocked | ||
854 | { | ||
855 | background-image: url(images/lock-open.png); | ||
856 | } | ||
857 | |||
858 | .cke_hidpi .cke_dialog a.cke_btn_unlocked, | ||
859 | .cke_hidpi .cke_dialog a.cke_btn_locked { | ||
860 | background-size: 16px; | ||
861 | } | ||
862 | |||
863 | .cke_hidpi .cke_dialog a.cke_btn_locked { | ||
864 | background-image: url(images/hidpi/lock.png); | ||
865 | } | ||
866 | |||
867 | .cke_hidpi .cke_dialog a.cke_btn_unlocked { | ||
868 | background-image: url(images/hidpi/lock-open.png); | ||
869 | } | ||
870 | |||
871 | .cke_dialog .cke_btn_over | ||
872 | { | ||
873 | border: outset 1px; | ||
874 | cursor: pointer; | ||
875 | } | ||
876 | |||
877 | /* | ||
878 | The rest of the file contains style used on several common plugins. There is a | ||
879 | tendency that these will be moved to the plugins code in the future. | ||
880 | */ | ||
881 | |||
882 | .cke_dialog .ImagePreviewBox | ||
883 | { | ||
884 | border: 2px ridge black; | ||
885 | overflow: scroll; | ||
886 | height: 200px; | ||
887 | width: 300px; | ||
888 | padding: 2px; | ||
889 | background-color: white; | ||
890 | } | ||
891 | |||
892 | .cke_dialog .ImagePreviewBox table td | ||
893 | { | ||
894 | white-space: normal; | ||
895 | } | ||
896 | |||
897 | .cke_dialog .ImagePreviewLoader | ||
898 | { | ||
899 | position: absolute; | ||
900 | white-space: normal; | ||
901 | overflow: hidden; | ||
902 | height: 160px; | ||
903 | width: 230px; | ||
904 | margin: 2px; | ||
905 | padding: 2px; | ||
906 | opacity: 0.9; | ||
907 | filter: alpha(opacity = 90); | ||
908 | |||
909 | background-color: #e4e4e4; | ||
910 | } | ||
911 | |||
912 | .cke_dialog .FlashPreviewBox | ||
913 | { | ||
914 | white-space: normal; | ||
915 | border: 2px ridge black; | ||
916 | overflow: auto; | ||
917 | height: 160px; | ||
918 | width: 390px; | ||
919 | padding: 2px; | ||
920 | background-color: white; | ||
921 | } | ||
922 | |||
923 | .cke_dialog .cke_pastetext | ||
924 | { | ||
925 | width: 346px; | ||
926 | height: 170px; | ||
927 | } | ||
928 | |||
929 | .cke_dialog .cke_pastetext textarea | ||
930 | { | ||
931 | width: 340px; | ||
932 | height: 170px; | ||
933 | resize: none; | ||
934 | } | ||
935 | |||
936 | .cke_dialog iframe.cke_pasteframe | ||
937 | { | ||
938 | width: 346px; | ||
939 | height: 130px; | ||
940 | background-color: white; | ||
941 | border: 1px solid #aeb3b9; | ||
942 | border-radius: 3px; | ||
943 | } | ||
944 | |||
945 | .cke_dialog .cke_hand | ||
946 | { | ||
947 | cursor: pointer; | ||
948 | } | ||
949 | |||
950 | .cke_disabled | ||
951 | { | ||
952 | color: #a0a0a0; | ||
953 | } | ||
954 | |||
955 | .cke_dialog_body .cke_label | ||
956 | { | ||
957 | display: none; | ||
958 | } | ||
959 | |||
960 | .cke_dialog_body label | ||
961 | { | ||
962 | display: inline; | ||
963 | margin-bottom: auto; | ||
964 | cursor: default; | ||
965 | } | ||
966 | |||
967 | .cke_dialog_body label.cke_required | ||
968 | { | ||
969 | font-weight: bold; | ||
970 | } | ||
971 | |||
972 | a.cke_smile | ||
973 | { | ||
974 | overflow: hidden; | ||
975 | display: block; | ||
976 | text-align: center; | ||
977 | padding: 0.3em 0; | ||
978 | } | ||
979 | |||
980 | a.cke_smile img | ||
981 | { | ||
982 | vertical-align: middle; | ||
983 | } | ||
984 | |||
985 | a.cke_specialchar | ||
986 | { | ||
987 | cursor: inherit; | ||
988 | display: block; | ||
989 | height: 1.25em; | ||
990 | padding: 0.2em 0.3em; | ||
991 | text-align: center; | ||
992 | } | ||
993 | |||
994 | a.cke_smile, | ||
995 | a.cke_specialchar | ||
996 | { | ||
997 | border: 1px solid transparent; | ||
998 | } | ||
999 | |||
1000 | a.cke_smile:hover, | ||
1001 | a.cke_smile:focus, | ||
1002 | a.cke_smile:active, | ||
1003 | a.cke_specialchar:hover, | ||
1004 | a.cke_specialchar:focus, | ||
1005 | a.cke_specialchar:active | ||
1006 | { | ||
1007 | background: #fff; | ||
1008 | outline: 0; | ||
1009 | } | ||
1010 | |||
1011 | a.cke_smile:hover, | ||
1012 | a.cke_specialchar:hover | ||
1013 | { | ||
1014 | border-color: #888; | ||
1015 | } | ||
1016 | |||
1017 | a.cke_smile:focus, | ||
1018 | a.cke_smile:active, | ||
1019 | a.cke_specialchar:focus, | ||
1020 | a.cke_specialchar:active | ||
1021 | { | ||
1022 | border-color: #139FF7; | ||
1023 | } | ||
1024 | |||
1025 | /** | ||
1026 | * Styles specific to "cellProperties" dialog. | ||
1027 | */ | ||
1028 | |||
1029 | .cke_dialog_contents a.colorChooser | ||
1030 | { | ||
1031 | display: block; | ||
1032 | margin-top: 6px; | ||
1033 | margin-left: 10px; | ||
1034 | width: 80px; | ||
1035 | } | ||
1036 | |||
1037 | .cke_rtl .cke_dialog_contents a.colorChooser | ||
1038 | { | ||
1039 | margin-right: 10px; | ||
1040 | } | ||
1041 | |||
1042 | /* Compensate focus outline for some input elements. (#6200) */ | ||
1043 | .cke_dialog_ui_checkbox_input:focus, | ||
1044 | .cke_dialog_ui_radio_input:focus, | ||
1045 | .cke_btn_over | ||
1046 | { | ||
1047 | outline: 1px dotted #696969; | ||
1048 | } | ||
1049 | |||
1050 | .cke_iframe_shim | ||
1051 | { | ||
1052 | display: block; | ||
1053 | position: absolute; | ||
1054 | top: 0; | ||
1055 | left: 0; | ||
1056 | z-index: -1; | ||
1057 | filter: alpha(opacity = 0); | ||
1058 | width: 100%; | ||
1059 | height: 100%; | ||
1060 | } | ||