X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.5.x%2Fstylesheets%2Fsystem.css;h=852f2b88230e969e0c5a6e529fc48188017c3f4f;hb=604668ba9efa027d4bc77fd8020d6b6be55d03e1;hp=7b0e8810901c769e157b13338625c8d97e06882a;hpb=f1a25b2872c7bbe10a16e221131b625cde01f01e;p=pettanr%2FclientJs.git diff --git a/0.5.x/stylesheets/system.css b/0.5.x/stylesheets/system.css index 7b0e881..852f2b8 100644 --- a/0.5.x/stylesheets/system.css +++ b/0.5.x/stylesheets/system.css @@ -1,18 +1,24 @@ -/* VML ( v\:* don't work for ie8(ie8mode)) ---------------------------------------------------------------------------------------*/ - v\:shape, - v\:image { - behavior: url(#default#VML); - display: block; - } +@charset "UTF-8"; + +/* pettanR system.css + * version 0.5.38 + * + * author: + * itozyun + */ /* Reset --------------------------------------------------------------------------------------*/ html, body { margin: 0; padding: 0; + height: 100%; + } + /* この指定がないと ie で Util.getAbsolutePosition が狂う body { font-family: "MS PGothic", "MS Gothic" } */ + body { + font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "MS PGothic", Osaka, "MS Gothic", Gothic, sans-serif; } - + p { text-shadow: #000 0 0 0;/* for Safari */ -moz-opacity: 0.99;/* for Firefox */ @@ -35,9 +41,9 @@ /* remember to define focus styles! */ :focus { outline: 0;} - /* http://honoo-no.com/creators/2008/02/14_211120.html */ + /* http://web.archive.org/web/20100204222112/http://honoo-no.com/creators/2008/02/14_211120.html */ textarea, input { - font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3",sans-serif; + font-family: "MS PGothic", Osaka, "MS Gothic", "ヒラギノ角ゴ Pro W3", sans-serif; } @@ -49,7 +55,30 @@ text-decoration: underline; color: #f60; } - + + /* mouse-operation-catcher + --------------------------------------------------------------------------------------*/ + .mouse-operation-catcher { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; /* 100% don't work for ie6, so ie6 need to set height as 'XXpx' by js */ + } + .pettanr-ActiveX-enabled .mouse-operation-catcher { + background-color: #fff; + filter: alpha( opacity=0 ); + -ms-filter: alpha( opacity=0 ); + } + /* + * ie では、背景を設定しないと、 mousemove が働かない。 + * activeX 有効の場合は背景を着色して filter で透明に。 + * activeX 無効の場合は透明 gif を使用 + * background: url(4x4.gif) fixed repeat; + */ + .pettanr-ActiveX-disabled .mouse-operation-catcher { + background: url( "../images/opacity0.gif" ) fixed repeat; + } /* ClearFix --------------------------------------------------------------------------------------*/ @@ -67,20 +96,65 @@ * html .clearfix { height: 1px; - /*¥*//*/ + /*\*//*/ height: auto; overflow: hidden; /**/ } +/* UIForm +--------------------------------------------------------------------------------------*/ + .uiform-invisible { + position : absolute; + top : 0; + left : 0; + } + .uiform-invisible * { + display : none; + position : absolute; + } + .ui-fileinput-wrapper, + .uiform-file { + border-style: solid; + border-width: 1px; + font-size: 14px; + line-height: 2em; + height: 2em; + border-color: #666 #bbb #ccc #777; + display: block; + color: #333; + padding: 3px; + overflow: hidden; + zoom : 1; + } + .uiform-invisible .ui-fileinput-wrapper input { + opacity : 0.5; + border : 0; + display : block; + position : absolute; + top : -5px; + right : -10px; + font-size : 999px; + line-height : 1em; + color : #fff; + background-color : transparent; + cursor : pointer; + /*padding : 999px;*/ + } + .pettanr-ActiveX-enabled .uiform-invisible .ui-fileinput-wrapper input { + filter: alpha( opacity=50 ); + -ms-filter: alpha( opacity=50 ); + } + /* Button --------------------------------------------------------------------------------------*/ .button { - border: 1px solid; + border-width: 1px; + border-style: solid; + border-color: #ccc #bbb #aaa; background: #E3E3E3; background: -moz-linear-gradient(center top , #F9F9F9, #E3E3E3); background: -webkit-gradient(linear, left top, left bottom, from(#F9F9F9), to(#E3E3E3)); - border-color: #ccc #bbb #aaa; color: #666; font-weight: bold; text-align: center; @@ -94,9 +168,153 @@ -moz-border-radius: 3px; -webkit-border-radius: 3px; } + .button-hover, + .ui-button-hover { + color: #333; + border-color: #999 #888 #777; + } .button-has-focus { border-color: #4D90FE; } + .button-disabled { + background: #f6f6f6; + background: -moz-linear-gradient(center top , #fcfcfc, #f0f0f0); + background: -webkit-gradient(linear, left top, left bottom, from(#fcfcfc), to(#f0f0f0)); + border-color: #eee #ddd #ccc; + color: #ccc; + } + + /* editable-text + --------------------------------------------------------------------------------------*/ + #ui-textinput { + position: absolute; + outline: 0; + padding: 3px 0; + background-color: #aDf0FE; + margin: 0; + border-color: #4D90FE; + } + #ui-textinput, + .editable-text { + border-style: solid; + border-width: 1px; + font-size: 14px; + line-height: 16px; + } + .editable-text { + border-color: #666 #bbb #ccc #777; + display: inline-block; + color: #333; + zoom: 1; + background-color: #fff; + padding: 3px; + } + .ui-inpittext-hover .editable-text { + border-color: #4D90FE; + } + + /* combobox + --------------------------------------------------------------------------------------*/ + .combobox { + display: inline-block; + color: #333; + } + .combobox a, + .combobox a:link, + .combobox a:visited, + .combobox a:hover, + .combobox a:active { + border-style: solid; + border-width: 1px; + border-color: #666 #bbb #ccc #777; + font-size: 14px; + line-height: 16px; + padding: 3px; + color: #333; + text-decoration: none; + display: block; + zoom: 1; + outline: 0; + background-color: #fff; + position: relative; + } + .combobox a:hover { + background-color: #ccf; + } + .combobox a:active { + outline: 0; + } + .combobox-toggle { + position: absolute; + right: 5px; + top: 0; + display: block; + font-family: Arial,Helvetica,sans-serif; + font-size: 12px; + line-height: 20px; + color: #999; + } + .combobox a.combobox-has-focus .combobox-toggle { + color: #4D90FE; + } + .ui-combobox-hover .combobox a { + border-color: #4D90FE; + } + .ui-combobox-hover .combobox-toggle { + color: #4D90FE; + } + + .option-container { + position: absolute; + list-style: none; + top: 30px; + width: 200px; + margin: 0; + padding: 0; + background-color: #fff; + opacity: 0.9; + -moz-opacity: 0.9; + -khtml-opacity: 0.9; + color: #666; + border: 1px solid #ccc; + box-shadow: 1px 4px 9px #333; + -moz-box-shadow: 1px 4px 9px #333; + -webkit-box-shadow: 1px 4px 9px #333; + filter: alpha(opacity=90) progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9); + -ms-filter: alpha(opacity=90) progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=120,strength=9); + } + .option-container li { + display: block; + cursor: pointer; + height: 30px; + line-height: 30px; + } + .option-container a, + .option-container a:link, + .option-container a:visited { + color: #666; + position: relative; + display: block; + padding: 0 10px; + height: 30px; + line-height: 30px; + *cursor: pointer; + } + .option-container a:hover { + color: #333; + background-color: #ccf; + text-decoration: none; + *cursor: pointer; + } + a.combobox-option-current, + a.combobox-option-current:link, + a.combobox-option-current:visited { + color: #e6e6ef; + background-color: #66f; + text-decoration: none; + } + + /* Loading --------------------------------------------------------------------------------------*/ @@ -156,8 +374,11 @@ position: absolute; bottom: 10px; left: 20px; + width: 110px; + overflow: hidden; color: #FFF; font-size: 14px; + line-height: 1.3; font-weight: normal; font-family: Segoe UI,Tahoma,Arial,Verdana,sans-serif; } @@ -212,4 +433,182 @@ -ms-border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; - } \ No newline at end of file + } + + +/*-------------------------------------------------------------------------------------- + * + * Finder + * + -------------------------------------------------------------------------------------*/ + .finder-body { + position: absolute; + overflow: hidden; + } + .finder-container .loading { + background-position: 50% bottom; + } + + .finder-path { + height: 40px; + position: relative; + background-color: #484848; + } + .finder-path div { + position: absolute; + top: 0; + left: 0; + overflow: hidden; + width: 90px; + height: 40px; + font-size: 14px; + line-height: 40px; + padding: 0 0 0 15px; + margin: 0; + color: #eee; + background-image : url( ../images/finder_path_shadow.gif ); + background-position : 0 40px; + background-repeat : repeat-y; + } + .finder-path-hover { + background-color: #66f !important; + background-position : 0 0 !important; + color : #fff; + } + + /* Finder Icon + --------------------------------------------------------------------------------------*/ + .finder-icon { + position: absolute; + left: 0; + height: 74px; + border-bottom: 1px solid #ccc; + overflow: hidden; /* for webkit */ + } + .finder-icon-hover { + background-color: #eee; + } + .finder-icon-modern { + display: table; + table-layout: fixed; + } + .fnder-icon-modern div { + display: table-cell; + vertical-align: middle; + line-height: 1.3em; + } + + .finder-icon-handle { + width: 20px; + height: 74px; + } + + .finder-icon-down { + font-size: 40px; + line-height: 74px !important; + color: #999; + position: absolute; + right: 0; + top: 0; + } + .finder-icon-down-hover { + color: #111; + } + .fnder-icon-modern .finder-icon-filename { + width: 200px; + padding: 5px 10px; + height: 64px; + font-weight: bold; + color: #333; + } + .fnder-icon-modern .finder-icon-summary { + width: 300px; + padding: 5px 10px; + height: 64px; + color: #666; + } + + /* Finder Icon ie7- + --------------------------------------------------------------------------------------*/ + .fnder-icon-ie7 .finder-icon-handle, + .fnder-icon-ie7 .finder-icon-thumbnail { + zoom: 1; + line-height: 1.3em; + } + .finder-icon-cell { + display: inline; + zoom: 1; + } + .finder-icon-vertical-middle-outer { + display: block; + height: 74px; + position: relative; + } + .finder-icon-ie-filename .finder-icon-vertical-middle-outer { + width: 200px; + font-weight: bold; + color: #333; + } + .finder-icon-ie-summary .finder-icon-vertical-middle-outer { + width: 300px; + color: #666; + } + .finder-icon-vertical-middle-inner { + display: block; + position: absolute; + top: 50%; + margin: 0 5px; + } + .fnder-icon-ie7 .finder-icon-filename, + .fnder-icon-ie7 .finder-icon-summary { + position: relative; + top: -50%; + } + + /* File Icon + --------------------------------------------------------------------------------------*/ + .file-icon div { + width: 64px; + height: 74px; + cursor: pointer; + background-repeat: no-repeat; + background-position: 50% 50%; + background-image: url('../images/sprite.gif'); + } + .file-icon .file-type-folder { + background-position: 0 -75px; + } + .file-icon .file-type-album { + } + .file-icon .file-type-author { + background-position: -70px -75px; + } + .file-icon .file-type-comic { + background-position: 0 -145px; + } + .file-icon .file-type-cabinet { + background-position: -70px -145px; + } + .file-icon .file-type-panel { + background-position: 0 -215px; + } + .file-icon .file-type-artist { + background-position: -70px -215px; + } + .file-icon .file-type-balloon { + background-position: 0 -285px; + } + .file-icon .file-type-charactor { + background-position: -70px -285px; + } + .has-thumbnail { + } + + /* Finder Detail + --------------------------------------------------------------------------------------*/ + .finder-detail { + position: absolute; + left: 0; + top: 0; + background-color: #e6e6e6; + } \ No newline at end of file