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