diff --git a/fhem/www/pgm2/ios6.js b/fhem/www/pgm2/ios6.js index 17df9bcab..d4c07747d 100644 --- a/fhem/www/pgm2/ios6.js +++ b/fhem/www/pgm2/ios6.js @@ -2,8 +2,7 @@ /* by Sandra Ohmayer */ /* http://www.animeschatten.net */ /* jQuery is required*/ - -$( document ).ready(function() { +$(document).ready(function() { /* /* Style Config */ @@ -14,35 +13,31 @@ $( document ).ready(function() { var switchtomobilemode = 376; var hdrheight = 44; var inputpadding = 251; - /* /* Functions - */ - + */ // Set style height and width var recalculateStyleHeight = function() { var height = window.innerHeight; - $("#menu").height(height-hdrheight); - $("#content").height(height-hdrheight); - $("#right").height(height-hdrheight); + $("#menu").height(height - hdrheight); + $("#content").height(height - hdrheight); + $("#right").height(height - hdrheight); }; - var recalculateStyleWithMenu = function() { var width = $("body").width(); $("body").removeClass("hideMenu"); - if (switchtomobilemode > width) { $("#menu").width(width); $("#content").width(0); $("#right").width(0); $("#content").hide() $("#right").hide(); - $("#hdr input").width(width-inputpadding+menuwidth-logowidth); + $("#hdr input").width(width - inputpadding + menuwidth - logowidth); } else { $("#menu").width(menuwidth); - $("#content").width(width-menuwidth-paddingwidth-1); - $("#right").width(width-menuwidth-paddingwidth-1); - $("#hdr input").width(width-inputpadding); + $("#content").width(width - menuwidth - paddingwidth - 1); + $("#right").width(width - menuwidth - paddingwidth - 1); + $("#hdr input").width(width - inputpadding); $("#content").show() $("#right").show(); } @@ -50,52 +45,59 @@ $( document ).ready(function() { var recalculateStyleWithoutMenu = function() { var width = $("body").width(); $("body").addClass("hideMenu"); - if (switchtomobilemode > width) { - $("#hdr input").width(width-inputpadding+menuwidth-logowidth); - $("#content").width(width-mobilepaddingwidth); - $("#right").width(width-mobilepaddingwidth); + $("#hdr input").width(width - inputpadding + menuwidth - logowidth); + $("#content").width(width - mobilepaddingwidth); + $("#right").width(width - mobilepaddingwidth); } else { - $("#hdr input").width(width-inputpadding); - $("#content").width(width-paddingwidth); - $("#right").width(width-paddingwidth); + $("#hdr input").width(width - inputpadding); + $("#content").width(width - paddingwidth); + $("#right").width(width - paddingwidth); } - $("#menu").width(0); - $("#content").show() $("#right").show(); }; - // Show / Hide menu var toggleMenuOnFHEMIcon = function() { - if ($("body").hasClass("hideMenu")) { - recalculateStyleWithMenu(); - } else { - recalculateStyleWithoutMenu(); - } + if ($("body").hasClass("hideMenu")) { + recalculateStyleWithMenu(); + } else { + recalculateStyleWithoutMenu(); + } }; - - - /* /* DOM manipulation - */ - + */ // init viewport - $('meta[name="viewport"]').attr('content', 'width=device-width, user-scalable=0, initial-scale=1.0'); + $('head').append(''); + + var ismobile = (/iphone|ipod|android|blackberry|opera|mini|windows\sce|palm|smartphone|iemobile/i.test(navigator.userAgent.toLowerCase())); + var istablet = (/ipad|android|android 3.0|xoom|sch-i800|playbook|tablet|kindle/i.test(navigator.userAgent.toLowerCase())); + var isAndroid = function() { + return navigator.userAgent.match(/Android/i); + }; + + + if (ismobile) { + $("body").addClass("isMobile"); + if (isAndroid()) { + $("body").addClass("isAndroidPhone"); + } + } else if(istablet) { + if (isAndroid()) { + $("body").addClass("isAndroidTablet"); + } + } // init height and width recalculateStyleHeight(); - - // hide menu - if($("body").width() < window.innerHeight) { + if ($("body").width() < window.innerHeight) { recalculateStyleWithoutMenu(); } else { recalculateStyleWithMenu(); } - // Logo - add toggle link var parentLink = $("#logo").parent("a"); if (typeof(parentLink.attr("href")) == "undefined") { @@ -104,39 +106,35 @@ $( document ).ready(function() { parentLink.attr("href", "#"); } $("#logo").click(toggleMenuOnFHEMIcon); - /* /* Event Handlers */ - // Resize $(window).resize(function() { recalculateStyleHeight(); - if($("body").width() < window.innerHeight) { + if ($("body").width() < window.innerHeight) { recalculateStyleWithoutMenu(); } else { recalculateStyleWithMenu(); } - }); + }); $(window).bind('orientationchange', function(event) { //alert("orientationchange width: "+window.innerWidth+" height: "+window.innerHeight); recalculateStyleHeight(); - if($("body").width() < window.innerHeight) { + if ($("body").width() < window.innerHeight) { recalculateStyleWithoutMenu(); } else { recalculateStyleWithMenu(); } }); // Touch - Color picker - $(document).on('touchstart', function (e) { + $(document).on('touchstart', function(e) { var container = $("#colorpicker"); - if (!container.is(e.target) // if the target of the click isn't the container... - && container.has(e.target).length === 0 // ... nor a descendant of the container - && !$("input").is(e.target) && container.length > 0) // ... is not an input - { - container.remove(); - } + && container.has(e.target).length === 0 // ... nor a descendant of the container + && !$("input").is(e.target) && container.length > 0) // ... is not an input + { + container.remove(); + } }); - -}); +}); \ No newline at end of file diff --git a/fhem/www/pgm2/ios6touchpadstyle.css b/fhem/www/pgm2/ios6touchpadstyle.css index 8cd85405f..dcd8ffa92 100644 --- a/fhem/www/pgm2/ios6touchpadstyle.css +++ b/fhem/www/pgm2/ios6touchpadstyle.css @@ -1,66 +1,67 @@ +@import ios6Common.css; + +@import ios6dashboard.css; + /* iOS 6 Theme for FHEM */ /* by Sandra Ohmayer */ /* http://www.animeschatten.net */ - -@import url("ios6Common.css"); -@import url("ios6dashboard.css"); - body { - width:100%; + width:100% } /*set standard for view without js*/ -#content, #right { -width: 763px; +#content,#right { + width:763px; /* Firefox */ -width: -moz-calc(100% - 261px); + width:-moz-calc(100% - 261px); /* WebKit */ -width: -webkit-calc(100% - 261px); + width:-webkit-calc(100% - 261px); /* Opera */ -width: -o-calc(100% - 261px); + width:-o-calc(100% - 261px); /* Standard */ -width: calc(100% - 261px); + width:calc(100% - 261px) } -#content, #menu, #right { +#content,#menu,#right { /*old*/ -height: 704px; + height:704px; /* Firefox */ -height: -moz-calc(100vh - 44px); + height:-moz-calc(100vh - 44px); /* WebKit */ -height: -webkit-calc(100vh - 44px); + height:-webkit-calc(100vh - 44px); /* Opera */ -height: -o-calc(100vh - 44px); + height:-o-calc(100vh - 44px); /* Standard */ -height: calc(100vh - 44px); + height:calc(100vh - 44px) } + #hdr input { -width: 80%; + width:80% } /*hideMenu toggle*/ -.hideMenu #content, .hideMenu #right { -width: 964px; +.hideMenu #content,.hideMenu #right { + width:964px; /* Firefox */ -width: -moz-calc(100% - 60px); + width:-moz-calc(100% - 60px); /* WebKit */ -width: -webkit-calc(100% - 60px); + width:-webkit-calc(100% - 60px); /* Opera */ -width: -o-calc(100% - 60px); + width:-o-calc(100% - 60px); /* Standard */ -width: calc(100% - 60px); + width:calc(100% - 60px) } - -.SVGplot{ - text-align:center; +.SVGplot { + text-align:center } + .SVGplot embed { - -o-transition:scale(-o-calc(100vw - 260px),100px); - -ms-transition:scale(c-ms-alc(100vw - 260px),100px); - -moz-transition:scale(-moz-calc(100vw - 260px),100px); - -webkit-transition:scale(-webkit-calc(100vw - 260px),100px); - transition:scale(calc(100vw - 260px),100px); + -o-transition:scale(-o-calc(100vw - 260px),100px); + -ms-transition:scale(c-ms-alc(100vw - 260px),100px); + -moz-transition:scale(-moz-calc(100vw - 260px),100px); + -webkit-transition:scale(-webkit-calc(100vw - 260px),100px); + transition:scale(calc(100vw - 260px),100px) } /*iPhone Skalierung*/ @@ -70,19 +71,21 @@ and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) { body { -width:320px; + width:320px } -#content, #right { -padding: 0px 10px 0px 10px !important; + +#content,#right { + padding:0 10px!important } } + /* iPhone < 5(landscape) ----------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) { body { -width:480px; + width:480px } } @@ -92,60 +95,61 @@ and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) { body { -width:320px; + width:320px } -#content, #right { -padding: 0px 10px 0px 10px !important; + +#content,#right { + padding:0 10px!important } } + /* iPhone 5(landscape) ----------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) { body { -width:568px; + width:568px } } /* iPhone 6(portrait) ----------- */ @media only screen -and (min-device-width : 375px) -and (max-device-width : 667px) +and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : portrait) { body { -width:375px; + width:375px } -#content, #right { -padding: 0px 10px 0px 10px !important; + +#content,#right { + padding:0 10px!important } } + /* iPhone 6(landscape) ----------- */ @media only screen -and (min-device-width : 375px) -and (max-device-width : 667px) +and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape) { body { -width:667px; + width:667px } } /* iPhone 6+(portrait) ----------- */ @media only screen -and (min-device-width : 414px) -and (max-device-width : 736px) +and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : portrait) { body { -width:414px; + width:414px } } + /* iPhone 6+(landscape) ----------- */ @media only screen -and (min-device-width : 414px) -and (max-device-width : 736px) +and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : landscape) { body { -width:736px; + width:736px } } @@ -156,7 +160,7 @@ and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { body { -width:1024px; + width:1024px } } @@ -166,610 +170,659 @@ and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { body { -width:768px; + width:768px } } +/* Android Phone Devices */ +@media only screen +and (orientation : portrait) { +.isAndroidPhone { + width:360px +} +.isAndroidTablet { + width:1080px; +} +} + +@media only screen +and (orientation : landscape) { +.isAndroidPhone { + width:640px +} +.isAndroidTablet { + width:1920px; +} +} + +.isMobile { + background-color:#e0e3e8; + background:#e0e3e8; +} + .hideMenu #menu { - display:none; + display:none } -html, body { -margin: 0px; -padding: 0px; -font: normal 14px Helvetica, Sans-serif; -text-decoration:none; -color: #385487; -font-weight:normal; - +html,body { + margin:0; + padding:0; + font:normal 14px Helvetica,Sans-serif; + text-decoration:none; + color:#385487; + font-weight:400 } body { -background-color: #000000; -background: #000000; + background-color:#000; + background:#000 } -a { -color:#000000; -font-weight:bold; -text-decoration:none; } +a { + color:#000; + font-weight:700; + text-decoration:none +} a:hover { -cursor:pointer; -color:#777777; + cursor:pointer; + color:#777 } -img { border-style:none; } - -div.dist { padding-top:0.3em; } -button.dist { margin:10px; background:transparent; border:0px; cursor:pointer; } - -textarea, select, input { -background: #f7f7f7; -border-radius: 25px; -border:1px solid #d4d7db; -border-bottom-color:#c6c8cd; -background-color:#f7f7f7; -padding-left: 1.5em; -margin:7px; -outline: none; --moz-box-shadow: 0px 1px #f7f7f7, inset 0px 1px 1px #b6b8bd, inset 0px -2px 2px #ffffff; --webkit-box-shadow: 0px 1px #f7f7f7, inset 0px 1px 1px #b6b8bd, inset 0px -2px 2px #ffffff; -box-shadow: 0px 1px #f7f7f7, inset 0px 1px 1px #b6b8bd, inset 0px -2px 2px #ffffff; +img { + border-style:none } -textarea, input[type="text"] { -background-color:#ffffff; --webkit-appearance: none; -width:90%; + +div.dist { + padding-top:.3em } + +button.dist { + margin:10px; + background:transparent; + border:0; + cursor:pointer +} + +textarea,select,input { + background:#f7f7f7; + border-radius:25px; + border:1px solid #d4d7db; + border-bottom-color:#c6c8cd; + background-color:#f7f7f7; + padding-left:1.5em; + margin:7px; + outline:none; + -moz-box-shadow:0 1px #f7f7f7,inset 0 1px 1px #b6b8bd,inset 0 -2px 2px #fff; + -webkit-box-shadow:0 1px #f7f7f7,inset 0 1px 1px #b6b8bd,inset 0 -2px 2px #fff; + box-shadow:0 1px #f7f7f7,inset 0 1px 1px #b6b8bd,inset 0 -2px 2px #fff +} + +textarea,input[type="text"] { + background-color:#fff; + -webkit-appearance:none; + width:90% +} + input[type="checkbox"] { -border-radius: 2px; -} -select,input[type="submit"],input[type="reset"],input[type="button"] { -width:35%; -min-width:90px; -font: normal 14px Helvetica, Sans-serif; -height:25px; -} -input[type="text"] { -height: 25px; + border-radius:2px } -tr.column td { padding:0; vertical-align:top;} +select,input[type="submit"],input[type="reset"],input[type="button"] { + width:35%; + min-width:90px; + font:normal 14px Helvetica,Sans-serif; + height:25px +} + +input[type="text"] { + height:25px +} + +tr.column td { + padding:0; + vertical-align:top +} /* Documentation */ -h2,h3,h4 { line-height:1.3; -margin-top:1.5em; } -div.dist { padding-top:0.3em; } -button.dist { margin:10px; background:transparent; border:0px; cursor:pointer; } -div.block { border:1px solid gray; background: #F8F8E0; padding:0.7em; } - -pre { white-space: pre-wrap; } -svg { -height:28px; -width:28px; -fill:#7b7b7b; -vertical-align:middle; -margin-right:5px; +h2,h3,h4 { + line-height:1.3; + margin-top:1.5em } -svg.on,svg.FS20_on { fill:orange; } +div.dist { + padding-top:.3em +} -#logo { -position:absolute; top:5px; left:5px; -width:28px; height:28px; -z-index:99; -background-image: url(../images/fhemSVG/system_fhem.svg); +button.dist { + margin:10px; + background:transparent; + border:0; + cursor:pointer +} -background: url(../images/fhemSVG/system_fhem.svg),-moz-linear-gradient(top, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.2) 100%); /* FF3.6+ */ -background: url(../images/fhemSVG/system_fhem.svg),-webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.7)), color-stop(100%,rgba(255,255,255,0.2))); /* Chrome,Safari4+ */ -background: url(../images/fhemSVG/system_fhem.svg),-webkit-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* Chrome10+,Safari5.1+ */ -background: url(../images/fhemSVG/system_fhem.svg),-o-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* Opera 11.10+ */ -background: url(../images/fhemSVG/system_fhem.svg),-ms-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* IE10+ */ -background: url(../images/fhemSVG/system_fhem.svg),linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* W3C */ -filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#33ffffff',GradientType=0 ); /* IE6-9 */ +div.block { + border:1px solid gray; + background:#F8F8E0; + padding:.7em +} +pre { + white-space:pre-wrap +} -background-size: 24px 24px, 28px 8px; -background-position: 2px 2px, 0px 0px; -background-repeat:no-repeat; -border-radius:5px; -border: 2px solid #000000; -background-color:#bbbbbb; +svg { + height:28px; + width:28px; + fill:#7b7b7b; + vertical-align:middle; + margin-right:5px +} + +svg.on,svg.FS20_on { + fill:orange +} + +#logo { + position:absolute; + top:5px; + left:5px; + width:28px; + height:28px; + z-index:99; + background-image:url(../images/fhemSVG/system_fhem.svg); + background:url(../images/fhemSVG/system_fhem.svg),-moz-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* FF3.6+ */ + background:url(../images/fhemSVG/system_fhem.svg),-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,0.7)),color-stop(100%,rgba(255,255,255,0.2))); +/* Chrome,Safari4+ */ + background:url(../images/fhemSVG/system_fhem.svg),-webkit-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* Chrome10+,Safari5.1+ */ + background:url(../images/fhemSVG/system_fhem.svg),-o-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* Opera 11.10+ */ + background:url(../images/fhemSVG/system_fhem.svg),-ms-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* IE10+ */ + background:url(../images/fhemSVG/system_fhem.svg),linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* W3C */ + filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3ffffff',endColorstr='#33ffffff',GradientType=0); +/* IE6-9 */ + background-size:24px 24px,28px 8px; + background-position:2px 2px,0 0; + background-repeat:no-repeat; + border-radius:5px; + border:2px solid #000; + background-color:#bbb } table.room svg { -fill:#FFFFFF; -padding:5px; -width:18px; -height:18px; - -box-shadow: inset 0px 1px 1px rgba(255, 255, 255, 0.7); - -background: -moz-linear-gradient(top, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.2) 100%); /* FF3.6+ */ -background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.7)), color-stop(100%,rgba(255,255,255,0.2))); /* Chrome,Safari4+ */ -background: -webkit-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* Chrome10+,Safari5.1+ */ -background: -o-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* Opera 11.10+ */ -background: -ms-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* IE10+ */ -background: linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); /* W3C */ -filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#33ffffff',GradientType=0 ); /* IE6-9 */ - -background-size: 28px 12px; -background-repeat:no-repeat; -border-radius:5px; -border: 1px solid #666666; -background-color:#4b6dab; + fill:#FFF; + padding:5px; + width:18px; + height:18px; + box-shadow:inset 0 1px 1px rgba(255,255,255,0.7); + background:-moz-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* FF3.6+ */ + background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,0.7)),color-stop(100%,rgba(255,255,255,0.2))); +/* Chrome,Safari4+ */ + background:-webkit-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* Chrome10+,Safari5.1+ */ + background:-o-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* Opera 11.10+ */ + background:-ms-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* IE10+ */ + background:linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); +/* W3C */ + filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3ffffff',endColorstr='#33ffffff',GradientType=0); +/* IE6-9 */ + background-size:28px 12px; + background-repeat:no-repeat; + border-radius:5px; + border:1px solid #666; + background-color:#4b6dab } #saveCheck { -position: absolute; -top: 13px; -right: 7px; -padding-right: 10px; -padding-left: 10px; -padding-top: 2px; -padding-bottom: 2px; -background: #7887A4; -border-radius: 20px; -color: #F4FDFF; + position:absolute; + top:13px; + right:7px; + padding-right:10px; + padding-left:10px; + padding-top:2px; + padding-bottom:2px; + background:#7887A4; + border-radius:20px; + color:#F4FDFF } table.room .changedicon svg { - -background: #02a202; /* Old browsers */ -background: --webkit-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%), --webkit-repeating-linear-gradient(135deg, #02a202 0px,#00b900 2px, #02a202 3px); /* Chrome10+,Safari5.1+ */ - -background: -moz-linear-gradient(top, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.2) 100%), -moz-repeating-linear-gradient(-45deg, rgba(2,162,2,1) 0px, rgba(0,185,0,1) 2px, rgba(2,162,2,1) 3px); /* FF3.6+ */ -background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.7)), color-stop(100%,rgba(255,255,255,0.2))), -webkit-gradient(linear, left top, right bottom, color-stop(0px,rgba(2,162,2,1)), color-stop(2px,rgba(0,185,0,1)), color-stop(3px,rgba(2,162,2,1))); /* Chrome,Safari4+ */ -background: -webkit-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%), -webkit-repeating-linear-gradient(-45deg, rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); /* Chrome10+,Safari5.1+ */ -background: -o-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%), -o-repeating-linear-gradient(-45deg, rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); /* Opera 11.10+ */ -background: -ms-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%), -ms-linear-gradient(-45deg, rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); /* IE10+ */ -background: linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%), repeating-linear-gradient(135deg, rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); /* W3C */ - -filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#33ffffff',GradientType=0 ); /* IE6-9 */ -background-size: 28px 12px, 28px 28px; -background-repeat: no-repeat, repeat; -fill: #F4F4F4; + background:#02a202; +/* Old browsers */ + background:-webkit-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%),-webkit-repeating-linear-gradient(135deg,#02a202 0px,#00b900 2px,#02a202 3px); +/* Chrome10+,Safari5.1+ */ + background:-moz-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%),-moz-repeating-linear-gradient(-45deg,rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); +/* FF3.6+ */ + background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,0.7)),color-stop(100%,rgba(255,255,255,0.2))),-webkit-gradient(linear,left top,right bottom,color-stop(0px,rgba(2,162,2,1)),color-stop(2px,rgba(0,185,0,1)),color-stop(3px,rgba(2,162,2,1))); +/* Chrome,Safari4+ */ + background:-webkit-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%),-webkit-repeating-linear-gradient(-45deg,rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); +/* Chrome10+,Safari5.1+ */ + background:-o-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%),-o-repeating-linear-gradient(-45deg,rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); +/* Opera 11.10+ */ + background:-ms-linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%),-ms-linear-gradient(-45deg,rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); +/* IE10+ */ + background:linear-gradient(top,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%),repeating-linear-gradient(135deg,rgba(2,162,2,1) 0px,rgba(0,185,0,1) 2px,rgba(2,162,2,1) 3px); +/* W3C */ + filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3ffffff',endColorstr='#33ffffff',GradientType=0); +/* IE6-9 */ + background-size:28px 12px,28px 28px; + background-repeat:no-repeat,repeat; + fill:#F4F4F4 } table.room tr.sel a svg { -border-color:#333333; -background-color:#111111; + border-color:#333; + background-color:#111 } #hdr { -float:right; -z-index:98; -position:relative; top:0px; left:0px; -width:100%; -height: 44px; -background-image: -webkit-gradient( -linear, -left top, -left bottom, -color-stop(0, #6C6C6C), -color-stop(0.02, #505050), -color-stop(0.96, #1B1B1C), -color-stop(0.98, #232323), -color-stop(1, #000000) -); -background-image: -o-linear-gradient(bottom, #6C6C6C 0%, #505050 2%, #1B1B1C 96%, #232323 98%, #000000 100%); -background-image: -moz-linear-gradient(bottom, #6C6C6C 0%, #505050 2%, #1B1B1C 96%, #232323 98%, #000000 100%); -background-image: -webkit-linear-gradient(top, #6C6C6C 0%, #505050 2%, #1B1B1C 96%, #232323 98%, #000000 100%); -background-image: -ms-linear-gradient(bottom, #6C6C6C 0%, #505050 2%, #1B1B1C 96%, #232323 98%, #000000 100%); -background-image: linear-gradient(to bottom, #6C6C6C 0%, #505050 2%, #1B1B1C 96%, #232323 98%, #000000 100%); - --moz-box-shadow: 0px 1px 4px #b4b6ba; --webkit-box-shadow: 0px 1px 4px #b4b6ba; -box-shadow: 0px 1px 4px #b4b6ba; - -border-radius:5px 5px 0px 0px; + float:right; + z-index:98; + position:relative; + top:0; + left:0; + width:100%; + height:44px; + background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#6C6C6C),color-stop(0.02,#505050),color-stop(0.96,#1B1B1C),color-stop(0.98,#232323),color-stop(1,#000)); + background-image:-o-linear-gradient(bottom,#6C6C6C 0%,#505050 2%,#1B1B1C 96%,#232323 98%,#000 100%); + background-image:-moz-linear-gradient(bottom,#6C6C6C 0%,#505050 2%,#1B1B1C 96%,#232323 98%,#000 100%); + background-image:-webkit-linear-gradient(top,#6C6C6C 0%,#505050 2%,#1B1B1C 96%,#232323 98%,#000 100%); + background-image:-ms-linear-gradient(bottom,#6C6C6C 0%,#505050 2%,#1B1B1C 96%,#232323 98%,#000 100%); + background-image:linear-gradient(to bottom,#6C6C6C 0%,#505050 2%,#1B1B1C 96%,#232323 98%,#000 100%); + -moz-box-shadow:0 1px 4px #b4b6ba; + -webkit-box-shadow:0 1px 4px #b4b6ba; + box-shadow:0 1px 4px #b4b6ba; + border-radius:5px 5px 0 0 } + #hdr input { -margin:0px; -position:relative; -float:right; -right:7px; -height:25px; -border-radius: 2em; -background-color:#2e2e2e; -border: none; -color: #b3b3b3; -padding-left: 1.5em; -outline: none; --moz-box-shadow: 0px -1px #171717, 0px 1px #2e2d2d, inset 0px -2px 2px #494949, inset 0px 1px #272727; --webkit-box-shadow: 0px -1px #171717, 0px 1px #2e2d2d, inset 0px -2px 2px #494949, inset 0px 1px #272727; -box-shadow: 0px -1px #171717, 0px 1px #2e2d2d, inset 0px -2px 2px #494949, inset 0px 1px #272727; -} + margin:0; + position:relative; + float:right; + right:7px; + height:25px; + border-radius:2em; + background-color:#2e2e2e; + border:none; + color:#b3b3b3; + padding-left:1.5em; + outline:none; + -moz-box-shadow:0 -1px #171717,0 1px #2e2d2d,inset 0 -2px 2px #494949,inset 0 1px #272727; + -webkit-box-shadow:0 -1px #171717,0 1px #2e2d2d,inset 0 -2px 2px #494949,inset 0 1px #272727; + box-shadow:0 -1px #171717,0 1px #2e2d2d,inset 0 -2px 2px #494949,inset 0 1px #272727 +} + #hdr table { -width:100%; -margin:0px; -padding: 5px; + width:100%; + margin:0; + padding:5px } -#menu { -position: absolute; -top:44px; -overflow: auto; --webkit-overflow-scrolling: touch; -float: left; -width: 200px; - -background-color: #d7dadf; -} -#menu table { -width: 100%; -border-spacing:0px; -padding:0px; +#menu { + position:absolute; + top:44px; + overflow:auto; + -webkit-overflow-scrolling:touch; + float:left; + width:200px; + background-color:#d7dadf } -#content, #right { -background-color:#e0e3e8; -background:#e0e3e8; -overflow: auto; --webkit-overflow-scrolling: touch; -border-left: 1px solid #000000; -float: right; - -padding: 0px 30px 0px 30px; - +#menu table { + width:100%; + border-spacing:0; + padding:0 } + +#content,#right { + background-color:#e0e3e8; + background:#e0e3e8; + overflow:auto; + -webkit-overflow-scrolling:touch; + border-left:1px solid #000; + float:right; + padding:0 30px +} + #content table { -width:100% !important; + width:100%!important } -#menuScrollArea { -float: left; -} +#menuScrollArea { + float:left +} -#right { margin-top:44px; } +#right { + margin-top:44px +} #console { - font: 11px "Courier New",Courier,monospace; + font:11px "Courier New",Courier,monospace } -#errmsg { -padding:6px; -width: 100%; -color: #ffffff; -font-weight:bold; -position:absolute; -top:5px; -left:225px; -z-index: 99; -text-shadow: 0px 1px #000000; +#errmsg { + padding:6px; + width:100%; + color:#fff; + font-weight:700; + position:absolute; + top:5px; + left:225px; + z-index:99; + text-shadow:0 1px #000 } -.devType, .devType a, .makeTable, .makeTable a { -font-weight:bold; -color:#4c566c; -font-size:16px; -text-shadow: 0px 1px #FFFFFF; -padding:20px 0px 0px 0px; } - -.devType table, .makeTable table { -font-weight:normal; -color:#385487; -font-size:14px; -padding:0px; } - -.devType table a, .makeTable table a { -font-weight:bold; -color:#000000; -font-size:14px; -padding:0px; -} -.devType table a:hover, .makeTable table a:hover { -color:#777777; +.devType,.devType a,.makeTable,.makeTable a { + font-weight:700; + color:#4c566c; + font-size:16px; + text-shadow:0 1px #FFF; + padding:20px 0 0 } -.wide { width:100%; } +.devType table,.makeTable table { + font-weight:400; + color:#385487; + font-size:14px; + padding:0 +} + +.devType table a,.makeTable table a { + font-weight:700; + color:#000; + font-size:14px; + padding:0 +} + +.devType table a:hover,.makeTable table a:hover { + color:#777 +} + +.wide { + width:100% +} .block { -margin-top:5px; -position: relative; -font-size: 14px; + margin-top:5px; + position:relative; + font-size:14px } -table.block input, table.block select { -margin:5px; +table.block input,table.block select { + margin:5px } -table.block { -padding: 0; -border-spacing:0px; - --webkit-border-radius: 7px; --moz-border-radius: 7px; -border-radius:7px; - -border:1px solid #b6b8bd; -border-bottom-color:#b4b7bb; --moz-box-shadow: 0px 1px #fefefe, inset 0px 1px #d7d7d7; --webkit-box-shadow: 0px 1px #fefefe, inset 0px 1px #d7d7d7; -box-shadow: 0px 1px #fefefe, inset 0px 1px #d7d7d7; -background:#f7f7f7; +table.block { + padding:0; + border-spacing:0; + -webkit-border-radius:7px; + -moz-border-radius:7px; + border-radius:7px; + border:1px solid #b6b8bd; + border-bottom-color:#b4b7bb; + -moz-box-shadow:0 1px #fefefe,inset 0 1px #d7d7d7; + -webkit-box-shadow:0 1px #fefefe,inset 0 1px #d7d7d7; + box-shadow:0 1px #fefefe,inset 0 1px #d7d7d7; + background:#f7f7f7 } table.block td { -text-align:left; -vertical-align:middle; + text-align:left; + vertical-align:middle } table.block td { -border-top: 1px solid #fdfdfd; -border-bottom: 1px solid #cbcbcb; + border-top:1px solid #fdfdfd; + border-bottom:1px solid #cbcbcb } + table.block tr:first-child td { -border-top:none; + border-top:none } + table.block tr:last-child td { -border-bottom:none; + border-bottom:none } -.block td:first-child { -padding-left: 10px; -font-weight:bold; +.block td:first-child { + padding-left:10px; + font-weight:700 } -.roomoverview table.block td:first-child { -min-width:50px; +.roomoverview table.block td:first-child { + min-width:50px } -.roomoverview table.block td:nth-child(2) { -min-width:30px; +.roomoverview table.block td:nth-child(2) { + min-width:30px } - table.room { -margin-bottom: 10px; -border-spacing:0px; -padding:0px; -width: 100%; --moz-box-shadow: 0px 1px 2px #ebedee, 0px -1px #b7b9bb; --webkit-box-shadow: 0px 1px 2px #ebedee, 0px -1px #b7b9bb; -box-shadow: 0px 1px 2px #ebedee, 0px -1px #b7b9bb; + margin-bottom:10px; + border-spacing:0; + padding:0; + width:100%; + -moz-box-shadow:0 1px 2px #ebedee,0 -1px #b7b9bb; + -webkit-box-shadow:0 1px 2px #ebedee,0 -1px #b7b9bb; + box-shadow:0 1px 2px #ebedee,0 -1px #b7b9bb } table.block tr { -height: 44px; + height:44px } table.room tr { -background-image: -webkit-gradient( -linear, -right top, -right bottom, -color-stop(0, #F8F9FA), -color-stop(0.02, #EBEDEF), -color-stop(0.04, #E4E6EA), -color-stop(0.96, #E2E5E8), -color-stop(0.98, #D4D7D9), -color-stop(1, #B7B9BB) -); -background-image: -o-linear-gradient(bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%); -background-image: -moz-linear-gradient(bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%); -background-image: -webkit-linear-gradient(top, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%); -background-image: -ms-linear-gradient(bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%); -background-image: linear-gradient(to bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%); -height: 44px; + background-image:-webkit-gradient(linear,right top,right bottom,color-stop(0,#F8F9FA),color-stop(0.02,#EBEDEF),color-stop(0.04,#E4E6EA),color-stop(0.96,#E2E5E8),color-stop(0.98,#D4D7D9),color-stop(1,#B7B9BB)); + background-image:-o-linear-gradient(bottom,#F8F9FA 0%,#EBEDEF 2%,#E4E6EA 4%,#E2E5E8 96%,#D4D7D9 98%,#B7B9BB 100%); + background-image:-moz-linear-gradient(bottom,#F8F9FA 0%,#EBEDEF 2%,#E4E6EA 4%,#E2E5E8 96%,#D4D7D9 98%,#B7B9BB 100%); + background-image:-webkit-linear-gradient(top,#F8F9FA 0%,#EBEDEF 2%,#E4E6EA 4%,#E2E5E8 96%,#D4D7D9 98%,#B7B9BB 100%); + background-image:-ms-linear-gradient(bottom,#F8F9FA 0%,#EBEDEF 2%,#E4E6EA 4%,#E2E5E8 96%,#D4D7D9 98%,#B7B9BB 100%); + background-image:linear-gradient(to bottom,#F8F9FA 0%,#EBEDEF 2%,#E4E6EA 4%,#E2E5E8 96%,#D4D7D9 98%,#B7B9BB 100%); + height:44px } -table.room a, table.block a { -vertical-align: middle; + +table.room a,table.block a { + vertical-align:middle } + table.room a { -padding-left: 5px; -display:block; + padding-left:5px; + display:block } - -table.block tr.sel, table.room tr.sel { -color:#FFFFFF; -text-shadow: 0px -1px #000000; -background-image: -webkit-gradient( -linear, -right top, -right bottom, -color-stop(0, #C0E2FC), -color-stop(0.02, #44AAF8), -color-stop(0.04, #0589F5), -color-stop(0.96, #015DE6), -color-stop(0.98, #0157D8), -color-stop(1, #014BBB), -color-stop(1, #1B72FF) -); -background-image: -o-linear-gradient(bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%); -background-image: -moz-linear-gradient(bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%); -background-image: -webkit-linear-gradient(top, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%); -background-image: -ms-linear-gradient(bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%); -background-image: linear-gradient(to bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%); -} -table.room tr.sel a{ -color:#FFFFFF; -text-shadow: 0px -1px #000000; -} -table.room tr.sel a:hover{ -text-shadow: 0px -1px #333333; +table.block tr.sel,table.room tr.sel { + color:#FFF; + text-shadow:0 -1px #000; + background-image:-webkit-gradient(linear,right top,right bottom,color-stop(0,#C0E2FC),color-stop(0.02,#44AAF8),color-stop(0.04,#0589F5),color-stop(0.96,#015DE6),color-stop(0.98,#0157D8),color-stop(1,#014BBB),color-stop(1,#1B72FF)); + background-image:-o-linear-gradient(bottom,#C0E2FC 0%,#44AAF8 2%,#0589F5 4%,#015DE6 96%,#0157D8 98%,#014BBB 100%,#1B72FF 100%); + background-image:-moz-linear-gradient(bottom,#C0E2FC 0%,#44AAF8 2%,#0589F5 4%,#015DE6 96%,#0157D8 98%,#014BBB 100%,#1B72FF 100%); + background-image:-webkit-linear-gradient(top,#C0E2FC 0%,#44AAF8 2%,#0589F5 4%,#015DE6 96%,#0157D8 98%,#014BBB 100%,#1B72FF 100%); + background-image:-ms-linear-gradient(bottom,#C0E2FC 0%,#44AAF8 2%,#0589F5 4%,#015DE6 96%,#0157D8 98%,#014BBB 100%,#1B72FF 100%); + background-image:linear-gradient(to bottom,#C0E2FC 0%,#44AAF8 2%,#0589F5 4%,#015DE6 96%,#0157D8 98%,#014BBB 100%,#1B72FF 100%) } -table.room a:hover svg { -background-color:#777777; +table.room tr.sel a { + color:#FFF; + text-shadow:0 -1px #000 } -table.room tr.sel a:hover svg { -background-color:#333333; + +table.room tr.sel a:hover { + text-shadow:0 -1px #333 +} + +table.room a:hover svg { + background-color:#777 +} + +table.room tr.sel a:hover svg { + background-color:#333 } .dname { - } .FileLog td:first-child { - font-weight: normal; - width:180px; + font-weight:400; + width:180px } + .FileLog td:nth-child(2) { - width:100px; + width:100px } + /* Widgets */ -.makeTable { -width: 100%; -display:block; -float:left; -clear:left; +.makeTable { + width:100%; + display:block; + float:left; + clear:left } + .textField_widget { -display: block !important; + display:block!important } -.makeSelect { -margin-top:20px; -width: 100%; -display:block; -float:left; -clear:left; -padding: 0px; -border-spacing:0px; +.makeSelect { + margin-top:20px; + width:100%; + display:block; + float:left; + clear:left; + padding:0; + border-spacing:0; + -webkit-border-radius:7px; + -moz-border-radius:7px; + border-radius:7px; + border:1px solid #b6b8bd; + border-bottom-color:#b4b7bb; + -moz-box-shadow:0 1px #fefefe,inset 0 1px #d7d7d7; + -webkit-box-shadow:0 1px #fefefe,inset 0 1px #d7d7d7; + box-shadow:0 1px #fefefe,inset 0 1px #d7d7d7; + background:#f7f7f7 +} --webkit-border-radius: 7px; --moz-border-radius: 7px; -border-radius:7px; +.slider { + margin-top:10px; + display:inline-block; + -webkit-box-sizing:border-box; + -moz-box-sizing:padding-box; + box-sizing:padding-box; + height:9px; + width:120px; + padding:1px; + -webkit-border-radius:4px; + -moz-border-radius:4px; + border-radius:4px; + background-image:-webkit-gradient(linear,left top,left bottom,from(#0a3a86),color-stop(.5,#4c8de7),color-stop(.95,#6babf5),to(#0a3a86)),-webkit-gradient(linear,left top,left bottom,from(#919191),color-stop(.5,#f0f0f0),color-stop(.5,#fff),color-stop(.95,#fff),to(#919191)); + background-image:-moz-linear-gradient(top,#0a3a86,#4c8de7 50%,#6babf5 95%,#0a3a86),-moz-linear-gradient(top,#919191,#f0f0f0 50%,#fff 50%,#fff 95%,#919191); + background-repeat:no-repeat,repeat-x +} -border:1px solid #b6b8bd; -border-bottom-color:#b4b7bb; --moz-box-shadow: 0px 1px #fefefe, inset 0px 1px #d7d7d7; --webkit-box-shadow: 0px 1px #fefefe, inset 0px 1px #d7d7d7; -box-shadow: 0px 1px #fefefe, inset 0px 1px #d7d7d7; -background:#f7f7f7; +.get,.set,.attr { + float:left; + margin-bottom:10px; + margin-top:10px } -.slider { -margin-top:10px; -display: inline-block; --webkit-box-sizing: border-box; --moz-box-sizing: padding-box; -box-sizing: padding-box; -height: 9px; -width: 120px; -padding: 1px; --webkit-border-radius: 4px; --moz-border-radius: 4px; -border-radius: 4px; -background-image: --webkit-gradient(linear, left top ,left bottom, -from(#0a3a86), -color-stop(.5, #4c8de7), -color-stop(.95, #6babf5), -to(#0a3a86)), --webkit-gradient(linear, left top ,left bottom, -from(#919191), -color-stop(.5, #f0f0f0), -color-stop(.5, #fff), -color-stop(.95, #fff), -to(#919191)); -background-image: --moz-linear-gradient(top, -#0a3a86, -#4c8de7 50%, -#6babf5 95%, -#0a3a86), --moz-linear-gradient(top, -#919191, -#f0f0f0 50%, -#fff 50%, -#fff 95%, -#919191); -background-repeat: no-repeat, repeat-x; -} -.get, .set, .attr { - float: left; - margin-bottom: 10px; - margin-top: 10px; -} -.handle { position:relative; --webkit-box-shadow: inset 0px 1px #e8e8e8; --moz-box-shadow: inset 0px 1px #e8e8e8; -box-shadow: inset 0px 1px #e8e8e8; -border: 1px solid #9d9d9d; -color: #666666; -height:15px; -width:18px; -left: 0px; -top: -6px; --webkit-border-radius: 10px; --moz-border-radius: 10px; -border-radius: 10px; -padding:3px 0px 0px 0px; -text-align:center; -font-size:10px; --webkit-tap-highlight-color: transparent; -background-image: -webkit-gradient( -linear, -right top, -right bottom, -color-stop(0, #A6A6A6), -color-stop(1, #FCFCFC) -); -background-image: -o-linear-gradient(bottom, #A6A6A6 0%, #FCFCFC 100%); -background-image: -moz-linear-gradient(bottom, #A6A6A6 0%, #FCFCFC 100%); -background-image: -webkit-linear-gradient(top, #A6A6A6 0%, #FCFCFC 100%); -background-image: -ms-linear-gradient(bottom, #A6A6A6 0%, #FCFCFC 100%); -background-image: linear-gradient(to bottom, #A6A6A6 0%, #FCFCFC 100%); +.handle { + position:relative; + -webkit-box-shadow:inset 0 1px #e8e8e8; + -moz-box-shadow:inset 0 1px #e8e8e8; + box-shadow:inset 0 1px #e8e8e8; + border:1px solid #9d9d9d; + color:#666; + height:15px; + width:18px; + left:0; + top:-6px; + -webkit-border-radius:10px; + -moz-border-radius:10px; + border-radius:10px; + padding:3px 0 0; + text-align:center; + font-size:10px; + -webkit-tap-highlight-color:transparent; + background-image:-webkit-gradient(linear,right top,right bottom,color-stop(0,#A6A6A6),color-stop(1,#FCFCFC)); + background-image:-o-linear-gradient(bottom,#A6A6A6 0%,#FCFCFC 100%); + background-image:-moz-linear-gradient(bottom,#A6A6A6 0%,#FCFCFC 100%); + background-image:-webkit-linear-gradient(top,#A6A6A6 0%,#FCFCFC 100%); + background-image:-ms-linear-gradient(bottom,#A6A6A6 0%,#FCFCFC 100%); + background-image:linear-gradient(to bottom,#A6A6A6 0%,#FCFCFC 100%) } -.handle:hover, .handle.hover { -color:#FCFCFC; -background-image: -webkit-gradient( -linear, -right top, -right bottom, -color-stop(0, #666666), -color-stop(1, #CBCBCB) -); -background-image: -o-linear-gradient(bottom, #666666 0%, #CBCBCB 100%); -background-image: -moz-linear-gradient(bottom, #666666 0%, #CBCBCB 100%); -background-image: -webkit-linear-gradient(top, #666666 0%, #CBCBCB 100%); -background-image: -ms-linear-gradient(bottom, #666666 0%, #CBCBCB 100%); -background-image: linear-gradient(to bottom, #666666 0%, #CBCBCB 100%); + +.handle:hover,.handle.hover { + color:#FCFCFC; + background-image:-webkit-gradient(linear,right top,right bottom,color-stop(0,#666),color-stop(1,#CBCBCB)); + background-image:-o-linear-gradient(bottom,#666 0%,#CBCBCB 100%); + background-image:-moz-linear-gradient(bottom,#666 0%,#CBCBCB 100%); + background-image:-webkit-linear-gradient(top,#666 0%,#CBCBCB 100%); + background-image:-ms-linear-gradient(bottom,#666 0%,#CBCBCB 100%); + background-image:linear-gradient(to bottom,#666 0%,#CBCBCB 100%) } .sysmon table { - border-spacing:0px; - padding:0px; - font-weight:normal; + border-spacing:0; + padding:0; + font-weight:400 } /* next lines are for remotecontrol */ -.rc_body { border-style:solid; border-color:gray; -border-width:2px; padding:5px; -background:#C8C8B0; font-size:6px;} -.rc_button { padding: 5px 7px;} -.rc_button img { border-style:solid; border-width:1px; -border-color:transparent; } -.rc_button img:active { border-color: gray; } +.rc_body { + border-style:solid; + border-color:gray; + border-width:2px; + padding:5px; + background:#C8C8B0; + font-size:6px +} + +.rc_button { + padding:5px 7px +} + +.rc_button img { + border-style:solid; + border-width:1px; + border-color:transparent +} + +.rc_button img:active { + border-color:gray +} .colorpicker { - border-color: #4c566c; + border-color:#4c566c } ::-webkit-scrollbar { - width: 7px; + width:7px } + ::-webkit-scrollbar-button { - width: 7px; - height:1px; + width:7px; + height:1px } + ::-webkit-scrollbar-track { - background: #D7DADF; - border: thin solid #C1C4C6; - box-shadow: 0px 0px 3px #dfdfdf inset; - border-radius:10px; + background:#D7DADF; + border:thin solid #C1C4C6; + box-shadow:0 0 3px #dfdfdf inset; + border-radius:10px } + ::-webkit-scrollbar-thumb { - background: #7887A4; - border: thin solid gray; - border-radius:10px; + background:#7887A4; + border:thin solid gray; + border-radius:10px } + ::-webkit-scrollbar-thumb:hover { - background: #777777; + background:#777 } \ No newline at end of file