mirror of
https://github.com/fhem/fhem-mirror.git
synced 2025-03-03 16:56:54 +00:00
ios12: Theme added
ios6: columnspan fixes git-svn-id: https://svn.fhem.de/fhem/trunk@19104 2b470e98-0d58-463d-a4d8-8e2adae1ed80
This commit is contained in:
Blackcat
parent
27029d8952
commit
00933f7ebb
8
fhem/www/pgm2/ios12.js
Normal file
8
fhem/www/pgm2/ios12.js
Normal file
@ -0,0 +1,8 @@
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
/* jQuery is required*/
|
||||
|
||||
var imported = document.createElement('script');
|
||||
imported.src = '/fhem/pgm2/ios12touchpad.js';
|
||||
document.head.appendChild(imported);
|
||||
121
fhem/www/pgm2/ios12Common.css
Normal file
121
fhem/www/pgm2/ios12Common.css
Normal file
@ -0,0 +1,121 @@
|
||||
/* jQuery-UI mods */
|
||||
|
||||
/*.ui-dialog {
|
||||
top: 150px !important;
|
||||
left: 300px !important;
|
||||
}
|
||||
*/
|
||||
|
||||
.ui-corner-all {
|
||||
border-radius: 7px !important;
|
||||
}
|
||||
.ui-widget {
|
||||
}
|
||||
.ui-widget-content {
|
||||
color:inherit !important;
|
||||
}
|
||||
.ui-dialog table {
|
||||
border-spacing:5px!important;
|
||||
margin:0px!important;
|
||||
padding:0px!important;
|
||||
width:100%!important;
|
||||
}
|
||||
|
||||
.ui-dialog .ui-dialog-titlebar { display:none; }
|
||||
.ui-dialog-buttonset .ui-button {
|
||||
color:#FFFFFF !important;
|
||||
text-shadow: 0px -1px #000000 !important;
|
||||
background:none !important;
|
||||
background-color:transparent !important;
|
||||
border:none !important;
|
||||
}
|
||||
.ui-widget-overlay {
|
||||
background:none !important;
|
||||
background-color:#000000 !important;
|
||||
opacity:0.5 !important;
|
||||
}
|
||||
.ui-dialog-buttonpane {
|
||||
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)
|
||||
) !important;
|
||||
background-image: -o-linear-gradient(bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%) !important;
|
||||
background-image: -moz-linear-gradient(bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%) !important;
|
||||
background-image: -webkit-linear-gradient(top, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%) !important;
|
||||
background-image: -ms-linear-gradient(bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%) !important;
|
||||
background-image: linear-gradient(to bottom, #C0E2FC 0%, #44AAF8 2%, #0589F5 4%, #015DE6 96%, #0157D8 98%, #014BBB 100%, #1B72FF 100%) !important;
|
||||
height:44px;
|
||||
border-radius: 0px 0px 10px 10px !important;
|
||||
}
|
||||
.ui-dialog {
|
||||
background:none !important;
|
||||
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)
|
||||
) !important;
|
||||
background-image: -o-linear-gradient(bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%) !important;
|
||||
background-image: -moz-linear-gradient(bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%) !important;
|
||||
background-image: -webkit-linear-gradient(top, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%) !important;
|
||||
background-image: -ms-linear-gradient(bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%) !important;
|
||||
background-image: linear-gradient(to bottom, #F8F9FA 0%, #EBEDEF 2%, #E4E6EA 4%, #E2E5E8 96%, #D4D7D9 98%, #B7B9BB 100%) !important;
|
||||
|
||||
}
|
||||
|
||||
.uzsuSelect.ui-buttonset {
|
||||
display: block !important;
|
||||
margin: 6px 0px !important;
|
||||
}
|
||||
|
||||
.uzsuTimerEntry div:nth-child(2) {
|
||||
display: inline-grid !important;
|
||||
margin: 0px 10px 5px 0px !important;
|
||||
}
|
||||
|
||||
|
||||
.colorpicker_ct .slider { background: url(../jscolor/ct_background.svg); }
|
||||
.colorpicker_ct_mired .slider { background: url(../jscolor/ct_mired_background.svg); }
|
||||
.colorpicker_hue .slider { background: url(../jscolor/hue_background.svg); }
|
||||
.get,.set,.attr { margin-bottom:5px; float:left; }
|
||||
select.svgSrc { width:100px; }
|
||||
select.svgColumn { width:50px; }
|
||||
select.svgRegexp { width:120px; }
|
||||
|
||||
/* jQuery-UI mods */
|
||||
div.ui-dialog div.ui-dialog-titlebar { display:none; }
|
||||
div.ui-widget-content { background:#FFFFE7; }
|
||||
#fwmenu {
|
||||
position: absolute; z-index:1005;
|
||||
text-align:left; max-width:600px;
|
||||
font-weight: normal; font-size: 100%;
|
||||
background:#FFFFE7; border:1px solid #278727;
|
||||
}
|
||||
#fwmenu li a { color:#278727; }
|
||||
|
||||
div#svgmarker {
|
||||
position: absolute; z-index:1005; padding: 6px 10px;
|
||||
text-align:left; max-width:600px;
|
||||
color:black; background:#999;
|
||||
border:1px solid #fff; border-radius:4px;
|
||||
}
|
||||
|
||||
svg.zw_nr .zwBox { stroke:#c0c0c0; stroke-width:2px; fill:#f7f7f7; }
|
||||
svg.zw_nr .zwDongle { stroke:red; stroke-width:2px; fill:#f7f7f7; }
|
||||
svg.zw_nr .zwMargin { stroke:#c0c0c0; stroke-width:1px; fill:none; }
|
||||
svg.zw_nr .zwLine { stroke:#c0c0c0; stroke-width:1px; }
|
||||
svg.zw_nr .zwArrowHead { fill:#c0c0c0; stroke-width:1px; }
|
||||
svg.zw_nr { height:auto; width:auto; margin:0; }
|
||||
415
fhem/www/pgm2/ios12dashboard.css
Normal file
415
fhem/www/pgm2/ios12dashboard.css
Normal file
@ -0,0 +1,415 @@
|
||||
/* Strukture author: svenson08*/
|
||||
/* Edit for */
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
|
||||
a {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #e0e3e8 !important;
|
||||
}
|
||||
|
||||
body.dashboard_fullsize #menuScrollArea {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.dashboard_fullsize #hdr {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.dashboard_fullsize #content {
|
||||
position: inherit !important;
|
||||
overflow: visible !important;
|
||||
float: none !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
padding: 0px !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
#dashboard .dashboard_rowcenter {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dashboard_tabnav {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
ul.dashboard_tabcontent:before{
|
||||
content: "";
|
||||
display: block;
|
||||
height: 2px;
|
||||
width:100%;
|
||||
margin-bottom: -2px;
|
||||
|
||||
|
||||
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e0e3e8+0,f3f3f3+10,f3f3f3+90,e0e3e8+100 */
|
||||
background: #e0e3e8; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #e0e3e8 0%, #f3f3f3 10%, #f3f3f3 90%, #e0e3e8 100%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#e0e3e8), color-stop(10%,#f3f3f3), color-stop(90%,#f3f3f3), color-stop(100%,#e0e3e8)); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(left, #e0e3e8 0%,#f3f3f3 10%,#f3f3f3 90%,#e0e3e8 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(left, #e0e3e8 0%,#f3f3f3 10%,#f3f3f3 90%,#e0e3e8 100%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(left, #e0e3e8 0%,#f3f3f3 10%,#f3f3f3 90%,#e0e3e8 100%); /* IE10+ */
|
||||
background: linear-gradient(to right, #e0e3e8 0%,#f3f3f3 10%,#f3f3f3 90%,#e0e3e8 100%); /* W3C */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e3e8', endColorstr='#e0e3e8',GradientType=1 ); /* IE6-9 */
|
||||
}
|
||||
table.dashboard_tabcontent:before{
|
||||
content: "";
|
||||
display: block;
|
||||
height: 2px;
|
||||
width:100%;
|
||||
margin-bottom: 5px;
|
||||
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e0e3e8+10,d0d0d0+30,d0d0d0+70,e0e3e8+90 */
|
||||
background: #e0e3e8; /* Old browsers */
|
||||
background: -moz-linear-gradient(left, #e0e3e8 10%, #d0d0d0 30%, #d0d0d0 70%, #e0e3e8 90%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(10%,#e0e3e8), color-stop(30%,#d0d0d0), color-stop(70%,#d0d0d0), color-stop(90%,#e0e3e8)); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(left, #e0e3e8 10%,#d0d0d0 30%,#d0d0d0 70%,#e0e3e8 90%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(left, #e0e3e8 10%,#d0d0d0 30%,#d0d0d0 70%,#e0e3e8 90%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(left, #e0e3e8 10%,#d0d0d0 30%,#d0d0d0 70%,#e0e3e8 90%); /* IE10+ */
|
||||
background: linear-gradient(to right, #e0e3e8 10%,#d0d0d0 30%,#d0d0d0 70%,#e0e3e8 90%); /* W3C */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e3e8', endColorstr='#e0e3e8',GradientType=1 ); /* IE6-9 */
|
||||
|
||||
}
|
||||
|
||||
.ui-widget-overlay {background: #000000;opacity: .7;filter: Alpha(Opacity=30);position: fixed;top: 0;left: 0;width: 100%;height: 100%;}
|
||||
.ui-corner-bottom,
|
||||
.ui-corner-top,
|
||||
.ui-corner-left,
|
||||
.ui-corner-right,
|
||||
.ui-corner-all {border-radius: 5px;}
|
||||
|
||||
/* jQuery UI Fix*/
|
||||
#dashboardtabs, #dashboard_tabnav, .dashboard_tab, #dashboard-dialog .ui-widget-header {
|
||||
border: none !important;
|
||||
background: none;
|
||||
}
|
||||
|
||||
/* Dashboard
|
||||
------------------------------------------------------------------------*/
|
||||
.dashboardhidden { height:0px;}
|
||||
#dashboard .dashboard_column { float: left; min-width: 200px; }
|
||||
#dashboard .dashboard_columnhelper { border: 1px dotted #CCCCCC;}
|
||||
#dashboard .dashboard_row {
|
||||
width: 100%;
|
||||
height:auto;
|
||||
min-height: 20px;
|
||||
padding: 0;
|
||||
overflow:inherit;
|
||||
}
|
||||
#dashboard input, #dashboard select {
|
||||
margin:0px;
|
||||
}
|
||||
#dashboard .dashboard_columncenter {height: inherit;}
|
||||
#dashboard .dashboard_content { padding: 0.2em; }
|
||||
#dashboard .ui-widget-content {
|
||||
border: none;
|
||||
}
|
||||
#dashboard .dashboard_widgetheader {
|
||||
background: none;
|
||||
border: none;
|
||||
}
|
||||
#dashboard .ui-widget-content a {
|
||||
/*color: #eeeeee;*/
|
||||
}
|
||||
#dashboard .dashboard_content.table {
|
||||
box-shadow: none !important;
|
||||
border-radius: 0 0 8px 8px !important;
|
||||
border: 1px none #FFFFFF!important;
|
||||
border-left: 1px solid #FFFFFF !important;
|
||||
border-right: 1px solid #FFFFFF !important;
|
||||
border-bottom: 1px solid #FFFFFF !important;
|
||||
}
|
||||
#dashboard .dashboard_button_icon { width: 13px; height: 14px; background-repeat: no-repeat;float: left; background-image: url(../images/default/dashboardicons.png); }
|
||||
#dashboard .dashboard_button_iconplus { margin: 0.1em 0.4em; float: right; background-position: -65px 0px; }
|
||||
#dashboard .dashboard_button_iconminus { margin: 0.1em 0.4em; float: right; background-position: -52px 0px; }
|
||||
#dashboard .dashboard-button, #dashboard .ui-button {
|
||||
width:28px !important;
|
||||
height:28px !important;
|
||||
background-size: 16px 16px!important;
|
||||
background-position: 6px 6px !important;
|
||||
border-radius:5px !important;
|
||||
border: 1px solid #999999 !important;
|
||||
background-color:#f5f5f5 !important;
|
||||
cursor: pointer;
|
||||
background-repeat:no-repeat !important;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
}
|
||||
#dashboard .ui-button {
|
||||
background-color: #f5f5f5 !important;
|
||||
}
|
||||
#dashboard .dashboard-button-defineDetails{
|
||||
right: 10px; top: 0px;
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkY4NjYwOTg0NEJFQzExRTI4MjI3OTFCOEEyNzY2MzE2IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkY4NjYwOTg1NEJFQzExRTI4MjI3OTFCOEEyNzY2MzE2Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6Rjg2NjA5ODI0QkVDMTFFMjgyMjc5MUI4QTI3NjYzMTYiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Rjg2NjA5ODM0QkVDMTFFMjgyMjc5MUI4QTI3NjYzMTYiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7i4cyWAAAAsElEQVR42mJgoCEwA+IPUGxGrKZkIE6AsjOB+D8UZyKJReHTDNOwGoifIPEfAvFGJH4gIQMIYZyuWI3mCm8oRhZfhCvA0pCcvRGLmnVI3klDD9gPaE50gopvRDLMG00NSA8DCw6vcELpX0hifwnFeRrUef+hzsXlhSfYvMCA5GTkQPSAYvTAxQoyyYlGJiQDviOxFwPxCyQ+iL0eh1oUEA7EfniSciySPG0yE8kAIMAAicRYTX3YPyoAAAAASUVORK5CYII=') !important;
|
||||
}
|
||||
#dashboard .dashboard-button-setPosition{
|
||||
right: 44px; top: 0px;
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAYUlEQVR4XtWRUQrAMAhDneyg9mT2ptugHRaCY/FnLJAveWKifCW7AS3Avlj2AmzrFUrDIYhgJNwvN4VcBDwiYC5/CyclBpDDoe2poATGEuegs3AswCUIk/8+pl2K8uE/6ATG4BstrVLVgQAAAABJRU5ErkJggg==') !important;}
|
||||
#dashboard .dashboard-button-setPosition:not(.ui-state-disabled) {background-color: red !important;}
|
||||
#dashboard .dashboard-button-goBack{
|
||||
right: 112px; top: 0px;
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAAZ0lEQVQ4jd3RMQqDQBBA0YekV0wj3v8QNqZTJBEtPY42K9l2p0s+TDHF/zAMf8kTE4aovOPEp1TucGRyE5XXUhnmJJfMCFUKVMp55EuLzfeENhBUY0mRA30kkr/xHQnckQWvaODHuADAUSEXjMLoMwAAAABJRU5ErkJggg==') !important;}
|
||||
#dashboard .dashboard-button-editTab{
|
||||
right: 78px; top: 0px;
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABOklEQVR42o3SPUhCURjG8WPR1tBgU23SEEH0AUFDSURDtFU4FOQSQh9LlDgEUdSiU7QUuSq0RCAIYhTl0JCUIEFLRUQ1NLWIEGX9D74XRPJ4XvjB5V7Oc8597nUpuxnDBDbxWfnAZbG4Ce9w4xmzuLINaEALlrGBRnxjCzs2AWF4MA0vYmjHL7pwbwoYRxz9COABJ9jDG0KmE7Qhh0U5chR9mJSQF1MH+j3PcYcIbuFHM3bRjQ9TwLZ8smGcSuP7yMIn91StgFEcYwDzUpy+d4kU1qt3qwxoRR6rqvyzxKTAFfRgBD+mAF3clJxAF7iAEg7Ri9f/2nYCBmXBkjTdiQPcYA7JWt/aCdDveoFHzOAaR7LrmjJMdYCeL1X+baPSRckmYAgZuS4gLTs/qTrjBHQgiATOUKy30Jk/KjtDEXVEBowAAAAASUVORK5CYII=');}
|
||||
#dashboard .ui-button, #dashboard .ui-button:active {text-decoration: none;}
|
||||
#dashboard .ui-button .ui-button-text {display: block;line-height: normal;}
|
||||
#dashboard .ui-button-text-only .ui-button-text {padding: .4em 1em;}
|
||||
#dashboard .ui-resizable { position: relative; }
|
||||
#dashboard .ui-resizable-handle { position: absolute; font-size: 0.1px; }
|
||||
#dashboard .ui-resizable-se { cursor: se-resize;width: 12px; height: 12px; right: 1px;bottom: 1px; background-image: url('data:image/gif;base64,R0lGODlhEAAQAIABAJOnY////yH5BAEAAAEALAAAAAAQABAAAAIZjI+py+0IwDtx2ktlqI1zDCae9mXGGKZgAQA7');}
|
||||
#dashboard .ui-sortable-placeholder {border: 1px dotted #FFFFFF; visibility: visible !important; height: 25px !important; width: 150px;}
|
||||
#dashboard .block.wide {border-radius: 5px;}
|
||||
#dashboard .dashboard_widgetinner .block .block {border: none; box-shadow: none;}
|
||||
#dashboard .dashboard_tabcontent {width: 100%; padding: 0; margin: 0; }
|
||||
#dashboard .dashboard_widget {border-radius: 8px; float: left;}
|
||||
#dashboard .dashboard_widgethelper {background-color: none; }
|
||||
#dashboard .ui-widget .ui-widget {font-size: 1em; font-family: Arial,Helvetica,sans-serif;}
|
||||
#dashboard .ui-widget-header {
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
color: #8A8A8F;
|
||||
font-size: 13px;
|
||||
padding:10px 0px 0px 3px;
|
||||
text-shadow:none;
|
||||
}
|
||||
#dashboard .ui-helper-clearfix:before,
|
||||
#dashboard .ui-helper-clearfix:after {content: "";display: table;border-collapse: collapse;}
|
||||
#dashboard .ui-helper-clearfix:after {clear: both;}
|
||||
#dashboard .ui-helper-clearfix {min-height: 0;}
|
||||
#dashboard .ui-helper-reset {margin: 0;padding: 0;border: 0;outline: 0;line-height: 2.5;text-decoration: none;font-size: 100%;list-style: none; background: none;}
|
||||
|
||||
#dashboard .ui-tabs {
|
||||
padding: 0px;
|
||||
}
|
||||
#dashboard .ui-tabs .ui-tabs-panel {display: block;border-width: 0;background: none;box-shadow: 0 0 0 0;border-radius: 0; padding: 0;}
|
||||
#dashboard .ui-tabs .ui-tabs-nav {margin: 0;padding: 0.2em 140px 0.2em 0.2em;}
|
||||
#dashboard .ui-tabs .ui-tabs-nav li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
position: relative;
|
||||
top: 0;
|
||||
margin: 1px .2em 0 0;
|
||||
padding: 2px 5px;
|
||||
text-align:center;
|
||||
white-space: pre-line;
|
||||
width:100px;
|
||||
line-height: 1.5;}
|
||||
#dashboard .ui-tabs .ui-tabs-nav li a {padding:0;}
|
||||
#dashboard .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
|
||||
font-size:10px;
|
||||
word-wrap:break-word;
|
||||
margin-bottom: 5px;
|
||||
float: none;
|
||||
}
|
||||
#dashboard .ui-tabs-icon {
|
||||
fill:#FFFFFF;
|
||||
padding:7.5px;
|
||||
width:27px;
|
||||
height:27px;
|
||||
margin: auto;
|
||||
|
||||
background-size: 42px 18px;
|
||||
background-repeat:no-repeat;
|
||||
border-radius:7.5px;
|
||||
display:block;
|
||||
-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(75%, transparent) , to(rgba(250, 250, 250, 0.15)));
|
||||
margin-bottom: 10px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
#dashboard .dashboard_tab .ui-tabs-icon {
|
||||
background-color:#007AFE;
|
||||
}
|
||||
|
||||
#dashboard .ui-widget-header .ui-state-active .ui-tabs-icon {
|
||||
background-color:#444;
|
||||
}
|
||||
#dashboard .ui-widget-header .ui-state-hover .ui-tabs-icon {
|
||||
background-color:#777777;
|
||||
}
|
||||
#dashboard .dashboard_tabnav_hidden{}
|
||||
#dashboard .ui-widget-header .ui-state-default {
|
||||
border: none;
|
||||
background: none;
|
||||
}
|
||||
#dashboard .ui-widget-header .ui-state-active{
|
||||
}
|
||||
#dashboard .ui-state-default a {color: #333333;text-decoration: none;}
|
||||
#dashboard .ui-state-disabled {opacity: .35;filter:Alpha(Opacity=35);}
|
||||
#dashboard .ui-state-active a {color: #444!important;}
|
||||
#dashboard .ui-state-hover {color: #000000;}
|
||||
#dashboard .ui-state-hover a,
|
||||
#dashboard .ui-state-focus a:hover {color: #8A8A8F;}
|
||||
|
||||
/* Dashboard Dialog
|
||||
------------------------------------------------------------------------*/
|
||||
|
||||
#dashboard-dialog {
|
||||
overflow: visible !important;
|
||||
position: absolute;top: 0;left: 0;padding: .2em !important;outline: 0;border: 1px solid #FFFFFF;z-index: 100;
|
||||
display: inline-block !important;
|
||||
}
|
||||
#dashboard-dialog input[type="text"] {
|
||||
min-width:80px !important;
|
||||
width:70% !important;
|
||||
}
|
||||
#dashboard-dialog .ui-dialog-content {padding: 0;}
|
||||
#dashboard-dialog .ui-widget-header {
|
||||
padding: 5px;}
|
||||
#dashboard-dialog .ui-button {display: inline-block;line-height: normal;margin-right: .1em;cursor: pointer;vertical-align: middle;text-align: center;overflow: visible;}
|
||||
#dashboard-dialog .ui-button,
|
||||
#dashboard-dialog .ui-button:hover,
|
||||
#dashboard-dialog .ui-button:active {text-decoration: none;}
|
||||
#dashboard-dialog .ui-button .ui-button-text {display: block;line-height: normal;}
|
||||
#dashboard-dialog .ui-button-text-only .ui-button-text {padding: .4em 1em;}
|
||||
#dashboard-dialog .ui-dialog-buttonpane {
|
||||
padding:5px;
|
||||
}
|
||||
#dashboard-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {float: right;}
|
||||
#dashboard-dialog .ui-helper-clearfix:before,
|
||||
#dashboard-dialog .ui-helper-clearfix:after {content: "";display: table;border-collapse: collapse;}
|
||||
#dashboard-dialog .ui-helper-clearfix:after {clear: both;}
|
||||
#dashboard-dialog .ui-helper-clearfix {min-height: 0;}
|
||||
#dashboard-dialog .ui-helper-reset {margin: 0;border: 0;outline: 0;line-height: 1.3;text-decoration: none;font-size: 100%;list-style: none;}
|
||||
|
||||
#dashboard-dialog .ui-tabs {position: relative;padding: .2em; border: none;}
|
||||
#dashboard-dialog .ui-tabs .ui-tabs-panel {display: block;border-width: 0;background: none;box-shadow: 0 0 0 0;border-radius: 0; padding: 0;}
|
||||
#dashboard-dialog .ui-tabs .ui-tabs-nav {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 5px;
|
||||
}
|
||||
#dashboard-dialog .ui-tabs .ui-tabs-nav li {list-style: none;float: left;position: relative;top: 0;margin: 1px .2em 0 0;padding: 0;}
|
||||
#dashboard-dialog .ui-tabs .ui-tabs-nav .ui-tabs-anchor {float: left;padding: .5em 1em;text-decoration: none;}
|
||||
|
||||
#dashboard-dialog .ui-state-default {border: 1px solid #FFFFFF;background-color: #adadad;font-weight: normal;color: #333333;}
|
||||
#dashboard-dialog .ui-state-default a {color: #333333;text-decoration: none;}
|
||||
#dashboard-dialog .ui-state-disabled {border: 1px solid #444444;background: #333333;font-weight: normal;color: #444444;}
|
||||
#dashboard-dialog .ui-state-active {border: 1px solid #FFFFFF;background: #333333;font-weight: normal;color: #ffffff;}
|
||||
#dashboard-dialog .ui-state-active a {color: #ffffff;text-decoration: none;}
|
||||
#dashboard-dialog .ui-state-hover {border: 1px solid #FFFFFF;font-weight: normal;color: #ffffff;}
|
||||
#dashboard-dialog .ui-state-hover a, #dashboard-dialog .ui-state-hover a:hover {color: #ffffff;text-decoration: none;}
|
||||
|
||||
/* Colorpicker
|
||||
------------------------------------------------------------------------*/
|
||||
.evo-pop.ui-widget-content {-index: 10000;
|
||||
width: 225px;
|
||||
padding: 3px 3px 0;
|
||||
background-color:#fefefe !important;
|
||||
border: 1px #999999 solid;
|
||||
transform: translate(-100px,0px);
|
||||
}
|
||||
.evo-pop-ie.ui-widget-content {z-index: 10000;
|
||||
width: 225px;
|
||||
padding: 3px;
|
||||
background-color:#fefefe !important;
|
||||
border: 1px #999999 solid;
|
||||
|
||||
}
|
||||
.evo-palette td {font-size: 1px;border: solid 1px #c0c0c0;padding: 7px;cursor: pointer;}
|
||||
.evo-palette tr.top td {border-bottom: 0;}
|
||||
.evo-palette tr.in td {border-top: 0;border-bottom: 0;}
|
||||
.evo-palette tr.bottom td {border-top: 0;}
|
||||
.evo-palette div.sep {height: 3px;}
|
||||
.evo-palette,.evo-palette-ie {border-collapse: separate;border-spacing: 4px 0px; *border-collapse: expression('separate', cellSpacing='2px');}
|
||||
.evo-palette th,.evo-palette-ie th {border: 0;padding: 5px 3px;text-align: left;font-weight: normal;background: transparent !important;}
|
||||
.evo-palette-ie td {font-size: 1px;border: solid 1px #c0c0c0;padding: 7px;cursor: pointer;}
|
||||
.evo-palette2,.evo-palette2-ie {margin: auto;border-collapse: collapse;}
|
||||
.evo-palette2 td,.evo-palette2-ie td {font-size: 1px;cursor: pointer;}
|
||||
.evo-palette2 td {padding: 6px 7px;}
|
||||
.evo-palette2-ie td {padding: 5px;}
|
||||
.evo-palcenter {padding: 5px;text-align: center;}
|
||||
.evo-colorind,.evo-colorind-ie,.evo-colorind-ff {border: solid 1px #c3c3c3;width: 20px;height: 20px;float: right; margin-top: 3px;}
|
||||
.evo-colorind {position: relative;top: 2px;}
|
||||
.evo-colorind-ie {position: relative;top: -23px;}
|
||||
.evo-colorbox-ie {font-size: 8px;padding: 3px 9px !important;}
|
||||
.evo-colortxt-ie {position: relative;top: -6px;}
|
||||
.evo-pop:after,.evo-pop-ie:after,.evo-colorind:after,
|
||||
.evo-colorind-ie:after,.evo-colorind-ff:after,.evo-color span:after,
|
||||
.evo-cHist:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;font-size: 0;}
|
||||
.evo-color {width: 94px;padding: 1px 3px 0 4px;}
|
||||
.evo-color div {border: solid 1px #808080;border-right: solid 1px #c0c0c0;border-bottom: solid 1px #c0c0c0;padding: 3px;margin-bottom: 5px;width: 10px;height: 10px;float: left;}
|
||||
.evo-color span {font-size: 15px;margin: 1px 0 4px 3px;float: left;}
|
||||
.evo-sep {height: 10px;font-size: 0;}
|
||||
.evo-more {padding: 4px 5px 4px;font-size: smaller;}
|
||||
.evo-cHist {padding: 3px;}
|
||||
.evo-cHist div {cursor: pointer;border: solid 1px #c0c0c0;padding: 3px;margin: 5px;width: 10px;height: 10px;float: left;}
|
||||
a.evo-hist {margin-left: 6px;}
|
||||
.evo-pointer {cursor: pointer;visibility:hidden;position:absolute;}
|
||||
|
||||
/* Make readingGroups 100% wide */
|
||||
#dashboard td table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#dashboard .dashboard_dev_container > table > tbody > tr > td {
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.dashboard_widgetheader svg {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.dashboard_row .dashboard_widget {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* Small devices */
|
||||
@media screen and (max-width: 480px) {
|
||||
.dashboard_tabnav {
|
||||
position: absolute !important;
|
||||
min-height: 40px;
|
||||
width: 100%;
|
||||
padding: 5px 0;
|
||||
padding-right: 0px !important;
|
||||
z-index: 100000;
|
||||
top: -86px;
|
||||
}
|
||||
#dashboardtabs {
|
||||
margin-top: 86px;
|
||||
position: relative;
|
||||
}
|
||||
.dashboard_tabnav li {
|
||||
display: none; /* hide all <li> items */
|
||||
margin: 0;
|
||||
}
|
||||
.dashboard_tabnav .ui-state-active {
|
||||
display: block; /* show only current <li> item */
|
||||
}
|
||||
.dashboard_tabnav a {
|
||||
display: block;
|
||||
padding: 5px 5px 5px 32px;
|
||||
}
|
||||
.dashboard_tabnav .ui-state-active a {
|
||||
color: #888888 !important;
|
||||
}
|
||||
|
||||
/* on nav hover */
|
||||
.dashboard_tabnav:hover {
|
||||
padding-right: 0px !important;
|
||||
height: 300px;
|
||||
overflow: auto;
|
||||
}
|
||||
.dashboard_tabnav:hover .dashboard-button {
|
||||
visibility: hidden;
|
||||
}
|
||||
.dashboard_tabnav:hover li {
|
||||
display: table-cell;
|
||||
float: none;
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
|
||||
.dashboard_tabnav:hover .ui-state-active {
|
||||
}
|
||||
|
||||
.dashboard .dashboard_widget {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.dashboard_row .dashboard_column {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
5
fhem/www/pgm2/ios12floorplanstyle.css
Normal file
5
fhem/www/pgm2/ios12floorplanstyle.css
Normal file
@ -0,0 +1,5 @@
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
|
||||
@import url("ios12touchpadfloorplanstyle.css");
|
||||
5
fhem/www/pgm2/ios12style.css
Normal file
5
fhem/www/pgm2/ios12style.css
Normal file
@ -0,0 +1,5 @@
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
|
||||
@import url("ios12touchpadstyle.css");
|
||||
43
fhem/www/pgm2/ios12svg_defs.svg
Normal file
43
fhem/www/pgm2/ios12svg_defs.svg
Normal file
@ -0,0 +1,43 @@
|
||||
<!-- will be included in each svg plot -->
|
||||
<defs>
|
||||
<linearGradient id="gr_bg" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#f7f7f7; stop-opacity:1"/>
|
||||
<stop offset="100%" style="stop-color:#f7f7f7; stop-opacity:1"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="gr_0" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#fc3e39; stop-opacity:.6"/>
|
||||
<stop offset="100%" style="stop-color:#fc3e39; stop-opacity:.4"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="gr_1" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#53d769; stop-opacity:.6"/>
|
||||
<stop offset="100%" style="stop-color:#53d769; stop-opacity:.4"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="gr_2" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#157efb; stop-opacity:.6"/>
|
||||
<stop offset="100%" style="stop-color:#157efb; stop-opacity:.4"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="gr_3" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#c34ceb; stop-opacity:.6"/>
|
||||
<stop offset="100%" style="stop-color:#c34ceb; stop-opacity:.4"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="gr_4" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#ff0; stop-opacity:.6"/>
|
||||
<stop offset="100%" style="stop-color:#ff8; stop-opacity:.4"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="gr_5" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#0ff; stop-opacity:.6"/>
|
||||
<stop offset="100%" style="stop-color:#8ff; stop-opacity:.4"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="gr_6" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#000; stop-opacity:.6"/>
|
||||
<stop offset="100%" style="stop-color:#ccc; stop-opacity:.4"/>
|
||||
</linearGradient>
|
||||
|
||||
</defs>
|
||||
73
fhem/www/pgm2/ios12svg_style.css
Normal file
73
fhem/www/pgm2/ios12svg_style.css
Normal file
@ -0,0 +1,73 @@
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
|
||||
.background { fill:#f7f7f7;
|
||||
}
|
||||
|
||||
text {
|
||||
font: normal 10px Helvetica, Sans-serif;
|
||||
fill:#000000;}
|
||||
text.title {
|
||||
font: normal 14px Helvetica, Sans-serif;
|
||||
font-weight:bold;
|
||||
fill:#4c566c;
|
||||
text-shadow: 0px 1px #FFFFFF;
|
||||
}
|
||||
|
||||
text.legend{ cursor:pointer; }
|
||||
text.copy { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
|
||||
text.paste { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
|
||||
|
||||
|
||||
path.SVGplot { stroke:black; fill:none; }
|
||||
polyline.SVGplot { stroke:black; fill:none; }
|
||||
.border { stroke:black; fill:url(#gr_bg);}
|
||||
.vgrid { stroke:gray; stroke-dasharray:2,6;}
|
||||
.hgrid { stroke:gray; stroke-dasharray:2,6;}
|
||||
.pasted { stroke:black; stroke-dasharray:1,1;}
|
||||
|
||||
.SVGplot.l0 { stroke:red; }
|
||||
.SVGplot.l1 { stroke:green; }
|
||||
.SVGplot.l2 { stroke:blue; }
|
||||
.SVGplot.l3 { stroke:magenta; }
|
||||
.SVGplot.l4 { stroke:brown; }
|
||||
.SVGplot.l5 { stroke:black; }
|
||||
.SVGplot.l6 { stroke:olive; }
|
||||
.SVGplot.l7 { stroke:gray; }
|
||||
.SVGplot.l8 { stroke:yellow; }
|
||||
.SVGplot.l0fill { stroke:#f00; fill:url(#gr_0); }
|
||||
.SVGplot.l1fill { stroke:#291; fill:url(#gr_1); }
|
||||
.SVGplot.l2fill { stroke:#00f; fill:url(#gr_2); }
|
||||
.SVGplot.l3fill { stroke:#f0f; fill:url(#gr_3); }
|
||||
.SVGplot.l4fill { stroke:#ff0; fill:url(#gr_4); }
|
||||
.SVGplot.l5fill { stroke:#0ff; fill:url(#gr_5); }
|
||||
.SVGplot.l6fill { stroke:#000; fill:url(#gr_6); }
|
||||
.SVGplot.l0dot { stroke:red; stroke-dasharray:2,4; }
|
||||
.SVGplot.l1dot { stroke:green; stroke-dasharray:2,4; }
|
||||
.SVGplot.l0fill_stripe { stroke:red; fill:url(#gr0_stripe);}
|
||||
.SVGplot.l1fill_stripe { stroke:green; fill:url(#gr1_stripe);}
|
||||
.SVGplot.l0fill_gyr { stroke:red; fill:url(#gr0_gyr);}
|
||||
|
||||
text.SVGplot.l0 { stroke:none; fill:red; }
|
||||
text.SVGplot.l0 { stroke:none; fill:red; }
|
||||
text.SVGplot.l1 { stroke:none; fill:green; }
|
||||
text.SVGplot.l2 { stroke:none; fill:blue; }
|
||||
text.SVGplot.l3 { stroke:none; fill:magenta; }
|
||||
text.SVGplot.l4 { stroke:none; fill:brown; }
|
||||
text.SVGplot.l5 { stroke:none; fill:black; }
|
||||
text.SVGplot.l6 { stroke:none; fill:olive; }
|
||||
text.SVGplot.l7 { stroke:none; fill:gray; }
|
||||
text.SVGplot.l8 { stroke:none; fill:yellow; }
|
||||
text.SVGplot.l0fill { stroke:none; fill:#f00; }
|
||||
text.SVGplot.l1fill { stroke:none; fill:#291; }
|
||||
text.SVGplot.l2fill { stroke:none; fill:#00f; }
|
||||
text.SVGplot.l3fill { stroke:none; fill:#f0f; }
|
||||
text.SVGplot.l4fill { stroke:none; fill:#ff0; }
|
||||
text.SVGplot.l5fill { stroke:none; fill:#0ff; }
|
||||
text.SVGplot.l6fill { stroke:none; fill:#000; }
|
||||
text.SVGplot.l0dot { stroke:none; fill:red; }
|
||||
text.SVGplot.l1dot { stroke:none; fill:green; }
|
||||
text.SVGplot.l0fill_stripe {stroke:none; fill:red; }
|
||||
text.SVGplot.l1fill_stripe {stroke:none; fill:green;}
|
||||
text.SVGplot.l0fill_gyr {stroke:none; fill:red; }
|
||||
308
fhem/www/pgm2/ios12touchpad.js
Normal file
308
fhem/www/pgm2/ios12touchpad.js
Normal file
@ -0,0 +1,308 @@
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
/* jQuery is required*/
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
/*
|
||||
/* Style Config
|
||||
*/
|
||||
var spaltensumme = 200;
|
||||
var menuwidth = 200;
|
||||
var paddingwidth = 60;
|
||||
var mobilepaddingwidth = 20;
|
||||
var logowidth = 28;
|
||||
var switchtomobilemode = 415;
|
||||
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);
|
||||
};
|
||||
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);
|
||||
} else {
|
||||
$("#menu").width(menuwidth);
|
||||
$("#content").width(width - menuwidth - paddingwidth - 1);
|
||||
$("#right").width(width - menuwidth - paddingwidth - 1);
|
||||
$("#hdr input").width(width - inputpadding);
|
||||
$("#content").show()
|
||||
$("#right").show();
|
||||
}
|
||||
};
|
||||
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);
|
||||
} else {
|
||||
$("#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();
|
||||
resetcolumns();
|
||||
calccolumns();
|
||||
} else {
|
||||
recalculateStyleWithoutMenu();
|
||||
resetcolumns();
|
||||
calccolumns();
|
||||
}
|
||||
};
|
||||
|
||||
//Berechnung Spaltenbreite
|
||||
var calccolumns = function() {
|
||||
$("table.block.wide").find("table.block.wide").addClass("notrelevantcount");
|
||||
var tables = $("table.block.wide").not('.notrelevantcount');
|
||||
// Ermitteln der maximalen Spaltenanzahl im Layout
|
||||
var maxlength = 0;
|
||||
var maxtr;
|
||||
tables.each(function() {
|
||||
var tr =$(this).children("tbody").children("tr");
|
||||
tr.each(function(){
|
||||
var td = $(this).children("td");
|
||||
var trlength = 0;
|
||||
td.each(function() {
|
||||
trlength = trlength+$(this).prop("colSpan");
|
||||
});
|
||||
if (trlength > maxlength) {
|
||||
maxlength = trlength;
|
||||
maxtr=$(this);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
// Setzen aller hinteren Spalten auf ein Minimum an Platzbedarf
|
||||
tables.children("tbody").children("tr").each(function() {
|
||||
var trlength = $(this).children("td").length;
|
||||
var diff = 0;
|
||||
if (trlength < maxlength) {
|
||||
diff = maxlength - trlength;
|
||||
}
|
||||
diff++;
|
||||
|
||||
$(this).children("td").css("width", "1%");
|
||||
$(this).children("td").css("white-space", "nowrap");
|
||||
$(this).children("td").first().css("width", "");
|
||||
$(this).children("td").first().css("white-space", "");
|
||||
|
||||
});
|
||||
|
||||
// Ermitteln der maxwidth abhängig vom größten Spaltenelement beginnend bei Spalte 2
|
||||
var i;
|
||||
var maxwidthtd = new Array();
|
||||
for (i = 1; i < maxlength; i++) {
|
||||
maxwidthtd.push(0);
|
||||
var counttr = tables.children("tbody").children('tr').length;
|
||||
for (j=0; j < counttr; j++) {
|
||||
tables.children("tbody").children('tr:eq('+j+')').children('td:eq('+i+')').each(function() {
|
||||
var tdwidth = $(this).innerWidth()/$(this).prop("colSpan")+($(this).prop("colSpan")-1)*14;
|
||||
if (tdwidth > maxwidthtd[i-1]) {
|
||||
maxwidthtd[i-1] = tdwidth;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Anpassen der width der Spalten auf das maxwidth beginnend bei Spalte 2
|
||||
for (i = 1; i < maxlength; i++) {
|
||||
tables.children("tbody").children("tr").children('td:eq('+i+')').css("width",maxwidthtd[i-1]+"px");
|
||||
}
|
||||
|
||||
// Berechnung der gesamten Tabellen width
|
||||
var innertablewidth = -20;
|
||||
if(maxtr) {
|
||||
maxtr.children('td').each(function() {
|
||||
innertablewidth=innertablewidth+$(this).innerWidth();
|
||||
});
|
||||
// Berechnung der hinteren Spalten
|
||||
maxwidthtd.forEach(function(column, index){
|
||||
if(column > 260) {
|
||||
maxwidthtd[index] = 260;
|
||||
}
|
||||
innertablewidth=innertablewidth-column-10;
|
||||
});
|
||||
if (innertablewidth > 750) {
|
||||
innertablewidth = 750;
|
||||
} else if (innertablewidth < 110){
|
||||
innertablewidth = 110;
|
||||
}
|
||||
spaltensumme = innertablewidth;
|
||||
tables.children("tbody").children("tr").each(function() {
|
||||
var trlength = $(this).children("td").length;
|
||||
var diff = 0;
|
||||
if (trlength < maxlength) {
|
||||
diff = maxlength - trlength;
|
||||
}
|
||||
diff++;
|
||||
$(this).children("td").last().attr('colspan',diff);
|
||||
$(this).children("td").css("white-space", "");
|
||||
$(this).children("td").css("width", "");
|
||||
$(this).children("td").first().css("width", innertablewidth);
|
||||
$(this).children("td").first().next().css("width", maxwidthtd[0]);
|
||||
});
|
||||
}
|
||||
$(".fbcalllist-container").find("tr").each(function() {
|
||||
$(this).find("td").last().attr('colspan',1);
|
||||
$(this).find("td").css("width", "");
|
||||
$(this).find("td").css("white-space", "");
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
//Neuberechnung Spaltenbreite
|
||||
var resetcolumns = function() {
|
||||
$("table.block.wide").not('.notrelevantcount').children("tbody").children("tr").each(function() {
|
||||
$(this).children("td").last().attr('colspan',1);
|
||||
$(this).children("td").css("width", "");
|
||||
$(this).children("td").css("white-space", "");
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
var mobiletoggle = function () {
|
||||
if($('body').hasClass("colortoggle")){}else{
|
||||
var counter=0;
|
||||
$( ".colorpicker_widget, .slider_widget" ).each(function(){
|
||||
$( '<div id="toggle_colorpicker'+counter+'" onclick="togglecolorpicker('+counter+')" style="display: table-cell;vertical-align: middle;"><svg class="icon control_plus" data-txt="control_plus" id="colorplus'+counter+'" version="1.0" xmlns="http://www.w3.org/2000/svg" width="468pt" height="474pt" viewBox="0 0 468 474" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,474) scale(0.200000,-0.200000)" stroke="none"> <path d="M1002 2354 c-18 -9 -43 -31 -55 -48 -22 -31 -22 -35 -25 -458 l-3 -428 -397 0 c-444 0 -443 0 -490 -70 -22 -33 -23 -42 -20 -177 l3 -143 38 -37 37 -38 415 -3 415 -3 0 -422 c0 -403 1 -423 20 -455 37 -61 70 -72 210 -72 150 0 182 12 218 80 22 44 22 49 22 457 l0 413 424 0 c422 0 423 0 456 23 57 39 70 76 70 206 0 143 -19 192 -84 222 -38 17 -73 19 -453 19 l-413 0 0 418 c0 459 0 460 -63 506 -25 18 -45 21 -160 24 -107 2 -138 -1 -165 -14z m258 -599 l0 -475 470 0 470 0 0 -100 0 -100 -475 0 -475 0 0 -475 0 -476 -97 3 -98 3 0 473 0 472 -457 0 -458 0 0 100 0 100 457 2 458 3 -4 473 -3 472 106 0 106 0 0 -475z"></path> </g> </svg><svg class="icon control_minus" id="colorminus'+counter+'" data-txt="control_minus" version="1.0" xmlns="http://www.w3.org/2000/svg" width="468pt" height="95pt" viewBox="0 0 468 95" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,95) scale(0.196639,-0.196639)" stroke="none"> <path d="M85 460 c-11 -4 -33 -22 -50 -40 -30 -31 -30 -31 -33 -168 -3 -163 7 -193 79 -230 l44 -22 1077 2 1077 3 28 21 c57 43 68 76 68 214 0 141 -11 176 -68 210 -31 19 -58 20 -1117 19 -597 0 -1094 -4 -1105 -9z m2155 -220 l0 -100 -1055 0 -1055 0 0 93 c0 52 3 97 7 100 3 4 478 7 1055 7 l1048 0 0 -100z"></path> </g> </svg></div>' ).insertBefore( $(this) );
|
||||
$(this).parent().css("white-space", "nowrap");
|
||||
$(this).parent().css("display", "table");
|
||||
$(this).attr('id', 'colorpicker'+counter);
|
||||
$(this).hide();
|
||||
$('#colorminus'+counter).hide();
|
||||
counter++;
|
||||
});
|
||||
$('body').addClass("colortoggle");
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
/* DOM manipulation
|
||||
*/
|
||||
// init viewport
|
||||
$('meta[name="viewport"]').remove();
|
||||
$('head').append('<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />');
|
||||
|
||||
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) {
|
||||
recalculateStyleWithoutMenu();
|
||||
} else {
|
||||
recalculateStyleWithMenu();
|
||||
}
|
||||
|
||||
// Logo - add toggle link
|
||||
var parentLink = $("#logo").parent("a");
|
||||
$(parentLink).unbind("click");
|
||||
if (typeof(parentLink.attr("href")) == "undefined") {
|
||||
parentLink.attr("onclick", "#");
|
||||
} else {
|
||||
parentLink.attr("href", "#");
|
||||
}
|
||||
$("#logo").closest("a").removeAttr("onclick");
|
||||
|
||||
$("#logo").click(toggleMenuOnFHEMIcon);
|
||||
|
||||
/*
|
||||
/* Event Handlers
|
||||
*/
|
||||
// Resize
|
||||
$(window).resize(function() {
|
||||
recalculateStyleHeight();
|
||||
if ($("body").width() < window.innerHeight) {
|
||||
recalculateStyleWithoutMenu();
|
||||
resetcolumns();
|
||||
calccolumns();
|
||||
} else {
|
||||
recalculateStyleWithMenu();
|
||||
resetcolumns();
|
||||
calccolumns();
|
||||
}
|
||||
if (spaltensumme < 200) {
|
||||
mobiletoggle();
|
||||
resetcolumns();
|
||||
calccolumns();
|
||||
}
|
||||
});
|
||||
$(window).bind('orientationchange', function(event) {
|
||||
$(window).trigger('resize');
|
||||
//alert("orientationchange width: "+window.innerWidth+" height: "+window.innerHeight);
|
||||
});
|
||||
// Touch - Color picker
|
||||
$(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();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function triggerResize() {
|
||||
window.dispatchEvent(new Event('resize'));
|
||||
}
|
||||
|
||||
function togglecolorpicker(counter) {
|
||||
$('#colorpicker'+counter).toggle('fast');
|
||||
$('#colorminus'+counter).toggle();
|
||||
$('#colorplus'+counter).toggle();
|
||||
}
|
||||
function togglecolorpickerct(counter) {
|
||||
$('#colorpicker_ct_mired'+counter).toggle('fast');
|
||||
$('#colorctminus'+counter).toggle();
|
||||
$('#colorctplus'+counter).toggle();
|
||||
}
|
||||
|
||||
window.addEventListener("load",triggerResize,false);
|
||||
220
fhem/www/pgm2/ios12touchpadfloorplanstyle.css
Normal file
220
fhem/www/pgm2/ios12touchpadfloorplanstyle.css
Normal file
@ -0,0 +1,220 @@
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
|
||||
@import url("ios12touchpadstyle.css");
|
||||
|
||||
#backimg {
|
||||
width: 823px !important;
|
||||
/* Firefox */
|
||||
width: -moz-calc(100% - 201px) !important;
|
||||
/* WebKit */
|
||||
width: -webkit-calc(100% - 201px) !important;
|
||||
/* Opera */
|
||||
width: -o-calc(100% - 201px) !important;
|
||||
/* Standard */
|
||||
width: calc(100% - 201px) !important;
|
||||
}
|
||||
|
||||
#fpmenu.fp_arrange {
|
||||
position:fixed; bottom:10px; left:7px;
|
||||
}
|
||||
/*iPad Skalierung*/
|
||||
/* iPads (landscape) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 768px)
|
||||
and (max-device-width : 1024px)
|
||||
and (orientation : landscape) {
|
||||
body {
|
||||
width:1024px;
|
||||
}
|
||||
#menu {
|
||||
height: 748px;
|
||||
}
|
||||
#backimg {
|
||||
width:823px !important;
|
||||
height: 748px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* iPads (portrait) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 768px)
|
||||
and (max-device-width : 1024px)
|
||||
and (orientation : portrait) {
|
||||
body {
|
||||
width:768px;
|
||||
}
|
||||
#menu {
|
||||
height: 1004px;
|
||||
}
|
||||
#backimg {
|
||||
width:567px !important;
|
||||
height: 1004px !important;
|
||||
}
|
||||
}
|
||||
body {
|
||||
font: normal 9px "Segoe UI","Helvetica Neue";
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
right top,
|
||||
color-stop(0.2, #D7DADF),
|
||||
color-stop(0.2, #000000)
|
||||
);
|
||||
background-image: -o-linear-gradient(right, #D7DADF 20%, #000000 20%);
|
||||
background-image: -moz-linear-gradient(right, #D7DADF 20%, #000000 20%);
|
||||
background-image: -webkit-linear-gradient(to right, #D7DADF 20%, #000000 20%);
|
||||
background-image: -ms-linear-gradient(right, #D7DADF 20%, #000000 20%);
|
||||
background-image: linear-gradient(to right, #D7DADF 20%, #000000 20%);
|
||||
background-position: 0 0;
|
||||
background-size: 1000px 2500px;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
|
||||
body[id~=Media] { background-color: #A5A5A5;
|
||||
font-family:Arial, sans-serif;
|
||||
font-size:9px;
|
||||
background-image:url(../icons/Media.bak);
|
||||
background-repeat:no-repeat; }
|
||||
|
||||
#backimg {
|
||||
position:absolute; top:0px; left:201px;
|
||||
}
|
||||
#menu.floorplan {
|
||||
overflow: auto;
|
||||
width: 200px;
|
||||
position:absolute;
|
||||
top:0px;
|
||||
font-size:14px;
|
||||
margin:0px;
|
||||
padding:0px;
|
||||
background-color:transparent;
|
||||
border-right: 1px solid #CACACE;
|
||||
}
|
||||
#menu.floorplan a {
|
||||
padding-left: 7px;
|
||||
display:block;
|
||||
vertical-align: middle;
|
||||
font-weight:600;
|
||||
}
|
||||
|
||||
#menu.floorplan table {
|
||||
margin-bottom: 10px;
|
||||
border-spacing:0px;
|
||||
padding:0px;
|
||||
width: 100%;
|
||||
-moz-box-shadow: 0 -1px #E1E1E4;
|
||||
-webkit-box-shadow: 0 -1px #E1E1E4;
|
||||
box-shadow: 0 -1px #E1E1E4;
|
||||
}
|
||||
|
||||
#menu.floorplan tr {
|
||||
background-image:-webkit-gradient(linear,right top,right bottom,color-stop(0,#FFFFFF),color-stop(0.02,#FFFFFF),color-stop(0.04,#FFFFFF),color-stop(0.96,#FFFFFF),color-stop(0.97,#FFFFFF),color-stop(1,#E1E1E4));
|
||||
background-image:-o-linear-gradient(bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:-moz-linear-gradient(bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:-webkit-linear-gradient(top,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:-ms-linear-gradient(bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:linear-gradient(to bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
height: 44px;
|
||||
}
|
||||
|
||||
#menu.floorplan tr:first-child a {
|
||||
color:#000;
|
||||
}
|
||||
|
||||
#menu.floorplan tr:first-child td {
|
||||
text-align:center;
|
||||
padding-right: 7px;
|
||||
}
|
||||
|
||||
#floorplans svg {
|
||||
fill:#FFF;
|
||||
padding:5px;
|
||||
width:18px;
|
||||
height:18px;
|
||||
background-size:28px 12px;
|
||||
background-repeat:no-repeat;
|
||||
border-radius:5px;
|
||||
border:1px solid #007AFE;
|
||||
background-color:#007AFE;
|
||||
}
|
||||
|
||||
#fpmenu.fp_arrange {
|
||||
width:200px;
|
||||
font-size:9px;
|
||||
}
|
||||
#fpmenu.fp_arrange input, #fpmenu.fp_arrange select {
|
||||
width:180px;
|
||||
margin:2px;
|
||||
}
|
||||
#fpmenu.fp_arrange input[type=text] {
|
||||
width:157px;
|
||||
}
|
||||
#fpmenu.fp_arrange #fp_ar_input_top, #fpmenu.fp_arrange #fp_ar_input_left {
|
||||
width:57px;
|
||||
}
|
||||
|
||||
#startcontent {position:absolute; top:20px; left:180px; text-align:left; font-size: 16px; }
|
||||
table a:hover {font-weight:bold;}
|
||||
#hdr { position:absolute; top:10px; left:180px; border:1px solid gray; }
|
||||
#content { position:absolute; top:50px; left:180px; bottom:10px; right:10px; text-align:left}
|
||||
#errmsg { background-color: #000000; color: #FFFFFF; position:absolute; top:0px; right:0px; z-index: 10; }
|
||||
img { border-style: none; }
|
||||
|
||||
.fp_Grundriss {border:0px solid gray;}
|
||||
|
||||
.devicename {font-size: 11px; text-align:center; }
|
||||
.devicestate {text-align:center; }
|
||||
.devicecommands {font-size:14px; text-align:center; }
|
||||
.devicetimestamp{font-size:10px; text-align:center; }
|
||||
|
||||
#sz_Rollo.devicename {font-size:14px;}
|
||||
#sz_Rollo.devicecommands {font-size:12px; text-align:center; }
|
||||
#ez_Aussensensor.devicestate {color:green; font-size:30px; }
|
||||
#HomeStatus.devicestate {color:green; font-size:30px; }
|
||||
table.dummy {min-width:100px; }
|
||||
table.FHT {min-width:100px; }
|
||||
#wakeup.devicestate {color:green; font-size:11px; }
|
||||
#ez_FHT.devicestate {color:green; font-size:30px; }
|
||||
#Home.fp_Grundriss {font-size:14px; width:100px; }
|
||||
#Home.fp_Media {font-size:14px; text-align:left; }
|
||||
#Media {font-size:14px; }
|
||||
#Grundriss {font-size:14px; text-align:left; }
|
||||
.fp_tempvalue {color:red; font-size:20px; }
|
||||
.fp_humvalue {color:blue; font-size:20px; }
|
||||
|
||||
.screen {
|
||||
position:absolute;
|
||||
top:0px;
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
h2,h3,h4 { color:#52865D; line-height:1.3;
|
||||
margin-top:1.5em; font-family:Arial,Sans-serif; }
|
||||
.at {
|
||||
width:100px;
|
||||
}
|
||||
|
||||
/* detail-selector & slider */
|
||||
select { margin-left:5px; margin-right:5px; }
|
||||
.set,.attr { margin-bottom:5px; float:left; }
|
||||
.slider { float:left; width:140px; height:26px; border:2px solid; color:grey; }
|
||||
.set .slider { background:#F0F0D8; border-radius:8px; }
|
||||
/* timepicker */
|
||||
.set .set { margin-bottom:2px; margin-top:3px; }
|
||||
|
||||
.handle { position:relative; cursor:pointer; width:50px;
|
||||
height:20px; line-height:20px; user-select:none;
|
||||
border:3px solid; color:#278727; text-align:center; }
|
||||
.downText { margin-top:2px; }
|
||||
|
||||
/* next lines are for openautomation-svg */
|
||||
g.on { fill:red; }
|
||||
|
||||
/* 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; }
|
||||
830
fhem/www/pgm2/ios12touchpadstyle.css
Normal file
830
fhem/www/pgm2/ios12touchpadstyle.css
Normal file
@ -0,0 +1,830 @@
|
||||
@import url("ios12dashboard.css");
|
||||
@import url("ios12Common.css");
|
||||
|
||||
/* iOS 12 Theme for FHEM */
|
||||
/* by Sandra Ohmayer */
|
||||
/* http://www.foodcat.de */
|
||||
body {
|
||||
width:100%
|
||||
}
|
||||
|
||||
/*set standard for view without js*/
|
||||
#content,#right {
|
||||
width:763px;
|
||||
/* Firefox */
|
||||
width:-moz-calc(100% - 261px);
|
||||
/* WebKit */
|
||||
width:-webkit-calc(100% - 261px);
|
||||
/* Opera */
|
||||
width:-o-calc(100% - 261px);
|
||||
/* Standard */
|
||||
width:calc(100% - 261px)
|
||||
}
|
||||
|
||||
#content,#menu,#right {
|
||||
/*old*/
|
||||
height:704px;
|
||||
/* Firefox */
|
||||
height:-moz-calc(100vh - 44px);
|
||||
/* WebKit */
|
||||
height:-webkit-calc(100vh - 44px);
|
||||
/* Opera */
|
||||
height:-o-calc(100vh - 44px);
|
||||
/* Standard */
|
||||
height:calc(100vh - 44px)
|
||||
}
|
||||
|
||||
#hdr input {
|
||||
width:80%
|
||||
}
|
||||
|
||||
/*hideMenu toggle*/
|
||||
.hideMenu #content,.hideMenu #right {
|
||||
width:964px;
|
||||
/* Firefox */
|
||||
width:-moz-calc(100% - 60px);
|
||||
/* WebKit */
|
||||
width:-webkit-calc(100% - 60px);
|
||||
/* Opera */
|
||||
width:-o-calc(100% - 60px);
|
||||
/* Standard */
|
||||
width:calc(100% - 60px)
|
||||
}
|
||||
|
||||
.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)
|
||||
}
|
||||
|
||||
/*iPhone Skalierung*/
|
||||
/* iPhone < 5(portrait) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 320px)
|
||||
and (max-device-width : 480px)
|
||||
and (orientation : portrait) {
|
||||
body {
|
||||
width:320px
|
||||
}
|
||||
|
||||
.SVGplot {
|
||||
width: 265px;
|
||||
overflow: scroll;
|
||||
}
|
||||
#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
|
||||
}
|
||||
}
|
||||
|
||||
/* iPhone 5(portrait) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 320px)
|
||||
and (max-device-width : 568px)
|
||||
and (orientation : portrait) {
|
||||
body {
|
||||
width:320px
|
||||
}
|
||||
|
||||
.SVGplot {
|
||||
width: 265px;
|
||||
overflow: scroll;
|
||||
}
|
||||
#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
|
||||
}
|
||||
}
|
||||
|
||||
/* iPhone 6(portrait) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 375px) and (max-device-width : 667px)
|
||||
and (orientation : portrait) {
|
||||
body {
|
||||
width:375px
|
||||
}
|
||||
|
||||
.SVGplot {
|
||||
width: 320px;
|
||||
overflow: scroll;
|
||||
}
|
||||
#content,#right {
|
||||
padding:0 10px!important
|
||||
}
|
||||
}
|
||||
|
||||
/* iPhone 6(landscape) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 375px) and (max-device-width : 667px)
|
||||
and (orientation : landscape) {
|
||||
body {
|
||||
width:667px
|
||||
}
|
||||
}
|
||||
|
||||
/* iPhone 6+(portrait) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 414px) and (max-device-width : 736px)
|
||||
and (orientation : portrait) {
|
||||
body {
|
||||
width:414px
|
||||
}
|
||||
.SVGplot {
|
||||
width: 359px;
|
||||
overflow: scroll;
|
||||
}
|
||||
}
|
||||
|
||||
/* iPhone 6+(landscape) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 414px) and (max-device-width : 736px)
|
||||
and (orientation : landscape) {
|
||||
body {
|
||||
width:736px
|
||||
}
|
||||
}
|
||||
|
||||
/*iPad Skalierung*/
|
||||
|
||||
/* iPads (portrait) ----------- */
|
||||
@media only screen
|
||||
and (min-device-width : 768px)
|
||||
and (max-device-width : 768px)
|
||||
and (orientation : portrait) {
|
||||
body {
|
||||
width:768px
|
||||
}
|
||||
}
|
||||
|
||||
/* Android Phone Devices */
|
||||
@media only screen
|
||||
and (orientation : portrait) {
|
||||
.isAndroidPhone {
|
||||
width:360px;
|
||||
}
|
||||
.isAndroidTablet {
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen
|
||||
and (orientation : landscape) {
|
||||
.isAndroidPhone {
|
||||
width:640px
|
||||
}
|
||||
.isAndroidTablet {
|
||||
}
|
||||
}
|
||||
|
||||
.isMobile {
|
||||
background-color:#EFEFF4;
|
||||
background:#EFEFF4;
|
||||
}
|
||||
|
||||
.hideMenu #menu {
|
||||
display:none
|
||||
}
|
||||
|
||||
html,body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
font:normal 14px "Segoe UI","Helvetica Neue";
|
||||
text-decoration:none;
|
||||
color:#8A8A8F;
|
||||
font-weight:400
|
||||
}
|
||||
|
||||
body {
|
||||
background-color:#000;
|
||||
background:#000
|
||||
}
|
||||
|
||||
a {
|
||||
color:#000;
|
||||
font-weight:600;
|
||||
text-decoration:none
|
||||
}
|
||||
|
||||
a:hover {
|
||||
cursor:pointer;
|
||||
color:#8A8A8F;
|
||||
}
|
||||
|
||||
img {
|
||||
border-style:none
|
||||
}
|
||||
|
||||
div.dist {
|
||||
padding-top:.3em
|
||||
}
|
||||
|
||||
button.dist {
|
||||
margin:10px;
|
||||
background:transparent;
|
||||
border:0;
|
||||
cursor:pointer
|
||||
}
|
||||
|
||||
textarea,select,input {
|
||||
background:#F5F5F7;
|
||||
border-radius:7px;
|
||||
border:1px solid #F5F5F7;
|
||||
border-bottom-color:#F5F5F7;
|
||||
background-color:#F5F5F7;
|
||||
padding-left:0.5em;
|
||||
margin:7px;
|
||||
outline:none;
|
||||
-moz-box-shadow: 0 -1px #F5F5F7,0 1px #F5F5F7,inset 0 -2px 2px #F5F5F7,inset 0 1px #F5F5F7;
|
||||
-webkit-box-shadow: 0 -1px #F5F5F7, 0 1px #F5F5F7, inset 0 -2px 2px #F5F5F7, inset 0 1px #F5F5F7;
|
||||
box-shadow: 0 -1px #F5F5F7, 0 1px #F5F5F7, inset 0 -2px 2px #F5F5F7, inset 0 1px #F5F5F7;
|
||||
}
|
||||
|
||||
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: 23px;
|
||||
margin: 9px;
|
||||
}
|
||||
|
||||
tr.column td {
|
||||
padding:0;
|
||||
vertical-align:top
|
||||
}
|
||||
|
||||
/* Documentation */
|
||||
h2,h3,h4 {
|
||||
line-height:1.3;
|
||||
margin-top:1.5em
|
||||
}
|
||||
|
||||
div.dist {
|
||||
padding-top:.3em
|
||||
}
|
||||
|
||||
button.dist {
|
||||
margin:10px;
|
||||
background:transparent;
|
||||
border:0;
|
||||
cursor:pointer
|
||||
}
|
||||
|
||||
div.block {
|
||||
border:1px solid gray;
|
||||
background:#F8F8E0;
|
||||
padding:.7em
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space:pre-wrap
|
||||
}
|
||||
|
||||
svg {
|
||||
height:28px;
|
||||
width:28px;
|
||||
vertical-align:middle;
|
||||
margin-right:5px
|
||||
}
|
||||
|
||||
.roomoverview table.block td:first-child a svg {
|
||||
fill:#FFF;
|
||||
padding:5px;
|
||||
width:24px;
|
||||
height:24px;
|
||||
background-size:28px 12px;
|
||||
background-repeat:no-repeat;
|
||||
border-radius:5px;
|
||||
border:1px solid #007AFE;
|
||||
background-color:#007AFE;
|
||||
}
|
||||
|
||||
|
||||
svg:not([fill]) {
|
||||
fill:#8A8A8F;
|
||||
}
|
||||
|
||||
svg.on,svg.FS20_on {
|
||||
fill:orange
|
||||
}
|
||||
|
||||
#logo {
|
||||
position:absolute;
|
||||
top:5px;
|
||||
left:6px;
|
||||
width:28px;
|
||||
height:28px;
|
||||
z-index:99;
|
||||
background-image:url(../images/fhemSVG/system_fhem.svg);
|
||||
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:#E2E2E7
|
||||
}
|
||||
|
||||
table.room svg {
|
||||
fill:#FFF;
|
||||
padding:5px;
|
||||
width:18px;
|
||||
height:18px;
|
||||
background-size:28px 12px;
|
||||
background-repeat:no-repeat;
|
||||
border-radius:5px;
|
||||
border:1px solid #007AFE;
|
||||
background-color:#007AFE;
|
||||
}
|
||||
|
||||
#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
|
||||
}
|
||||
|
||||
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
|
||||
}
|
||||
|
||||
table.room tr.sel a svg {
|
||||
border-color:#444;
|
||||
background-color:#444
|
||||
}
|
||||
|
||||
#hdr {
|
||||
float:right;
|
||||
z-index:98;
|
||||
position:relative;
|
||||
top:0;
|
||||
left:0;
|
||||
width:100%;
|
||||
height:44px;
|
||||
background-color: #fff;
|
||||
-moz-box-shadow:0 0px 1px #CACACE;
|
||||
-webkit-box-shadow:0 0px 1px #CACACE;
|
||||
box-shadow:0 0px 1px #CACACE;
|
||||
}
|
||||
|
||||
#hdr input {
|
||||
margin:0;
|
||||
position:relative;
|
||||
float:right;
|
||||
right:7px;
|
||||
height:25px;
|
||||
border-radius:7px;
|
||||
background-color:#F5F5F7;
|
||||
border:none;
|
||||
color:#95959A;
|
||||
padding-left:1.5em;
|
||||
outline:none;
|
||||
-moz-box-shadow:0 -1px #F5F5F7,0 1px #F5F5F7,inset 0 -2px 2px #F5F5F7,inset 0 1px #F5F5F7;
|
||||
-webkit-box-shadow:0 -1px #F5F5F7,0 1px #F5F5F7,inset 0 -2px 2px #F5F5F7,inset 0 1px #F5F5F7;
|
||||
box-shadow:0 -1px #F5F5F7,0 1px #F5F5F7,inset 0 -2px 2px #F5F5F7,inset 0 1px #F5F5F7;
|
||||
}
|
||||
|
||||
#hdr table {
|
||||
width:100%;
|
||||
margin:0;
|
||||
padding:5px
|
||||
}
|
||||
|
||||
#menu {
|
||||
position:absolute;
|
||||
top:44px;
|
||||
overflow:auto;
|
||||
-webkit-overflow-scrolling:touch;
|
||||
float:left;
|
||||
width:200px;
|
||||
background-color:#EFEFF4
|
||||
}
|
||||
|
||||
#menu table {
|
||||
width:100%;
|
||||
border-spacing:0;
|
||||
padding:0
|
||||
}
|
||||
|
||||
#content,#right {
|
||||
background-color:#EFEFF4;
|
||||
background:#EFEFF4;
|
||||
overflow:auto;
|
||||
-webkit-overflow-scrolling:touch;
|
||||
border-left:1px solid #CACACE;
|
||||
float:right;
|
||||
padding:0 30px
|
||||
}
|
||||
|
||||
#content table {
|
||||
width:100%;
|
||||
}
|
||||
|
||||
#content > form > .CodeMirror {
|
||||
height: initial !important;
|
||||
}
|
||||
|
||||
#menuScrollArea {
|
||||
float:left
|
||||
}
|
||||
|
||||
#right {
|
||||
margin-top:44px
|
||||
}
|
||||
|
||||
#console {
|
||||
font:11px "Courier New",Courier,monospace
|
||||
}
|
||||
|
||||
#errmsg {
|
||||
padding:6px;
|
||||
color:#95959A;
|
||||
font-weight:600;
|
||||
position:absolute;
|
||||
top:5px;
|
||||
left:225px;
|
||||
z-index:99;
|
||||
text-shadow:0 1px #000
|
||||
}
|
||||
|
||||
.devType,.devType a,.makeTable,.makeTable a {
|
||||
font-weight:400;
|
||||
text-transform: uppercase;
|
||||
color:#8A8A8F;
|
||||
font-size:13px;
|
||||
padding:20px 0 0
|
||||
}
|
||||
|
||||
.devType table,.makeTable table {
|
||||
font-weight:400;
|
||||
color:#385487;
|
||||
font-size:14px;
|
||||
padding:0
|
||||
}
|
||||
|
||||
.devType table a,.makeTable table a {
|
||||
font-weight:600;
|
||||
color:#000;
|
||||
font-size:14px;
|
||||
padding:0
|
||||
}
|
||||
|
||||
.devType table a:hover,.makeTable table a:hover {
|
||||
color:#8A8A8F;
|
||||
}
|
||||
|
||||
.wide {
|
||||
width:100%
|
||||
}
|
||||
|
||||
.block {
|
||||
margin-top:5px;
|
||||
position:relative;
|
||||
font-size:14px
|
||||
}
|
||||
|
||||
table.block input,table.block select {
|
||||
margin:5px
|
||||
}
|
||||
|
||||
table.block {
|
||||
padding:0;
|
||||
border-spacing:0;
|
||||
-webkit-border-radius:7px;
|
||||
-moz-border-radius:7px;
|
||||
border-radius:7px;
|
||||
border:1px solid #fff;
|
||||
border-bottom-color:#fff;
|
||||
-moz-box-shadow:0 1px #fff,inset 0 1px #fff;
|
||||
-webkit-box-shadow:0 1px #fff,inset 0 1px #fff;
|
||||
box-shadow:0 1px #fff,inset 0 1px #fff;
|
||||
background:#fff
|
||||
}
|
||||
|
||||
table.block td {
|
||||
text-align:left;
|
||||
vertical-align:middle
|
||||
}
|
||||
|
||||
.dval {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
table.block td {
|
||||
border-top:1px solid #fdfdfd;
|
||||
border-bottom:1px solid #cbcbcb;
|
||||
padding-right: 9px;
|
||||
}
|
||||
|
||||
table.block tr:first-child td {
|
||||
border-top:none
|
||||
}
|
||||
|
||||
table.block tr:last-child td {
|
||||
border-bottom:none
|
||||
}
|
||||
|
||||
.block td:first-child {
|
||||
padding-left:10px;
|
||||
font-weight:600;
|
||||
}
|
||||
|
||||
.block > tbody > tr > td:last-child {
|
||||
padding-right:10px;
|
||||
}
|
||||
|
||||
.block > tbody > tr > td:last-child {
|
||||
padding-right:10px;
|
||||
}
|
||||
|
||||
.roomoverview table.block td:first-child {
|
||||
min-width:50px
|
||||
}
|
||||
|
||||
.roomoverview table.block td:nth-child(2) {
|
||||
min-width:30px
|
||||
}
|
||||
|
||||
table.room {
|
||||
margin-bottom:10px;
|
||||
border-spacing:0;
|
||||
padding:0;
|
||||
width:100%;
|
||||
-moz-box-shadow:0 -1px #E1E1E4;
|
||||
-webkit-box-shadow:0 -1px #E1E1E4;
|
||||
box-shadow:0 -1px #E1E1E4
|
||||
}
|
||||
|
||||
table.block tr {
|
||||
height:44px
|
||||
}
|
||||
|
||||
table.room tr {
|
||||
background-image:-webkit-gradient(linear,right top,right bottom,color-stop(0,#FFFFFF),color-stop(0.02,#FFFFFF),color-stop(0.04,#FFFFFF),color-stop(0.96,#FFFFFF),color-stop(0.97,#FFFFFF),color-stop(1,#E1E1E4));
|
||||
background-image:-o-linear-gradient(bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:-moz-linear-gradient(bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:-webkit-linear-gradient(top,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:-ms-linear-gradient(bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
background-image:linear-gradient(to bottom,#FFFFFF 0%,#FFFFFF 2%,#FFFFFF 4%,#FFFFFF 96%,#FFFFFF 97%,#E1E1E4 100%);
|
||||
height:44px
|
||||
}
|
||||
|
||||
table.room a,table.block a {
|
||||
vertical-align:middle
|
||||
}
|
||||
|
||||
table.room a {
|
||||
padding-left:5px;
|
||||
display:block
|
||||
}
|
||||
|
||||
table.block tr.sel,table.room tr.sel {
|
||||
color:#FFF;
|
||||
background-image:-webkit-gradient(linear,right top,right bottom,color-stop(0,#4DA2FF),color-stop(0.02,#4DA2FF),color-stop(0.04,#4DA2FF),color-stop(0.96,#4DA2FF),color-stop(0.97,#4DA2FF),color-stop(1,#1B72FF));
|
||||
background-image:-o-linear-gradient(bottom,#4DA2FF 0%,#4DA2FF 2%,#4DA2FF 4%,#4DA2FF 96%,#4DA2FF 97%,#4DA2FF 100%,#1B72FF 100%);
|
||||
background-image:-moz-linear-gradient(bottom,#4DA2FF 0%,#4DA2FF 2%,#4DA2FF 4%,#4DA2FF 96%,#4DA2FF 97%,#4DA2FF 100%,#1B72FF 100%);
|
||||
background-image:-webkit-linear-gradient(top,#4DA2FF 0%,#4DA2FF 2%,#4DA2FF 4%,#4DA2FF 96%,#4DA2FF 97%,#4DA2FF 100%,#1B72FF 100%);
|
||||
background-image:-ms-linear-gradient(bottom,#4DA2FF 0%,#4DA2FF 2%,#4DA2FF 4%,#4DA2FF 96%,#4DA2FF 97%,#4DA2FF 100%,#1B72FF 100%);
|
||||
background-image:linear-gradient(to bottom,#4DA2FF 0%,#4DA2FF 2%,#4DA2FF 4%,#4DA2FF 96%,#4DA2FF 97%,#4DA2FF 100%,#1B72FF 100%)
|
||||
}
|
||||
|
||||
table.room tr.sel a {
|
||||
color:#FFF;
|
||||
}
|
||||
|
||||
table.room tr.sel a:hover {
|
||||
color:#333;
|
||||
}
|
||||
|
||||
table.room a:hover svg {
|
||||
background-color:#777;
|
||||
border:1px solid #777;
|
||||
}
|
||||
|
||||
table.room tr.sel a:hover svg {
|
||||
background-color:#333;
|
||||
border:1px solid #333;
|
||||
}
|
||||
|
||||
.dname {
|
||||
}
|
||||
|
||||
.FileLog td:first-child {
|
||||
font-weight:400;
|
||||
width:180px
|
||||
}
|
||||
|
||||
.FileLog td:nth-child(2) {
|
||||
width:100px
|
||||
}
|
||||
|
||||
/* Widgets */
|
||||
.makeTable {
|
||||
width:100%;
|
||||
display:block;
|
||||
float:left;
|
||||
clear:left
|
||||
}
|
||||
|
||||
.textField_widget {
|
||||
display:block!important
|
||||
}
|
||||
|
||||
.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 #fff;
|
||||
border-bottom-color: #fff;
|
||||
-moz-box-shadow: 0 1px #fff,inset 0 1px #fff;
|
||||
-webkit-box-shadow: 0 1px #fff, inset 0 1px #fff;
|
||||
box-shadow: 0 1px #fff, inset 0 1px #fff;
|
||||
background: #fff;
|
||||
}
|
||||
.colorpicker {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.slider {
|
||||
margin-top: 4px;
|
||||
margin-bottom: 4px;
|
||||
display:inline-block;
|
||||
-webkit-box-sizing:border-box;
|
||||
-moz-box-sizing:padding-box;
|
||||
box-sizing:padding-box;
|
||||
height:28px;
|
||||
width:250px;
|
||||
padding:1px;
|
||||
-webkit-border-radius:4px;
|
||||
-moz-border-radius:4px;
|
||||
border-radius:4px;
|
||||
background-color:#007AFE;
|
||||
background-repeat:no-repeat,repeat-x
|
||||
}
|
||||
|
||||
.get,.set,.attr {
|
||||
float:left;
|
||||
margin-bottom:10px;
|
||||
margin-top:10px
|
||||
}
|
||||
|
||||
.handle {
|
||||
position:relative;
|
||||
-webkit-box-shadow: 0 1px #CACACE;
|
||||
-moz-box-shadow: 0 1px #CACACE;
|
||||
box-shadow: 0 1px #CACACE;
|
||||
border: 1px solid #CACACE;
|
||||
color:#666;
|
||||
height:26px;
|
||||
width:20px;
|
||||
left:0;
|
||||
top:-2px;
|
||||
-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-color: #fff;
|
||||
}
|
||||
|
||||
.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:0;
|
||||
padding:0;
|
||||
font-weight:400
|
||||
}
|
||||
|
||||
/* next lines are for remotecontrol */
|
||||
.rc_body {
|
||||
border-style:solid;
|
||||
border-radius: 7px;
|
||||
border-color:#7b7b7b;
|
||||
border-width:2px;
|
||||
padding:5px;
|
||||
background:#FFF;
|
||||
font-size:6px;
|
||||
width: auto!important;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
|
||||
.rc_button {
|
||||
padding:6px 8px
|
||||
}
|
||||
|
||||
.rc_button img {
|
||||
border-style:solid;
|
||||
border-width:1px;
|
||||
border-color:transparent
|
||||
}
|
||||
|
||||
.rc_button img:active {
|
||||
border-color:gray
|
||||
}
|
||||
|
||||
.rc_BLANK_svg {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.colorpicker {
|
||||
border-color:#4c566c
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width:7px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
width:7px;
|
||||
height:1px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background:#EFEFF4;
|
||||
border:thin solid #EFEFF4;
|
||||
box-shadow:0 0 3px #EFEFF4 inset;
|
||||
border-radius:10px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background:#E1E1E4;
|
||||
border:thin solid #E1E1E4;
|
||||
border-radius:10px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background:#777
|
||||
}
|
||||
@ -82,15 +82,20 @@ $(document).ready(function() {
|
||||
var maxlength = 0;
|
||||
var maxtr;
|
||||
tables.each(function() {
|
||||
var td = $(this).children("tbody").children("tr").first().children("td");
|
||||
var trlength = 0;
|
||||
td.each(function() {
|
||||
trlength = trlength+$(this).prop("colSpan");
|
||||
var tr =$(this).children("tbody").children("tr");
|
||||
tr.each(function(){
|
||||
var td = $(this).children("td");
|
||||
var trlength = 0;
|
||||
td.each(function() {
|
||||
trlength = trlength+$(this).prop("colSpan");
|
||||
});
|
||||
if (trlength > maxlength) {
|
||||
maxlength = trlength;
|
||||
maxtr=$(this);
|
||||
}
|
||||
});
|
||||
if (trlength > maxlength) {
|
||||
maxlength = trlength;
|
||||
maxtr=$(this).children("tbody").children("tr").children('td:eq('+(maxlength-1)+')').parent().first();
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
|
||||
// Setzen aller hinteren Spalten auf ein Minimum an Platzbedarf
|
||||
|
||||
@ -262,11 +262,6 @@ textarea,select,input {
|
||||
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
|
||||
@ -280,7 +275,8 @@ select,input[type="submit"],input[type="reset"],input[type="button"] {
|
||||
}
|
||||
|
||||
input[type="text"] {
|
||||
height:25px
|
||||
height: 23px;
|
||||
margin: 9px;
|
||||
}
|
||||
|
||||
tr.column td {
|
||||
@ -499,7 +495,7 @@ table.room tr.sel a svg {
|
||||
}
|
||||
|
||||
#content table {
|
||||
width:100%!important
|
||||
width:100%;
|
||||
}
|
||||
|
||||
#content > form > .CodeMirror {
|
||||
@ -803,15 +799,18 @@ table.room tr.sel a:hover svg {
|
||||
/* next lines are for remotecontrol */
|
||||
.rc_body {
|
||||
border-style:solid;
|
||||
border-color:gray;
|
||||
border-radius: 7px;
|
||||
border-color:#7b7b7b;
|
||||
border-width:2px;
|
||||
padding:5px;
|
||||
background:#C8C8B0;
|
||||
font-size:6px
|
||||
background:#FFF;
|
||||
font-size:6px;
|
||||
width: auto!important;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.rc_button {
|
||||
padding:5px 7px
|
||||
padding:6px 8px
|
||||
}
|
||||
|
||||
.rc_button img {
|
||||
@ -824,6 +823,10 @@ table.room tr.sel a:hover svg {
|
||||
border-color:gray
|
||||
}
|
||||
|
||||
.rc_BLANK_svg {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.colorpicker {
|
||||
border-color:#4c566c
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user