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