@charset "UTF-8";\r
\r
/* pettanR peta.apps.css\r
- * version 0.5.12\r
+ * version 0.5.31\r
* \r
* author:\r
* itozyun\r
color: #fff;\r
font-size: 12pt;\r
line-height: 1;\r
- padding: 6pt 0 6pt 5pt;\r
- }\r
- #cabinet-close-button, #gallery-close-button {\r
- position: absolute;\r
- right: 0;\r
- top: 0;\r
- border-left: 1px solid #666;\r
- height: 24pt;\r
- padding: 6pt 9pt 6pt 9pt;\r
- text-align: center;\r
- cursor: pointer;\r
+ padding: 0;\r
}\r
+ .header-title {\r
+ padding : 6pt;\r
+ }\r
+ #cabinet-close-button, #gallery-close-button {\r
+ position: absolute;\r
+ right: 0;\r
+ top: 0;\r
+ border-left: 1px solid #666;\r
+ height: 24pt;\r
+ padding: 6pt 9pt 6pt 9pt;\r
+ text-align: center;\r
+ cursor: pointer;\r
+ }\r
+ .close-button-hover {\r
+ background-color: #333;\r
+ }\r
\r
/*--------------------------------------------------------------------------------------\r
* \r
}\r
\r
/* Panel Console\r
- --------------------------------------------------------------------------------------*/ \r
+ --------------------------------------------------------------------------------------*/\r
+ #panel-console-data-value {\r
+ width: 180px;\r
+ height: 16px;\r
+ line-height:22px;\r
+ overflow:hidden;\r
+ text-align:left;\r
+ } \r
#panel-console-publish-value {\r
width: 180px;\r
text-align: center; \r
}\r
- \r
+ \r
+ #artist-console-name-value,\r
+ #artist-console-license-value {\r
+ width: 180px;\r
+ text-align:left;\r
+ }\r
+ \r
/* Comic Reader\r
--------------------------------------------------------------------------------------*/\r
#comic-reader-wrapper {}\r
-webkit-box-shadow: 0 4px 9px #333;\r
filter:progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=180,strength=9);\r
}\r
- .menu-bar-item,\r
- .menu-bar-item-focus {\r
+ .menubar-item,\r
+ .menubar-item-focus {\r
position: absolute;\r
top: 0;\r
width: 80px;\r
color: #666;\r
+ overflow: hidden;\r
+ height: 24.1pt;\r
+ line-height: 24.1pt;\r
+ padding-left: 0.6em;\r
+ font-size: 11pt; \r
+ }\r
+ .menubar-item-focus {\r
+ background-color: #161;\r
+ color: #eee;\r
}\r
- .menu-bar-item div,\r
- .menu-bar-item-focus div {\r
- cursor: pointer;\r
- overflow: hidden;\r
- height: 24.1pt;\r
- line-height: 24.1pt;\r
- padding-left: 0.6em;\r
- font-size: 11pt;\r
- }\r
- .menu-bar-item-focus div {\r
- background-color: #66f;\r
- color: #eee;\r
- }\r
- .menu-bar-item ul {\r
- display: none;\r
- }\r
- .menu-bar-item-focus ul {\r
+ .menubar-option-box {\r
position: absolute;\r
list-style: none;\r
top: 24.1pt;\r
width: 200px;\r
margin: 0;\r
padding: 0;\r
- background-color: #fff;\r
+ background-color: #f5f5f5;\r
color: #666;\r
border: 1px solid #ccc;\r
box-shadow: 1px 4px 9px #333;\r
-webkit-box-shadow: 1px 4px 9px #333;\r
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9);\r
}\r
- .menu-bar-item-focus li {\r
- display: block;\r
- cursor: pointer;\r
- width: 200px;\r
- height: 24.1pt;\r
- line-height: 24.1pt;\r
- }\r
- .menu-bar-item-focus li.disabled {\r
- cursor: default;\r
+ .menubar-option-box-hover {\r
+ background-color: #fff;\r
+ }\r
+ .menubar-option-box div {\r
+ position: relative;\r
+ display: block;\r
+ width: 200px;\r
+ height: 24.1pt;\r
+ line-height: 24.1pt;\r
+ border-style: none;\r
+ border-width: 0 0 1px;\r
+ border-color: #ccc; \r
+ } \r
+ .menubar-option-disabled {\r
+ color: #ddd !important;\r
+ } \r
+ .menubar-option-hover {\r
+ background-color: #161 !important;\r
+ color: #eee !important;\r
}\r
- .menu-bar-item-focus a,\r
- .menu-bar-item-focus a:link,\r
- .menu-bar-item-focus a:visited {\r
- color: #666;\r
- position: relative;\r
+ .menubar-option-hover * {\r
+ color: #eee !important;\r
+ }\r
+ .menubar-option-box span {\r
+ position: absolute;\r
+ top: 0;\r
+ left: 10px;\r
display: block;\r
- width: 200px;\r
- height: 24.1pt;\r
- line-height: 24.1pt;\r
- *cursor: pointer;\r
+ font-size: 11pt;\r
+ font-weight: bold;\r
+ width: 120px;\r
+ overflow: hidden;\r
}\r
- .menu-bar-item-focus a:hover {\r
- color: #333;\r
- background-color: #ccf;\r
- text-decoration: none;\r
- *cursor: pointer;\r
- } \r
- .menu-bar-item-focus li.disabled a,\r
- .menu-bar-item-focus li.disabled a:link,\r
- .menu-bar-item-focus li.disabled a:visited,\r
- .menu-bar-item-focus li.disabled a:active,\r
- .menu-bar-item-focus li.disabled a:hover {\r
- color: #999;\r
- background-color: #fff;\r
- *cursor: default;\r
+ .menubar-option-box kbd {\r
+ position: absolute;\r
+ top: 0;\r
+ right: 10px;\r
+ display: block;\r
+ font-size: 8pt;\r
+ color: #999;\r
+ width: 60px;\r
+ overflow: hidden;\r
}\r
- .menu-bar-item-focus span {\r
- position: absolute;\r
- top: 0;\r
- left: 10px;\r
- display: block;\r
- font-size: 11pt;\r
- font-weight: bold;\r
- width: 120px;\r
- overflow: hidden;\r
- }\r
- .menu-bar-item-focus kbd {\r
- position: absolute;\r
- top: 0;\r
- left: 140px;\r
- display: block;\r
- font-size: 8pt;\r
- color: #999;\r
- width: 60px;\r
- overflow: hidden;\r
- }\r
- .menu-bar-item-focus li.separator {\r
- width: 200px;\r
- height: 0;\r
- line-height: 0;\r
- border-top: 1px solid #ccc;\r
- margin: 0;\r
- padding: 0;\r
- }\r
\r
/* whiteGlass\r
--------------------------------------------------------------------------------------*/ \r
border: 2px solid #333;\r
}\r
\r
- /* mouse-operation-catcher\r
- --------------------------------------------------------------------------------------*/ \r
- #mouse-operation-catcher {\r
- position: absolute;\r
- top: 0;\r
- left: 0;\r
- width: 100%;\r
- height: 100%; /* 100% don't work for ie6, so ie6 need to set height as 'XXpx' by js */\r
- }\r
- .pettanr-ActiveX-enabled #mouse-operation-catcher {\r
- background-color: #fff;\r
- filter: alpha( opacity=0 );\r
- -ms-filter: alpha( opacity=0 );\r
- }\r
- /*\r
- * ie では、背景を設定しないと、 mousemove が働かない。\r
- * activeX 有効の場合は背景を着色して filter で透明に。\r
- * activeX 無効の場合は透明 gif を使用\r
- * background: url(4x4.gif) fixed repeat;\r
- */\r
- .pettanr-ActiveX-disabled #mouse-operation-catcher {\r
- background: url( "../images/opacity0.gif" ) fixed repeat;\r
- }\r
- \r
- \r
/* comic-element\r
--------------------------------------------------------------------------------------*/\r
#comic-element-container {\r
--------------------------------------------------------------------------------------*/ \r
#comic-element-resizer-container {\r
position: absolute;\r
+ }\r
+ #comic-element-resizer-container-inner {\r
+ position: absolute;\r
+ top: 9px;\r
+ left: 9px;\r
border: 1px solid #999;\r
}\r
.comic-element-resizer {\r
--------------------------------------------------------------------------------------*/\r
#comic-element-consol-wrapper {\r
position: absolute;\r
+ bottom: 0;\r
+ left: 0;\r
}\r
- #image-element-consol {\r
- width: 50px;\r
- overflow: auto;\r
+ #comic-element-consol-container {\r
+ background: transparent url( "../images/black_50pct.png" ) repeat 0 0;\r
+ padding: 0.5em;\r
}\r
- #text-element-consol {\r
- width: 75px;\r
- overflow: auto;\r
+ .comic-element-consol-container-hover {\r
+ background: #000 !important;\r
}\r
- \r
- #change-image-button,\r
- #layer-back-button,\r
- #layer-forward-button,\r
- #delete-image-button,\r
- #edit-text-button,\r
- #change-text-style-button,\r
- #hide-text-tail-button,\r
- #back-text-button,\r
- #forward-text-button,\r
- #delete-text-button {\r
- text-indent: -9999px;\r
- width: 25px;\r
- height: 25px;\r
- line-height: 25px;\r
- float: left;\r
- background-image: url('../images/sprite.gif');\r
- background-repeat: no-repeat;\r
- background-position: 0 0;\r
- cursor: pointer;\r
- }\r
- #hide-text-tail-button {\r
- background-position: -30px -30px;\r
- }\r
- #change-image-button,\r
- #change-text-style-button {\r
- background-position: -30px 0;\r
- } \r
- #layer-back-button,\r
- #back-text-button {\r
- background-position: -60px 0;\r
- }\r
- #layer-forward-button,\r
- #forward-text-button {\r
- background-position: -60px -30px;\r
- }\r
- #delete-image-button,\r
- #delete-text-button {\r
- background-position: 0 -30px;\r
- }\r
- \r
- .console-out #comic-element-consol-wrapper-when-out {\r
- padding: 5px;\r
- background-color: #333;\r
- }\r
- .console-out #comic-element-consol-tail {\r
- border-width: 0 5px 10px 5px;\r
- border-color: transparent transparent #333 transparent;\r
- _border-color: #fff #fff #333 #fff;\r
- border-style: solid;\r
- width: 0;\r
- height: 0;\r
- font-size: 0;\r
- line-height: 0;\r
+ \r
+ #comic-element-consol-pushout-wrapper {\r
+ display: none;\r
position: absolute;\r
- top: -10px;\r
- left: 50%;\r
+ width: 250px;\r
+ \r
}\r
+ #comic-element-consol-pushout-inner {\r
+ border: 1px solid #999;\r
+ }\r
+ .satellite-left #comic-element-consol-pushout-inner {\r
+ top: 0;\r
+ left: 0;\r
+ }\r
\r
+ #comic-element-consol-pushout-tail {\r
+ border-style: solid;\r
+ width: 0;\r
+ height: 0;\r
+ font-size: 0;\r
+ line-height: 0;\r
+ position: absolute;\r
+ }\r
+ .satellite-left #comic-element-consol-pushout-tail {\r
+ border-width: 5px 0 5px 10px;\r
+ border-color: transparent transparent transparent #999;\r
+ _border-color: #fff #fff #fff #999;\r
+ top: 50%;\r
+ right: 0;\r
+ }\r
+ .satellite-right #comic-element-consol-pushout-tail {\r
+ border-width: 5px 10px 5px 0;\r
+ border-color: transparent #999 transparent transparent;\r
+ _border-color: #fff #999 #fff #fff;\r
+ top: 50%;\r
+ left: -10px;\r
+ }\r
+ .satellite-top #comic-element-consol-pushout-tail {\r
+ border-width: 10px 5px 0 5px;\r
+ border-color: #333 transparent transparent transparent;\r
+ _border-color: #333 #fff #fff #fff;\r
+ bottom: -10px;\r
+ left: 50%;\r
+ }\r
+ .satellite-bottom #comic-element-consol-pushout-tail {\r
+ border-width: 0 5px 10px 5px;\r
+ border-color: transparent transparent #333 transparent;\r
+ _border-color: #fff #fff #333 #fff;\r
+ top: -10px;\r
+ left: 50%;\r
+ }\r
+\r
+ \r
+ .comic-element-consol-item {\r
+ float: left;\r
+ width: 70px;\r
+ height: 70px;\r
+ }\r
+ .comic-element-consol-item-small {\r
+ float: left;\r
+ width: 70px;\r
+ height: 35px;\r
+ }\r
+ .comic-element-consol-item div {\r
+ height: 35px;\r
+ }\r
+ .comic-element-consol-item-small .button {\r
+ width: 60px;\r
+ height: 24px;\r
+ line-height: 24px;\r
+ margin-top: 5px;\r
+ margin-left: 5px;\r
+ }\r
+ .comic-element-attribute-label {\r
+ display: inline-block;\r
+ width: 14px;\r
+ line-height: 22px;\r
+ color: #fff;\r
+ text-align: center;\r
+ cursor: pointer;\r
+ }\r
+ .comic-element-attribute-value {\r
+ width: 40px;\r
+ text-align: right;\r
+ }\r
+ \r
+ #comic-element-z-value,\r
+ #comic-element-a-value {\r
+ width: 35px;\r
+ }\r
+ #comic-element-w-percent-value,\r
+ #comic-element-h-percent-value {\r
+ width: 30px;\r
+ }\r
+ \r
+ #comic-element-keep-aspect {\r
+ position: relative;\r
+ top: 24px;\r
+ left: 0;\r
+ width: 12px;\r
+ height: 22px;\r
+ font-size: 22px;\r
+ line-height: 22px;\r
+ border: 1px solid #ccc;\r
+ }\r
+ \r
\r
\r
/* Panel > speach\r
--------------------------------------------------------------------------------------*/\r
.window-wrapper {\r
position: absolute;\r
- top: 10px;\r
- left: 10px;\r
- width: 200px;\r
- height: 200px;\r
+ overflow: hidden;\r
border-bottom: 1px solid #999;\r
background-color: #fff;\r
box-shadow: 1px 4px 9px #333;\r
filter: progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9);\r
}\r
\r
- .window-header,\r
+ .window-header-title,\r
.window-close-button {\r
font-size: 12px;\r
color: #eee;\r
text-align: center;\r
padding-top: 8px;\r
padding-bottom: 6px;\r
+ background-color: #444;\r
+ }\r
+ .window-wrapper-hover .window-header-title {\r
background-color: #333;\r
}\r
.window-close-button {\r
}\r
\r
.window-wrapper,\r
- .window-header {\r
+ .window-header,\r
+ .window-header-title {\r
border-radius: 8px 8px 0 0;\r
-o-border-radius: 8px 8px 0 0;\r
-ms-border-radius: 8px 8px 0 0;\r
-webkit-border-radius: 8px 8px 0 0;\r
}\r
.window-body {\r
- position: relative;\r
+ position: absolute;\r
+ width: 100%;\r
border-right: 1px solid #999;\r
border-left: 1px solid #aaa;\r
*border-left: 1px solid #ccc;\r
\r
/* page contents\r
--------------------------------------------------------------------------------------*/\r
+ .multi-page-container {\r
+ width: 100%;\r
+ }\r
.sidenavi {\r
width: 100px;\r
float: left;\r
}\r
.page-contents {\r
_position: relative; /* for ie6 */\r
- margin-left: 100px;\r
padding: 1em 1em 2em 1em;\r
+ margin-left: 100px;\r
}\r
.page-content {\r
display: none;\r
}\r
\r
- /* Information Window\r
- --------------------------------------------------------------------------------------*/\r
- #comic-element-infomation {\r
- background-color: #fff;\r
- position: absolute;\r
- width: 100%;\r
- }\r
- #comic-element-x, #comic-element-z,\r
- #comic-element-y, #comic-element-a,\r
- #comic-element-w, #comic-element-w-percent,\r
- #comic-element-h, #comic-element-h-percent {\r
- position: absolute;\r
- }\r
- \r
- #comic-element-x,\r
- #comic-element-y,\r
- #comic-element-w,\r
- #comic-element-h {\r
- left: 30px;\r
- }\r
- #comic-element-z,\r
- #comic-element-a {\r
- left: 115px;\r
- }\r
- #comic-element-w-percent,\r
- #comic-element-h-percent {\r
- left: 124px;\r
- }\r
- #comic-element-x, #comic-element-z {\r
- top: 10px;\r
- }\r
- #comic-element-y, #comic-element-a {\r
- top: 40px;\r
- }\r
- #comic-element-w, #comic-element-w-percent {\r
- top: 80px;\r
- }\r
- #comic-element-h, #comic-element-h-percent {\r
- top: 110px;\r
- }\r
- .comic-element-attribute-label {\r
- display: inline-block;\r
- width: 14px;\r
- line-height: 22px;\r
- color: #666;\r
- text-align: center;\r
- cursor: pointer;\r
- }\r
- .comic-element-attribute-value {\r
- width: 40px;\r
- text-align: right;\r
- }\r
- \r
- #comic-element-z-value,\r
- #comic-element-a-value {\r
- width: 35px;\r
- }\r
- #comic-element-w-percent-value,\r
- #comic-element-h-percent-value {\r
- width: 30px;\r
- }\r
- \r
- #comic-element-keep-aspect {\r
- position: absolute;\r
- top: 96px;\r
- left: 100px;\r
- width: 12px;\r
- height: 22px;\r
- font-size: 22px;\r
- line-height: 22px;\r
- border: 1px solid #ccc;\r
- }\r
- \r
/* Background Window\r
--------------------------------------------------------------------------------------*/\r
#bg-pattern,\r
#toolbox-popup-help-button,\r
#toolbox-post-button {\r
position: absolute;\r
- left: 10px;\r
+ left: 9px;\r
width: 90px;\r
- border: 1px outset #999;\r
height: 40px;\r
line-height: 40px;\r
- text-align: center;\r
- cursor: pointer;\r
- background-color: #ccc;\r
- border-radius: 8px;\r
- -o-border-radius: 8px;\r
- -ms-border-radius: 8px;\r
- -moz-border-radius: 8px;\r
- -webkit-border-radius: 8px;\r
}\r
#toolbox-add-image-button {\r
top: 10px; \r
}\r
#toolbox-popup-help-button {\r
width: 35px !important;\r
- left: 65px !important;\r
+ left: 63px !important;\r
}\r
\r
#toolbox-post-button {\r
OSDN Git Service
