comparison src/development/themes/modern.css @ 0:4c4fc447baea

start with sceditor-3.1.1
author Franklin Schmidt <fschmidt@gmail.com>
date Thu, 04 Aug 2022 15:21:29 -0600
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:4c4fc447baea
1 /**
2 * Modern theme
3 *
4 * Copyright (C) 2012, Sam Clarke (samclarke.com)
5 *
6 * SCEditor is licensed under the MIT license:
7 * http://www.opensource.org/licenses/mit-license.php
8 *
9 * Icons by Mark James (http://www.famfamfam.com/lab/icons/silk/)
10 * Licensed under the Creative Commons CC-BY license (http://creativecommons.org/licenses/by/3.0/)
11 */
12 /*! SCEditor | (C) 2011-2016, Sam Clarke | sceditor.com/license */
13 /**
14 * Default SCEditor
15 * http://www.sceditor.com/
16 *
17 * Copyright (C) 2011-16, Sam Clarke
18 *
19 * SCEditor is licensed under the MIT license:
20 * http://www.opensource.org/licenses/mit-license.php
21 */
22 div.sceditor-grip,
23 .sceditor-button div {
24 background-image: url("famfamfam.png");
25 background-repeat: no-repeat;
26 width: 16px;
27 height: 16px;
28 }
29 .sceditor-button-youtube div {
30 background-position: 0px 0px;
31 }
32 .sceditor-button-link div {
33 background-position: 0px -16px;
34 }
35 .sceditor-button-unlink div {
36 background-position: 0px -32px;
37 }
38 .sceditor-button-underline div {
39 background-position: 0px -48px;
40 }
41 .sceditor-button-time div {
42 background-position: 0px -64px;
43 }
44 .sceditor-button-table div {
45 background-position: 0px -80px;
46 }
47 .sceditor-button-superscript div {
48 background-position: 0px -96px;
49 }
50 .sceditor-button-subscript div {
51 background-position: 0px -112px;
52 }
53 .sceditor-button-strike div {
54 background-position: 0px -128px;
55 }
56 .sceditor-button-source div {
57 background-position: 0px -144px;
58 }
59 .sceditor-button-size div {
60 background-position: 0px -160px;
61 }
62 .sceditor-button-rtl div {
63 background-position: 0px -176px;
64 }
65 .sceditor-button-right div {
66 background-position: 0px -192px;
67 }
68 .sceditor-button-removeformat div {
69 background-position: 0px -208px;
70 }
71 .sceditor-button-quote div {
72 background-position: 0px -224px;
73 }
74 .sceditor-button-print div {
75 background-position: 0px -240px;
76 }
77 .sceditor-button-pastetext div {
78 background-position: 0px -256px;
79 }
80 .sceditor-button-paste div {
81 background-position: 0px -272px;
82 }
83 .sceditor-button-outdent div {
84 background-position: 0px -288px;
85 }
86 .sceditor-button-orderedlist div {
87 background-position: 0px -304px;
88 }
89 .sceditor-button-maximize div {
90 background-position: 0px -320px;
91 }
92 .sceditor-button-ltr div {
93 background-position: 0px -336px;
94 }
95 .sceditor-button-left div {
96 background-position: 0px -352px;
97 }
98 .sceditor-button-justify div {
99 background-position: 0px -368px;
100 }
101 .sceditor-button-italic div {
102 background-position: 0px -384px;
103 }
104 .sceditor-button-indent div {
105 background-position: 0px -400px;
106 }
107 .sceditor-button-image div {
108 background-position: 0px -416px;
109 }
110 .sceditor-button-horizontalrule div {
111 background-position: 0px -432px;
112 }
113 .sceditor-button-format div {
114 background-position: 0px -448px;
115 }
116 .sceditor-button-font div {
117 background-position: 0px -464px;
118 }
119 .sceditor-button-emoticon div {
120 background-position: 0px -480px;
121 }
122 .sceditor-button-email div {
123 background-position: 0px -496px;
124 }
125 .sceditor-button-date div {
126 background-position: 0px -512px;
127 }
128 .sceditor-button-cut div {
129 background-position: 0px -528px;
130 }
131 .sceditor-button-copy div {
132 background-position: 0px -544px;
133 }
134 .sceditor-button-color div {
135 background-position: 0px -560px;
136 }
137 .sceditor-button-code div {
138 background-position: 0px -576px;
139 }
140 .sceditor-button-center div {
141 background-position: 0px -592px;
142 }
143 .sceditor-button-bulletlist div {
144 background-position: 0px -608px;
145 }
146 .sceditor-button-bold div {
147 background-position: 0px -624px;
148 }
149 div.sceditor-grip {
150 background-position: 0px -640px;
151 width: 10px;
152 height: 10px;
153 }
154 .rtl div.sceditor-grip {
155 background-position: 0px -650px;
156 }
157 /**
158 * SCEditor
159 * http://www.sceditor.com/
160 *
161 * Copyright (C) 2017, Sam Clarke (samclarke.com)
162 *
163 * SCEditor is licensed under the MIT license:
164 * http://www.opensource.org/licenses/mit-license.php
165 */
166 /*---------------------------------------------------
167 LESS Elements 0.7
168 ---------------------------------------------------
169 A set of useful LESS mixins
170 More info at: http://lesselements.com
171 ---------------------------------------------------*/
172 .sceditor-container {
173 display: -ms-flexbox;
174 display: flex;
175 -ms-flex-direction: column;
176 flex-direction: column;
177 position: relative;
178 background: #fff;
179 border: 1px solid #d9d9d9;
180 font-size: 13px;
181 font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
182 color: #333;
183 line-height: 1;
184 font-weight: bold;
185 height: 250px;
186 border-radius: 4px;
187 background-clip: padding-box;
188 }
189 .sceditor-container *,
190 .sceditor-container *:before,
191 .sceditor-container *:after {
192 -webkit-box-sizing: content-box;
193 -moz-box-sizing: content-box;
194 box-sizing: content-box;
195 }
196 .sceditor-container,
197 .sceditor-container div,
198 div.sceditor-dropdown,
199 div.sceditor-dropdown div {
200 padding: 0;
201 margin: 0;
202 z-index: 3;
203 }
204 .sceditor-container iframe,
205 .sceditor-container textarea {
206 display: block;
207 -ms-flex: 1 1 0%;
208 flex: 1 1 0%;
209 line-height: 1.25;
210 border: 0;
211 outline: none;
212 font-family: Verdana, Arial, Helvetica, sans-serif;
213 font-size: 14px;
214 color: #111;
215 padding: 0;
216 margin: 5px;
217 resize: none;
218 background: #fff;
219 height: auto !important;
220 width: auto !important;
221 width: calc(100% - 10px) !important;
222 min-height: 1px;
223 }
224 .sceditor-container textarea {
225 margin: 7px 5px;
226 }
227 div.sceditor-dnd-cover {
228 position: absolute;
229 top: 0;
230 left: 0;
231 bottom: 0;
232 right: 0;
233 background: rgba(255, 255, 255, 0.2);
234 border: 5px dashed #aaa;
235 z-index: 200;
236 font-size: 2em;
237 text-align: center;
238 color: #aaa;
239 }
240 div.sceditor-dnd-cover p {
241 position: relative;
242 top: 45%;
243 pointer-events: none;
244 }
245 div.sceditor-resize-cover {
246 position: absolute;
247 top: 0;
248 left: 0;
249 background: #000;
250 width: 100%;
251 height: 100%;
252 z-index: 10;
253 opacity: 0.3;
254 }
255 div.sceditor-grip {
256 overflow: hidden;
257 width: 10px;
258 height: 10px;
259 cursor: pointer;
260 position: absolute;
261 bottom: 0;
262 right: 0;
263 z-index: 3;
264 line-height: 0;
265 }
266 div.sceditor-grip.has-icon {
267 background-image: none;
268 }
269 .sceditor-maximize {
270 position: fixed;
271 top: 0;
272 left: 0;
273 height: 100% !important;
274 width: 100% !important;
275 border-radius: 0;
276 background-clip: padding-box;
277 z-index: 2000;
278 }
279 html.sceditor-maximize,
280 body.sceditor-maximize {
281 height: 100%;
282 width: 100%;
283 padding: 0;
284 margin: 0;
285 overflow: hidden;
286 }
287 .sceditor-maximize div.sceditor-grip {
288 display: none;
289 }
290 .sceditor-maximize div.sceditor-toolbar {
291 border-radius: 0;
292 background-clip: padding-box;
293 }
294 /**
295 * Dropdown styleing
296 */
297 div.sceditor-dropdown {
298 position: absolute;
299 border: 1px solid #ccc;
300 background: #fff;
301 z-index: 4000;
302 padding: 10px;
303 font-weight: normal;
304 font-size: 15px;
305 border-radius: 2px;
306 background-clip: padding-box;
307 box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2);
308 }
309 div.sceditor-dropdown *,
310 div.sceditor-dropdown *:before,
311 div.sceditor-dropdown *:after {
312 -webkit-box-sizing: border-box;
313 -moz-box-sizing: border-box;
314 box-sizing: border-box;
315 }
316 div.sceditor-dropdown a,
317 div.sceditor-dropdown a:link {
318 color: #333;
319 }
320 div.sceditor-dropdown form {
321 margin: 0;
322 }
323 div.sceditor-dropdown label {
324 display: block;
325 font-weight: bold;
326 color: #3c3c3c;
327 padding: 4px 0;
328 }
329 div.sceditor-dropdown input,
330 div.sceditor-dropdown textarea {
331 font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
332 outline: 0;
333 padding: 4px;
334 border: 1px solid #ccc;
335 border-top-color: #888;
336 margin: 0 0 0.75em;
337 border-radius: 1px;
338 background-clip: padding-box;
339 }
340 div.sceditor-dropdown textarea {
341 padding: 6px;
342 }
343 div.sceditor-dropdown input:focus,
344 div.sceditor-dropdown textarea:focus {
345 border-color: #aaa;
346 border-top-color: #666;
347 box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.1);
348 }
349 div.sceditor-dropdown .button {
350 font-weight: bold;
351 color: #444;
352 padding: 6px 12px;
353 background: #ececec;
354 border: solid 1px #ccc;
355 border-radius: 2px;
356 background-clip: padding-box;
357 cursor: pointer;
358 margin: 0.3em 0 0;
359 }
360 div.sceditor-dropdown .button:hover {
361 background: #f3f3f3;
362 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
363 }
364 div.sceditor-font-picker,
365 div.sceditor-fontsize-picker,
366 div.sceditor-format {
367 padding: 6px 0;
368 }
369 div.sceditor-color-picker {
370 padding: 4px;
371 }
372 div.sceditor-emoticons,
373 div.sceditor-more-emoticons {
374 padding: 0;
375 }
376 .sceditor-pastetext textarea {
377 border: 1px solid #bbb;
378 width: 20em;
379 }
380 .sceditor-emoticons img,
381 .sceditor-more-emoticons img {
382 padding: 0;
383 cursor: pointer;
384 margin: 2px;
385 }
386 .sceditor-more {
387 border-top: 1px solid #bbb;
388 display: block;
389 text-align: center;
390 cursor: pointer;
391 font-weight: bold;
392 padding: 6px 0;
393 }
394 .sceditor-dropdown a:hover {
395 background: #eee;
396 }
397 .sceditor-fontsize-option,
398 .sceditor-font-option,
399 .sceditor-format a {
400 display: block;
401 padding: 7px 10px;
402 cursor: pointer;
403 text-decoration: none;
404 color: #222;
405 }
406 .sceditor-fontsize-option {
407 padding: 7px 13px;
408 }
409 .sceditor-color-column {
410 float: left;
411 }
412 .sceditor-color-option {
413 display: block;
414 border: 2px solid #fff;
415 height: 18px;
416 width: 18px;
417 overflow: hidden;
418 }
419 .sceditor-color-option:hover {
420 border: 1px solid #aaa;
421 }
422 /**
423 * Toolbar styleing
424 */
425 div.sceditor-toolbar {
426 flex-shrink: 0;
427 overflow: hidden;
428 padding: 3px 5px 2px;
429 background: #f7f7f7;
430 border-bottom: 1px solid #c0c0c0;
431 line-height: 0;
432 text-align: left;
433 user-select: none;
434 border-radius: 3px 3px 0 0;
435 background-clip: padding-box;
436 }
437 div.sceditor-group {
438 display: inline-block;
439 background: #ddd;
440 margin: 1px 5px 1px 0;
441 padding: 1px;
442 border-bottom: 1px solid #aaa;
443 border-radius: 3px;
444 background-clip: padding-box;
445 }
446 .sceditor-button {
447 float: left;
448 cursor: pointer;
449 padding: 3px 5px;
450 width: 16px;
451 height: 20px;
452 border-radius: 3px;
453 background-clip: padding-box;
454 }
455 .sceditor-button:hover,
456 .sceditor-button:active,
457 .sceditor-button.active {
458 background: #fff;
459 box-shadow: inset 1px 1px 0 rgba(0,0,0,0.3), inset -1px 0 rgba(0,0,0,0.3), inset 0 -1px 0 rgba(0,0,0,0.2);
460 }
461 .sceditor-button:active {
462 background: #fff;
463 box-shadow: inset 1px 1px 0 rgba(0,0,0,0.3), inset -1px 0 rgba(0,0,0,0.3), inset 0 -1px 0 rgba(0,0,0,0.2), inset 0 0 8px rgba(0,0,0,0.3);
464 }
465 .sceditor-button.disabled:hover {
466 background: inherit;
467 cursor: default;
468 box-shadow: none;
469 }
470 .sceditor-button,
471 .sceditor-button div {
472 display: block;
473 }
474 .sceditor-button svg {
475 display: inline-block;
476 height: 16px;
477 width: 16px;
478 margin: 2px 0;
479 fill: #111;
480 text-decoration: none;
481 pointer-events: none;
482 line-height: 1;
483 }
484 .sceditor-button.disabled svg {
485 fill: #888;
486 }
487 .sceditor-button div {
488 display: inline-block;
489 margin: 2px 0;
490 padding: 0;
491 overflow: hidden;
492 line-height: 0;
493 font-size: 0;
494 color: transparent;
495 }
496 .sceditor-button.has-icon div {
497 display: none;
498 }
499 .sceditor-button.disabled div {
500 opacity: 0.3;
501 }
502 .text .sceditor-button,
503 .text .sceditor-button div,
504 .sceditor-button.text,
505 .sceditor-button.text div,
506 .text-icon .sceditor-button,
507 .text-icon .sceditor-button div,
508 .sceditor-button.text-icon,
509 .sceditor-button.text-icon div {
510 display: inline-block;
511 width: auto;
512 line-height: 16px;
513 font-size: 1em;
514 color: inherit;
515 text-indent: 0;
516 }
517 .text-icon .sceditor-button.has-icon div,
518 .sceditor-button.has-icon div,
519 .text .sceditor-button div,
520 .sceditor-button.text div {
521 padding: 0 2px;
522 background: none;
523 }
524 .text .sceditor-button svg,
525 .sceditor-button.text svg {
526 display: none;
527 }
528 .text-icon .sceditor-button div,
529 .sceditor-button.text-icon div {
530 padding: 0 2px 0 20px;
531 }
532 .rtl div.sceditor-toolbar {
533 text-align: right;
534 }
535 .rtl .sceditor-button {
536 float: right;
537 }
538 .rtl div.sceditor-grip {
539 right: auto;
540 left: 0;
541 }
542 .sceditor-container {
543 border: 1px solid #999;
544 }
545 .sceditor-container textarea {
546 font-family: Consolas, "Bitstream Vera Sans Mono", "Andale Mono", Monaco, "DejaVu Sans Mono", "Lucida Console", monospace;
547 background: #2e3436;
548 color: #fff;
549 margin: 0;
550 padding: 5px;
551 }
552 div.sceditor-toolbar {
553 background: #ccc;
554 background: linear-gradient(to bottom, #cccccc 0%, #b2b2b2 100%);
555 }
556 div.sceditor-group {
557 display: inline;
558 background: transparent;
559 margin: 0;
560 padding: 0;
561 border: 0;
562 }
563 .sceditor-button {
564 padding: 4px;
565 margin: 2px 1px 2px 3px;
566 height: 16px;
567 border-radius: 12px;
568 background-clip: padding-box;
569 }
570 .sceditor-button:hover,
571 .sceditor-button.active,
572 .sceditor-button.active:hover {
573 box-shadow: none;
574 }
575 .sceditor-button:hover {
576 background: #fff;
577 background: rgba(255, 255, 255, 0.75);
578 margin: 1px 0 1px 2px;
579 border: 1px solid #eee;
580 }
581 .sceditor-button.disabled:hover {
582 margin: 2px 1px 2px 3px;
583 border: 0;
584 }
585 .sceditor-button.active {
586 background: #b1b1b1;
587 background: rgba(0, 0, 0, 0.1);
588 margin: 1px 0 1px 2px;
589 border: 1px solid #999;
590 }
591 .sceditor-button.active:hover {
592 background: #fff;
593 background: rgba(255, 255, 255, 0.25);
594 }
595 .sceditor-button:active,
596 .sceditor-button.active:active {
597 margin: 1px 0 1px 2px;
598 border: 1px solid #999;
599 box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.5);
600 }
601 .sceditor-button div,
602 .sceditor-button svg {
603 margin: 0;
604 }