X-Git-Url: http://git.osdn.jp/view?a=blobdiff_plain;f=0.6.x%2Fcss%2Fxui.css;h=2a3e44f52546fbde35223ee6956cfa9a50119e90;hb=HEAD;hp=96374b9c3907188147f12a9bbc234fc65733dc6c;hpb=17e73f4403429f29ea41c824a8e084489df3ace1;p=pettanr%2FclientJs.git diff --git a/0.6.x/css/xui.css b/0.6.x/css/xui.css index 96374b9..2a3e44f 100644 --- a/0.6.x/css/xui.css +++ b/0.6.x/css/xui.css @@ -13,10 +13,18 @@ height : 100%; overflow : hidden; margin : 0; - padding : 0;/* opera 8 */ + padding : 0; /* opera 8 */ border : 0; } + body { + background : #111; + color : #eee; + } + .js-disabled body { + background : #111 url( "../img/loading.gif" ) 50% 50% no-repeat; + } + .IE5x body, .IE6 body, .IE7 body, @@ -30,17 +38,22 @@ body, textarea { font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; } + .IE5x body, .IE5x textarea, .IE6 body, .IE6 textarea, { - font-family: 'ＭＳ Ｐゴシック',sans-serif; + font-family : 'ＭＳ Ｐゴシック',sans-serif; } -.PageRoot { + +/*------------------------------------------------------------------------------------ + * X.UI + */ +.Root { height : 100%; } -.PageRoot, -.PageRoot div { +.Root, +.Root div { /* 要素は絶対配置される */ position : absolute; top : 0; @@ -52,7 +65,7 @@ /* ブラウザのレイアウト機能による auto なサイズ指定は行わない */ overflow : hidden; border-style : solid; - + border-width : 0; /* border-box がデフォルト box-sizing : border-box; -o-box-sizing : border-box; @@ -63,31 +76,29 @@ /* browser bug fix */ zoom : 1; - word-wrap : break-word; /* IE5.5?5?, Firefox3.5, Chrome1 Opera10.5 Safari1 */ white-space : pre; /* CSS 2.0 */ white-space : pre-wrap; /* CSS 2.1 */ white-space : pre-line; /* CSS 3.0 */ - /* white-space : -pre-wrap; Opera 4-6 */ white-space : -o-pre-wrap; /* Opera 7 */ - white-space : -moz-pre-wrap; /* Mozilla */ - /* white-space : -hp-pre-wrap; HP Printers */ + white-space : -moz-pre-wrap; /* Mozilla */ } -.IE5x .PageRoot, .IE5x .PageRoot div, -.IE6 .PageRoot, .IE6 .PageRoot div, -.IE7 .PageRoot, .IE7 .PageRoot div, { +.IE5x .Root, .IE5x .Root div, +.IE6 .Root, .IE6 .Root div, +.IE7 .Root, .IE7 .Root div, { word-break : break-all; /* ie5+ */ } -.IE .PageRoot, .IE .PageRoot div { +.IE .Root, .IE .Root div { white-space : normal/* ie系では、 float要素へ回り込みする、 white-space の効いているテキストの位置が狂う */ } -* {zoom:1} + /*------------------------------------------------------------------------------------ * mouse-operation-catcher */ - .mouse-operation-catcher { + .mouse-operation-catcher, + .mouse-operation-catcher-scrollFix { position : absolute; top : 0; left : 0; @@ -113,10 +124,6 @@ tap-highlight-color : rgba(0,0,0,0); -webkit-tap-highlight-color : rgba(0,0,0,0); } - .ActiveX .mouse-operation-catcher { - background-color : #fff; - filter : alpha( opacity=0 ); - } /* * ie では、背景を設定しないと、 mousemove が働かない。 * activeX 有効の場合は背景を着色して filter で透明に。 @@ -124,7 +131,21 @@ * background: url(4x4.gif) fixed repeat; */ .mouse-operation-catcher { - background : url( "../img/opacity0.gif" ) fixed repeat; + background : url( "../img/opacity0.gif" ) fixed repeat; + } + + .ActiveX .mouse-operation-catcher { + background : #fff; + filter : alpha( opacity=0 ); + } + + .mouse-operation-catcher-scrollFix { + overflow : scroll; + } + .mouse-operation-catcher-scrollFix div { + width : 300%; + height : 300%; + /* background : url( "../img/grid.gif" ) repeat; */ } /*------------------------------------------------------------------------------------ @@ -178,84 +199,35 @@ /* Scrollbox --------------------------------------------------------------------------------------*/ .ScrollBox-Scroller { - transform : translate( 0, 0 ); - transformOrigin : '0 0'; position : absolute; } - .ScrollBox-Scrollbar-Wrapper-V, - .ScrollBox-Scrollbar-Wrapper-H, - .ScrollBox-Scrollbar-Wrapper-V-withH, - .ScrollBox-Scrollbar-Wrapper-H-withV { - position : absolute; - z-index : 100; - overflow : hidden; - } - .ScrollBox-Scrollbar-Wrapper-V, - .ScrollBox-Scrollbar-Wrapper-V-withH { - width : 7px; - top : 2px; - right : 1px; + .Root .ScrollBox-IndicatorV, + .Root .ScrollBox-IndicatorH { + position : absolute; + overflow : hidden; + background : #000; + /* background : rgba(0,0,0,0.5); IE5.5 ietester でインジケーターに色がつかない、、、*/ } - .ScrollBox-Scrollbar-Wrapper-V { - bottom : 2px; + .Root .ScrollBox-IndicatorV { + top : 0; + right : 0.1em; + left : auto; + width : 0.5em; + } + .Root .ScrollBox-IndicatorH { + top : auto; + bottom : 0.1em; + left : 0; + height : 0.5em; } - .ScrollBox-Scrollbar-Wrapper-V-withH { - bottom : 7px; + .IE4 .ScrollBox-IndicatorH, + .IE5x .ScrollBox-IndicatorH { + line-height : 0.5; } - .ScrollBox-Scrollbar-Wrapper-H, - .ScrollBox-Scrollbar-Wrapper-H-withV { - height : 7px; - bottom : 1px; - left : 2px; - } - .ScrollBox-Scrollbar-Wrapper-H { - right : 2px; - } - .ScrollBox-Scrollbar-Wrapper-H-withV { - right : 7px; - } - .ScrollBox-Scrollbar-Indicator-V, - .ScrollBox-Scrollbar-Indicator-H { - position : absolute; - z-index : 100; - background : #000; - background : rgba(0,0,0,0.5); - border : 1px solid #fff; - border : 1px solid rgba(255,255,255,0.9); - background-clip : padding-box; - -o-background-clip : padding-box; - -ms-background-clip : padding-box; - -moz-background-clip : padding-box; - -khtml-background-clip : padding-box; - -webkit-background-clip : padding-box; - box-sizing : border-box; - -o-box-sizing : border-box; - -ms-box-sizing : border-box; - -moz-box-sizing : border-box; - -khtml-box-sizing : border-box; - -webkit-box-sizing : border-box; - border-radius : 3px; - -o-border-radius : 3px; - -ms-border-radius : 3px; - -moz-border-radius : 3px; - -khtml-border-radius : 3px; - -webkit-border-radius : 3px; - transition-property : transform; - -o-transition-property : -o-transform; - -ms-transition-property : -ms-transform; - -moz-transition-property : -moz-transform; - -khtml-transition-property : -khtml-transform; - -webkit-transition-property : -webkit-transform; - transform: translate(0,0); - -o-transform: translate(0,0); - -ms-transform: translate(0,0); - -moz-transform: translate(0,0); - -khtml-transform: translate(0,0); - -webkit-transform: translate(0,0); - } - .ScrollBox-Scrollbar-Indicator-V { - width:100%; - } - .ScrollBox-Scrollbar-Indicator-H { - height:100%; - } \ No newline at end of file + +.IE8 * { + filter : inherit; +} +[ie8opcityFix] * { + filter : inherit; +}