2 * html2comic Javascript Editor -
\r\r
12 /* VML ( v\:* don't work for ie8(ie8mode))
\r\r
13 ---------------------------------------------------------------------------------------*/
\r\r
16 behavior: url(#default#VML);
\r\r
21 ---------------------------------------------------------------------------------------*/
\r\r
29 ---------------------------------------------------------------------------------------*/
\r\r
31 Copyright (c) 2009, Yahoo! Inc. All rights reserved.
\r\r
32 Code licensed under the BSD License:
\r\r
33 http://developer.yahoo.net/yui/license.txt
\r\r
37 font: 13px/1.231 arial,helvetica,clean,sans-serif;
\r\r
39 *font-size: small;
\r\r
42 select, input, button, textarea, button{
\r\r
43 font: 99% arial,helvetica,clean,sans-serif;
\r\r
46 font-size: inherit;
\r\r
50 html, body, div, span, applet, object, iframe,
\r\r
51 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
\r\r
52 a, abbr, acronym, address, big, cite, code,
\r\r
53 del, dfn, em, font, img, ins, kbd, q, s, samp,
\r\r
54 small, strike, strong, sub, sup, tt, var,
\r\r
56 dl, dt, dd, ol, ul, li,
\r\r
57 fieldset, form, label, legend,
\r\r
58 table, caption, tbody, tfoot, thead {
\r\r
63 vertical-align: baseline;
\r\r
64 font-family: "Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,sans-serif;
\r\r
68 text-shadow: #000 0 0 0;/* for Safari */
\r\r
69 -moz-opacity: 0.99;/* for Firefox */
\r\r
72 pre, code, kbd, samp, tt {
\r\r
73 font-family: monospace;
\r\r
74 line-height: 100%;
\r\r
76 margin-bottom: 1em;
\r\r
79 /* http://e2designer.seesaa.net/article/152168876.html */
\r\r
80 /* http://perishablepress.com/press/2010/06/01/wrapping-content/ */
\r\r
82 white-space: pre; /* CSS 2.0 */
\r\r
83 white-space: pre-wrap; /* CSS 2.1 */
\r\r
84 white-space: pre-line; /* CSS 3.0 */
\r\r
85 white-space: -pre-wrap; /* Opera 4-6 */
\r\r
86 white-space: -o-pre-wrap; /* Opera 7 */
\r\r
87 white-space: -moz-pre-wrap; /* Mozilla */
\r\r
88 white-space: -hp-pre-wrap; /* HP Printers */
\r\r
89 word-wrap: break-word; /* IE 5+ */
\r\r
92 /* remember to define focus styles! */
\r\r
93 :focus { outline: 0;}
\r\r
95 /* remember to highlight inserts somehow! */
\r\r
96 ins { text-decoration: none;}
\r\r
97 del { text-decoration: line-through;}
\r\r
99 /* http://honoo-no.com/creators/2008/02/14_211120.html */
\r\r
100 textarea, input {
\r\r
101 font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3",sans-serif;
\r\r
104 margin-left: 2em;
\r\r
108 margin: 1em 0 0 1em;
\r\r
109 font-weight: bold;
\r\r
112 margin: 0.5em 0 0 2em;
\r\r
116 ---------------------------------------------------------------------------------------*/
\r\r
117 /* for modern brouser */
\r\r
118 claerfix:after {
\r\r
121 visibility: hidden;
\r\r
123 font-size: 0.1em;
\r\r
129 display: inline-block;
\r\r
131 /* WinIE6 below, Exclude MacIE5 \*/
\r\r
132 * html .clearfix {
\r\r
143 ---------------------------------------------------------------------------------------*/
\r\r
144 a:link { color:#008;}
\r\r
145 a:visited { color: #505;}
\r\r
146 a { text-decoration: none;}
\r\r
149 text-decoration: underline;
\r\r
154 letter-spacing: 2px;
\r\r
155 border-bottom: 1px dotted #333333;
\r\r
156 font-size: 1.4em;
\r\r
157 line-height: 1.4em;
\r\r
158 text-align: center;
\r\r
163 font-weight: bold;
\r\r
166 letter-spacing: 1px;
\r\r
167 border: 1px #333 solid;
\r\r
168 border-width: 0 0 1px 0.5em;
\r\r
169 padding: 4px 0 2px 0.6em;
\r\r
170 margin: 2em 0 1em;
\r\r
173 letter-spacing: 1px;
\r\r
174 border-bottom: 1px #999 dotted;
\r\r
175 padding: 6px 6px 2px;
\r\r
176 margin: 2em 7px 1em;
\r\r
180 padding: 0 5px 0;
\r\r
181 margin: 1.5em 14px 1em;
\r\r
184 border-left: 5px #999 solid;
\r\r
185 letter-spacing: 1px;
\r\r
188 border-left: 3px #666 double;
\r\r
195 blockquote, cite {}
\r\r
198 /* tables still need 'cellspacing="0"' in the markup */
\r\r
201 border: #999 solid;
\r\r
202 border-width: 1px 1px 0 0;
\r\r
203 border-collapse: collapse;
\r\r
204 empty-cells: show;
\r\r
205 border-spacing: 0;
\r\r
206 line-height: 1.6em;
\r\r
208 margin: 9px auto 1em;
\r\r
209 _margin: 9px 15px 1em;
\r\r
215 border: #999 solid;
\r\r
216 border-width: 0 0 1px 1px;
\r\r
219 /* View Container
\r\r
220 ---------------------------------------------------------------------------------------*/
\r\r
221 .view-container {
\r\r
223 position: absolute;
\r\r
231 ---------------------------------------------------------------------------------------*/
\r\r
232 #overlay-container,
\r\r
233 #overlay-shadow {
\r\r
234 position: absolute;
\r\r
240 #overlay-shadow {
\r\r
241 background-color: #000;
\r\r
243 -moz-opacity: 0.5;
\r\r
244 filter: alpha(opacity=50);
\r\r
245 -ms-filter: alpha(opacity=50);
\r\r
247 .h2c-ActiveX-disabled #overlay-shadow {
\r\r
251 #overlay-close-button {
\r\r
252 border: 2px solid #f00;
\r\r
254 font-weight: bold;
\r\r
256 line-height: 16px;
\r\r
257 text-align: center;
\r\r
259 overflow: hidden;
\r\r
263 position: absolute;
\r\r
266 border-radius: 5px;
\r\r
267 -o-border-radius: 5px;
\r\r
268 -ms-border-radius: 5px;
\r\r
269 -moz-border-radius: 5px;
\r\r
270 -webkit-border-radius: 5px;
\r\r
274 ---------------------------------------------------------------------------------------*/
\r\r
276 border: 1px outset #ccc;
\r\r
277 background-color: #eee;
\r\r
279 font-weight: bold;
\r\r
280 text-align: center;
\r\r
282 overflow: hidden;
\r\r
284 line-height: 30px;
\r\r
285 border-radius: 5px;
\r\r
286 -o-border-radius: 5px;
\r\r
287 -ms-border-radius: 5px;
\r\r
288 -moz-border-radius: 5px;
\r\r
289 -webkit-border-radius: 5px;
\r\r
293 ---------------------------------------------------------------------------------------*/
\r\r
295 background-image: url( loading.gif);
\r\r
296 background-position: 50% 50%;
\r\r
297 background-repeat: no-repeat;
\r\r
300 background-image: url( error.png);
\r\r
301 background-position: 50% 50%;
\r\r
302 background-repeat: no-repeat;
\r\r
306 ---------------------------------------------------------------------------------------*/
\r\r
307 img.img-flip-v { /* 上下反転 */
\r\r
308 transform: scale( 1, -1);
\r\r
309 -o-transform: scale( 1, -1);
\r\r
310 -ms-transform: scale( 1, -1);
\r\r
311 -moz-transform: scale( 1, -1);
\r\r
312 -webkit-transform: scale( 1, -1);
\r\r
313 filter: progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);
\r\r
314 -ms-filter: progid:DXImageTransform.Microsoft.BasicImage( Mirror=1, Rotation=2);
\r\r
316 v\:image.img-flip-v {
\r\r
317 flip: y; /* vml */
\r\r
320 img.img-flip-h { /* 左右反転 */
\r\r
321 transform: scale( -1, 1);
\r\r
322 -o-transform: scale( -1, 1);
\r\r
323 -ms-transform: scale( -1, 1);
\r\r
324 -moz-transform: scale( -1, 1);
\r\r
325 -webkit-transform: scale( -1, 1);
\r\r
326 filter: progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);
\r\r
327 -ms-filter: progid:DXImageTransform.Microsoft.BasicImage( Mirror=1);
\r\r
329 v\:image.img-flip-h {
\r\r
330 flip: x; /* vml */
\r\r
333 img.img-flip-vh { /* 上下左右反転 */
\r\r
334 transform: scale( -1, -1);
\r\r
335 -o-transform: scale( -1, -1);
\r\r
336 -ms-transform: scale( -1, -1);
\r\r
337 -moz-transform: scale( -1, -1);
\r\r
338 -webkit-transform: scale( -1, -1);
\r\r
339 filter: progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);
\r\r
340 -ms-filter: progid:DXImageTransform.Microsoft.BasicImage( Rotation=2);
\r\r
342 v\:image.img-flip-vh {
\r\r
343 rotation : 180; /* vml */
\r\r
346 /* img mirror with png-fix
\r\r
347 ---------------------------------------------------------------------------------------*/
\r\r
348 .img-flip-v .img-flip-with-pngfix-v,
\r\r
349 .img-flip-vh .img-flip-with-pngfix-v {
\r\r
352 .img-flip-h .img-flip-with-pngfix-h,
\r\r
353 .img-flip-vh .img-flip-with-pngfix-h {
\r\r
358 ---------------------------------------------------------------------------------------*/
\r\r
360 position: absolute;
\r\r
363 text-align: right;
\r\r
365 border-right: 1px solid #666;
\r\r
368 #grobal-navi a:link,
\r\r
369 #grobal-navi a:visited,
\r\r
370 #grobal-navi a:active {
\r\r
371 text-align: center;
\r\r
373 text-decoration: none;
\r\r
377 border-left: 1px solid #666;
\r\r
379 line-height: 12px;
\r\r
380 padding: 11px 0 7px;
\r\r
383 #grobal-navi a:active {
\r\r
384 background-color: #333;
\r\r
386 #grobal-navi a:hover {
\r\r
387 background-color: #999;
\r\r
390 /*--------------------------------------------------------------------------------------
\r\r
394 -------------------------------------------------------------------------------------*/
\r\r
400 /*--------------------------------------------------------------------------------------
\r\r
404 -------------------------------------------------------------------------------------*/
\r\r
406 overflow: hidden;
\r\r
407 background-color: #f5f5f5;
\r\r
411 --------------------------------------------------------------------------------------*/
\r\r
412 #speach-editor-wrapper {
\r\r
413 position: absolute;
\r\r
415 #speach-editor-wrapper form {
\r\r
422 border: 1px outset #ccc;
\r\r
425 #speach-edit-complete-button {
\r\r
426 margin: 10px auto 0;
\r\r
430 --------------------------------------------------------------------------------------*/
\r\r
431 #image-gruop-wrapper {
\r\r
432 position: absolute;
\r\r
436 #image-icon-container {
\r\r
437 position: absolute;
\r\r
442 background-color: #fff;
\r\r
443 border: #fff solid;
\r\r
444 border-width: 0;
\r\r
446 #image-gruop-button {
\r\r
448 position: absolute;
\r\r
453 .image-gruop-item {
\r\r
456 position: absolute;
\r\r
459 text-align: center;
\r\r
461 .image-gruop-item .reversible-image-container {
\r\r
465 .image-gruop-item .reversible-image-container img {
\r\r
469 .image-gruop-item-title {
\r\r
470 position: absolute;
\r\r
473 text-align: center;
\r\r
480 ---------------------------------------------------------------------------------------*/
\r\r
482 position: absolute;
\r\r
487 background-color: #fff;
\r\r
488 box-shadow: 0 4px 9px #333;
\r\r
489 -moz-box-shadow: 0 4px 9px #333;
\r\r
490 -webkit-box-shadow: 0 4px 9px #333;
\r\r
491 filter:progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=180,strength=9);
\r\r
494 .menu-bar-item-focus {
\r\r
495 position: absolute;
\r\r
500 .menu-bar-item div,
\r\r
501 .menu-bar-item-focus div {
\r\r
503 overflow: hidden;
\r\r
505 line-height: 30px;
\r\r
506 padding-left: 0.6em;
\r\r
509 .menu-bar-item-focus div {
\r\r
510 background-color: #66f;
\r\r
513 .menu-bar-item ul {
\r\r
516 .menu-bar-item-focus ul {
\r\r
517 position: absolute;
\r\r
518 list-style: none;
\r\r
523 background-color: #fff;
\r\r
525 border: 1px solid #ccc;
\r\r
526 box-shadow: 1px 4px 9px #333;
\r\r
527 -moz-box-shadow: 1px 4px 9px #333;
\r\r
528 -webkit-box-shadow: 1px 4px 9px #333;
\r\r
529 filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9);
\r\r
531 .menu-bar-item-focus li {
\r\r
536 line-height: 30px;
\r\r
538 .menu-bar-item-focus li.disabled {
\r\r
541 .menu-bar-item-focus a,
\r\r
542 .menu-bar-item-focus a:link,
\r\r
543 .menu-bar-item-focus a:visited {
\r\r
545 position: relative;
\r\r
549 line-height: 30px;
\r\r
550 *cursor: pointer;
\r\r
552 .menu-bar-item-focus a:hover {
\r\r
554 background-color: #ccf;
\r\r
555 text-decoration: none;
\r\r
556 *cursor: pointer;
\r\r
558 .menu-bar-item-focus li.disabled a,
\r\r
559 .menu-bar-item-focus li.disabled a:link,
\r\r
560 .menu-bar-item-focus li.disabled a:visited,
\r\r
561 .menu-bar-item-focus li.disabled a:active,
\r\r
562 .menu-bar-item-focus li.disabled a:hover {
\r\r
564 background-color: #fff;
\r\r
565 *cursor: default;
\r\r
567 .menu-bar-item-focus span {
\r\r
568 position: absolute;
\r\r
573 font-weight: bold;
\r\r
575 overflow: hidden;
\r\r
577 .menu-bar-item-focus kbd {
\r\r
578 position: absolute;
\r\r
585 overflow: hidden;
\r\r
587 .menu-bar-item-focus li.separator {
\r\r
591 border-top: 1px solid #ccc;
\r\r
597 ---------------------------------------------------------------------------------------*/
\r\r
598 #whiteGlass-container {
\r\r
599 position: absolute;
\r\r
605 #whiteGlass-container div {
\r\r
606 position: absolute;
\r\r
607 background-color: #fff;
\r\r
609 -moz-opacity: 0.7;
\r\r
610 filter: alpha(opacity=70);
\r\r
611 -ms-filter: alpha(opacity=70);
\r\r
613 #whiteGlass-top {
\r\r
619 #whiteGlass-left {
\r\r
625 #whiteGlass-right {
\r\r
631 #whiteGlass-bottom {
\r\r
639 ---------------------------------------------------------------------------------------*/
\r\r
641 position: absolute;
\r\r
642 border: 2px solid #333;
\r\r
645 /* mouse-operation-catcher
\r\r
646 ---------------------------------------------------------------------------------------*/
\r\r
647 #mouse-operation-catcher {
\r\r
648 position: absolute;
\r\r
652 height: 100%; /* 100% don't work for ie6, so ie6 need to set height-'px' by js */
\r\r
653 *background-color: #fff;
\r\r
654 filter: alpha(opacity=0);
\r\r
656 html>/**/body #mouse-operation-catcher {
\r\r
657 background-color /***/: #fff\9;
\r\r
658 -ms-filter /***/: alpha(opacity=0)\9;
\r\r
661 * ieでは、背景を設定しないと、mouse-operation-catcherが働かない。
\r\r
662 * activeX有効の場合は背景を着色してfilterで透明に。
\r\r
663 * activeX無効の場合は透明gifを使用
\r\r
664 * background: url(4x4.gif) fixed repeat;
\r
668 ---------------------------------------------------------------------------------------*/
\r\r
669 #comic-element-container {
\r\r
670 position: absolute;
\r\r
673 .comic-element-wrapper {
\r\r
674 position: absolute;
\r\r
676 #comic-element-container img {
\r\r
679 position: absolute;
\r\r
684 /* comic-element-resizer
\r\r
685 ---------------------------------------------------------------------------------------*/
\r\r
686 #comic-element-resizer-container {
\r\r
687 position: absolute;
\r\r
688 border: 1px solid #999;
\r\r
690 .comic-element-resizer {
\r\r
691 position: absolute;
\r\r
694 font-size: 8px; /* ie */
\r\r
695 line-height: 8px; /* ie */
\r\r
696 border: 1px solid #333;
\r\r
697 background-color: #fff;
\r\r
702 #comic-element-resizer-top {
\r\r
706 #comic-element-resizer-left {
\r\r
710 #comic-element-resizer-right {
\r\r
714 #comic-element-resizer-bottom {
\r\r
718 #comic-element-resizer-top-left {
\r\r
722 #comic-element-resizer-top-right {
\r\r
726 #comic-element-resizer-bottom-left {
\r\r
730 #comic-element-resizer-bottom-right {
\r\r
735 ---------------------------------------------------------------------------------------*/
\r\r
736 #panel-resizer-top,
\r\r
737 #panel-resizer-bottom {
\r\r
738 position: absolute;
\r\r
739 border: 1px outset #999;
\r\r
740 background-color: #eee;
\r\r
741 text-align: center;
\r\r
743 line-height: 12px;
\r\r
748 #panel-resizer-top {
\r\r
750 border-radius: 8px 8px 0 0;
\r\r
751 -o-border-radius: 8px 8px 0 0;
\r\r
752 -ms-border-radius: 8px 8px 0 0;
\r\r
753 -moz-border-radius: 8px 8px 0 0;
\r\r
754 -webkit-border-radius: 8px 8px 0 0;
\r\r
756 #panel-resizer-bottom {
\r\r
758 border-radius: 0 0 8px 8px;
\r\r
759 -o-border-radius: 0 0 8px 8px;
\r\r
760 -ms-border-radius: 0 0 8px 8px;
\r\r
761 -moz-border-radius: 0 0 8px 8px;
\r\r
762 -webkit-border-radius: 0 0 8px 8px;
\r\r
765 /* baloon-tail-mover
\r\r
766 ---------------------------------------------------------------------------------------*/
\r\r
767 #baloon-tail-mover {
\r\r
768 position: absolute;
\r\r
771 font-size: 8px; /* ie */
\r\r
772 line-height: 8px; /* ie */
\r\r
773 border: 1px solid #333;
\r\r
774 background-color: #66f;
\r\r
775 margin: -5px 0 0 -5px;
\r\r
778 /* comic element console
\r\r
779 ---------------------------------------------------------------------------------------*/
\r\r
780 #comic-element-consol-wrapper {
\r\r
781 position: absolute;
\r\r
783 #image-element-consol {
\r\r
787 #text-element-consol {
\r\r
792 #change-image-button,
\r\r
793 #layer-back-button,
\r\r
794 #layer-forward-button,
\r\r
795 #delete-image-button,
\r\r
796 #edit-text-button,
\r\r
797 #change-text-style-button,
\r\r
798 #hide-text-tail-button,
\r\r
799 #back-text-button,
\r\r
800 #forward-text-button,
\r\r
801 #delete-text-button {
\r\r
802 text-indent: -9999px;
\r\r
805 line-height: 25px;
\r\r
807 background-image: url(icons.gif);
\r\r
808 background-repeat: no-repeat;
\r\r
809 background-position: 0 0;
\r\r
812 #hide-text-tail-button {
\r\r
813 background-position: -25px -25px;
\r\r
815 #change-image-button,
\r\r
816 #change-text-style-button {
\r\r
817 background-position: -25px 0;
\r\r
819 #layer-back-button,
\r\r
820 #back-text-button {
\r\r
821 background-position: -50px 0;
\r\r
823 #layer-forward-button,
\r\r
824 #forward-text-button {
\r\r
825 background-position: -50px -25px;
\r\r
827 #delete-image-button,
\r\r
828 #delete-text-button {
\r\r
829 background-position: 0 -25px;
\r\r
832 .console-out #comic-element-consol-wrapper-when-out {
\r\r
834 background-color: #333;
\r\r
836 .console-out #comic-element-consol-tail {
\r\r
837 border-width: 0 5px 10px 5px;
\r\r
838 border-color: transparent transparent #333 transparent;
\r\r
839 _border-color: #fff #fff #333 #fff;
\r\r
840 border-style: solid;
\r\r
845 position: absolute;
\r\r
852 /* Panel > speach
\r\r
853 ---------------------------------------------------------------------------------------*/
\r\r
855 text-align: center;
\r\r
857 position: absolute;
\r\r
866 display: table-cell;
\r\r
867 vertical-align: middle;
\r\r
870 /* fix for ie */
\r\r
871 .text-element table,
\r\r
872 .text-element tbody,
\r\r
873 .text-element tr,
\r\r
874 .text-element td {
\r\r
880 text-align: center;
\r\r
881 vertical-align: middle;
\r\r
883 .text-element table {
\r\r
884 table-layout: fixed; /* ie6で上下中央にテキストがならない対処。固定レイアウトアルゴリズムになるので負荷を下げるらしい */
\r\r
888 ---------------------------------------------------------------------------------------*/
\r\r
889 .window-wrapper {
\r\r
890 position: absolute;
\r\r
895 background-color: #fff;
\r\r
896 box-shadow: 1px 4px 9px #333;
\r\r
897 -moz-box-shadow: 1px 4px 9px #333;
\r\r
898 -webkit-box-shadow: 1px 4px 9px #333;
\r\r
899 filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9);
\r\r
902 .window-close-button {
\r\r
905 line-height: 12px;
\r\r
906 overflow: hidden;
\r\r
907 text-align: center;
\r\r
908 padding-top: 8px;
\r\r
909 padding-bottom: 6px;
\r\r
910 background-color: #333;
\r\r
912 .window-close-button {
\r\r
913 position: absolute;
\r\r
916 border-left: 1px solid #666;
\r\r
917 padding-left: 9px;
\r\r
918 padding-right: 9px;
\r\r
919 border-radius: 0 8px 0 0;
\r\r
920 -o-border-radius: 0 8px 0 0;
\r\r
921 -ms-border-radius: 0 8px 0 0;
\r\r
922 -moz-border-radius: 0 8px 0 0;
\r\r
923 -webkit-border-radius: 0 8px 0 0;
\r\r
928 border-radius: 8px 8px 0 0;
\r\r
929 -o-border-radius: 8px 8px 0 0;
\r\r
930 -ms-border-radius: 8px 8px 0 0;
\r\r
931 -moz-border-radius: 8px 8px 0 0;
\r\r
932 -webkit-border-radius: 8px 8px 0 0;
\r\r
935 position: relative;
\r\r
936 overflow: hidden;
\r\r
939 .window-resize-button {
\r\r
940 position: absolute;
\r\r
943 border-bottom: 20px solid #aaa;
\r\r
944 border-left: 20px solid transparent;
\r\r
945 _border-left: 20px solid #fff;
\r\r
949 text-indent: -9999px;
\r\r
950 text-align: center;
\r\r
962 .sidenavi-item:link {
\r\r
964 border-bottom: 1px solid #666;
\r\r
966 text-decoration: none;
\r\r
968 .sidenavi-item:hover {
\r\r
969 background-color: #ccc;
\r\r
970 text-decoration: none;
\r\r
972 .sidenavi .current {
\r\r
973 background-color: #666;
\r\r
977 _position: relative; /* for ie6 */
\r\r
978 margin-left: 100px;
\r\r
979 padding: 1em 1em 2em 2em;
\r\r
986 ---------------------------------------------------------------------------------------*/
\r\r
989 display: inline-block;
\r\r
991 border: 1px solid #ccc;
\r\r
993 line-height: 16px;
\r\r
995 .editable-text a,
\r\r
996 .editable-text a:link,
\r\r
997 .editable-text a:visited,
\r\r
998 .editable-text a:hover,
\r\r
999 .editable-text a:active {
\r\r
1002 text-decoration: none;
\r\r
1005 background-color: #fff;
\r\r
1007 .editable-text a:hover {
\r\r
1008 background-color: #ccf;
\r\r
1010 .editable-text input {
\r\r
1013 font-family: Arial,Helvetica,sans-serif;
\r\r
1014 background-color: #ccf;
\r\r
1021 /* Information Window
\r\r
1022 ---------------------------------------------------------------------------------------*/
\r\r
1023 #comic-element-infomation {
\r\r
1024 background-color: #fff;
\r\r
1025 position: absolute;
\r\r
1028 #comic-element-x, #comic-element-z,
\r\r
1029 #comic-element-y, #comic-element-a,
\r\r
1030 #comic-element-w, #comic-element-w-percent,
\r\r
1031 #comic-element-h, #comic-element-h-percent {
\r\r
1032 position: absolute;
\r\r
1035 #comic-element-x,
\r\r
1036 #comic-element-y,
\r\r
1037 #comic-element-w,
\r\r
1038 #comic-element-h {
\r\r
1041 #comic-element-z,
\r\r
1042 #comic-element-a,
\r\r
1043 #comic-element-w-percent,
\r\r
1044 #comic-element-h-percent {
\r\r
1048 #comic-element-x, #comic-element-z {
\r\r
1051 #comic-element-y, #comic-element-a {
\r\r
1054 #comic-element-w, #comic-element-w-percent {
\r\r
1057 #comic-element-h, #comic-element-h-percent {
\r\r
1060 .comic-element-attribute-label {
\r\r
1061 display: inline-block;
\r\r
1063 line-height: 22px;
\r\r
1064 *line-height: 22px; /* ie用 input周りのサイズあわせ、よく分からない。 */
\r\r
1066 text-align: center;
\r\r
1068 .comic-element-attribute-value {
\r\r
1070 text-align: right;
\r\r
1073 #comic-element-z-value,
\r\r
1074 #comic-element-a-value {
\r\r
1077 #comic-element-w-percent-value,
\r\r
1078 #comic-element-h-percent-value {
\r\r
1082 /* Background Window
\r\r
1083 ---------------------------------------------------------------------------------------*/
\r\r
1085 #select-bg-pattern-button,
\r\r
1086 #reset-bg-pattern-button,
\r\r
1088 #select-bg-color-button,
\r\r
1089 #reset-bg-color-button {
\r\r
1090 position: absolute;
\r\r
1091 text-align: center;
\r\r
1092 cursor: pointer;
\r\r
1097 box-shadow: 1px 2px 3px #000;
\r\r
1098 -moz-box-shadow: 1px 2px 3px #000;
\r\r
1099 -webkit-box-shadow: 1px 2px 3px #000;
\r\r
1107 #select-bg-pattern-button,
\r\r
1108 #reset-bg-pattern-button,
\r\r
1109 #select-bg-color-button,
\r\r
1110 #reset-bg-color-button {
\r\r
1111 border: 1px outset #666;
\r\r
1114 line-height: 20px;
\r\r
1116 #select-bg-pattern-button {
\r\r
1120 #reset-bg-pattern-button {
\r\r
1128 background-color: #66f;
\r\r
1130 #select-bg-color-button {
\r\r
1134 #reset-bg-color-button {
\r\r
1141 /* Tool-box Window
\r\r
1142 ---------------------------------------------------------------------------------------*/
\r\r
1143 #toolbox-add-image-button,
\r\r
1144 #toolbox-add-text-button,
\r\r
1145 #toolbox-edit-bg-button,
\r\r
1146 #toolbox-switch-grid,
\r\r
1147 #toolbox-popup-help-button,
\r\r
1148 #toolbox-publish-button {
\r\r
1149 position: absolute;
\r\r
1152 border: 1px outset #999;
\r\r
1154 line-height: 40px;
\r\r
1155 text-align: center;
\r\r
1156 cursor: pointer;
\r\r
1157 background-color: #ccc;
\r\r
1158 border-radius: 8px;
\r\r
1159 -o-border-radius: 8px;
\r\r
1160 -ms-border-radius: 8px;
\r\r
1161 -moz-border-radius: 8px;
\r\r
1162 -webkit-border-radius: 8px;
\r\r
1164 #toolbox-add-image-button {
\r\r
1167 #toolbox-add-text-button {
\r\r
1170 #toolbox-edit-bg-button {
\r\r
1173 line-height: 30px;
\r\r
1175 #toolbox-switch-grid,
\r\r
1176 #toolbox-popup-help-button {
\r\r
1179 line-height: 30px;
\r\r
1181 #toolbox-switch-grid {
\r\r
1182 width: 45px !important;
\r\r
1184 #toolbox-popup-help-button {
\r\r
1185 width: 35px !important;
\r\r
1186 left: 65px !important;
\r\r
1189 #toolbox-publish-button {
\r\r
1192 line-height: 50px;
\r\r
1196 ---------------------------------------------------------------------------------------*/
\r\r
1200 position: absolute;
\r\r
1203 background-attachment: fixed;
\r\r
1204 background-repeat: repeat;
\r\r
1205 /* background-image: url('grid.gif'); grid用イメージはgrid使用時にjsで埋め込み */
\r\r
OSDN Git Service
