Removed old templates/ and static/ web directories

This commit is contained in:
Fabio Manganiello 2021-02-21 00:41:40 +01:00
parent 94c35e210e
commit 7922ae4801
276 changed files with 0 additions and 17349 deletions

File diff suppressed because one or more lines are too long

View file

@ -1 +0,0 @@
.widget .calendar{padding:1rem}.widget .calendar .event{font-size:.95em}.widget .calendar .upcoming-event{text-align:center;margin-bottom:1.5rem;font-size:1.2em}.widget .calendar .upcoming-event .summary{text-transform:uppercase;font-size:1.3em}

View file

@ -1 +0,0 @@
.widget .date-time-weather{height:100%;display:flex;flex-direction:column;align-items:center;padding-top:1rem}.widget .date-time-weather .date{font-size:1.3em;height:10%}.widget .date-time-weather .time{font-size:2em;height:14%}.widget .date-time-weather .weather{height:35%;display:flex;align-items:center}.widget .date-time-weather .weather .temperature{font-size:2em;margin-left:1rem}.widget .date-time-weather .summary{height:28%}.widget .date-time-weather .sensors{width:100%;height:13%}.widget .date-time-weather .sensors .sensor{padding:0 1rem}.widget .date-time-weather .sensors .humidity{text-align:right}

View file

@ -1 +0,0 @@
.widget .image-carousel{height:100%;position:relative;display:flex;align-items:center;justify-content:center;background-color:transparent}.widget .image-carousel .background{position:absolute;top:0;width:100%;height:100vh;background-color:transparent;background-position:center;background-size:cover;background-repeat:no-repeat;filter:blur(13px);-webkit-filter:blur(13px)}.widget .image-carousel img{position:absolute;max-height:100%;z-index:2}

View file

@ -1 +0,0 @@
.widget .music{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.widget .music .track{text-align:center}.widget .music .track .unknown,.widget .music .track .no-track{font-size:2em}.widget .music .track .artist{font-size:1.9em;font-weight:bold;margin-bottom:.25em}.widget .music .track .title{font-size:1.8em}.widget .music .time{width:100%;margin-top:1em;font-size:1.2em}.widget .music .time .row{padding:0 .5em}.widget .music .time .time-total{text-align:right}.widget .music .time .progress-bar{width:100%;height:1em;position:relative;margin-bottom:.75em}.widget .music .time .progress-bar .total{position:absolute;width:100%;height:100%;top:0;background:#ddd;border-radius:5rem}.widget .music .time .progress-bar .elapsed{position:absolute;width:100%;height:100%;top:0;background:#c8ffd0;border-radius:5rem;z-index:1}.widget .music .playback-status{position:absolute;bottom:0;border-top:1px solid #ddd;color:#757f70;width:100%;height:2em}.widget .music .playback-status .status-property{display:flex;align-items:center;justify-content:center;height:100%}.widget .music .playback-status .active{color:#35b870}

View file

@ -1 +0,0 @@
.widget .rss-news{height:100%;display:flex;align-items:center}.widget .rss-news .article{width:90%;padding:0 2em}.widget .rss-news .article .source{font-size:1.7em;font-weight:bold;margin-bottom:.5em}.widget .rss-news .article .title{font-size:1.7em;margin-bottom:.5em}.widget .rss-news .article .published{text-align:right;font-size:1em}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1 +0,0 @@
#assistant-google-modal .modal{width:50vw;height:50vh}#assistant-google-modal .modal .body{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}#assistant-google-modal .modal .body .icon{font-size:3em;color:#7e8;box-shadow:2px 2px 2px #ccc;border:1px solid #ccc;border-radius:3em;padding:.7em 1em .5em 1em}#assistant-google-modal .modal .body .text{margin-top:2.5em}

View file

@ -1 +0,0 @@
.camera{min-height:90%;margin-top:4%;overflow:auto;display:flex;flex-direction:column;align-items:center}.camera .camera-container{min-width:640px;min-height:480px;position:relative;background:#000;margin-bottom:1em}.camera .camera-container .frame,.camera .camera-container .no-frame{position:absolute;top:0;width:100%;height:100%}.camera .camera-container .frame{z-index:1}.camera .camera-container .no-frame{display:flex;background:rgba(0,0,0,0.1);color:#fff;align-items:center;justify-content:center;z-index:2}

View file

@ -1 +0,0 @@
.camera{min-height:90%;margin-top:4%;overflow:auto;display:flex;flex-direction:column;align-items:center}.camera .camera-container{position:relative;background:#000;margin-bottom:1em}.camera .camera-container .frame,.camera .camera-container .no-frame{position:absolute;top:0;width:100%;height:100%}.camera .camera-container .frame{z-index:1}.camera .camera-container .no-frame{display:flex;background:rgba(0,0,0,0.1);color:#fff;align-items:center;justify-content:center;z-index:2}.camera .url{width:640px;display:flex;margin:1em}.camera .url .row{width:100%;display:flex;align-items:center}.camera .url .name{width:140px}.camera .url input{width:500px;font-weight:normal}.camera .params{margin-top:1em;padding:1em;width:640px;display:flex;flex-direction:column;border:1px solid #ccc;border-radius:1em}.camera .params label{font-weight:normal}.camera .params .head{display:flex;justify-content:center}.camera .params .head label{width:100%;display:flex;justify-content:right}.camera .params .head label .name{margin-right:1em}.camera .params .body{display:flex;flex-direction:column;margin:0 0 0 -1em}.camera .params .body .row{width:100%;display:flex;align-items:center;padding:.5em}.camera .params .body .row .name{width:30%}.camera .params .body .row input{width:70%}.camera .params .body .row:nth-child(even){background:#e4e4e4}.camera .params .body .row:hover{background:#def6ea}

View file

@ -1 +0,0 @@
.camera{min-height:90%;margin-top:4%;overflow:auto;display:flex;flex-direction:column;align-items:center}.camera .camera-container{position:relative;background:#000;margin-bottom:1em}.camera .camera-container .frame,.camera .camera-container .no-frame{position:absolute;top:0;width:100%;height:100%}.camera .camera-container .frame{z-index:1}.camera .camera-container .no-frame{display:flex;background:rgba(0,0,0,0.1);color:#fff;align-items:center;justify-content:center;z-index:2}.camera .url{width:640px;display:flex;margin:1em}.camera .url .row{width:100%;display:flex;align-items:center}.camera .url .name{width:140px}.camera .url input{width:500px;font-weight:normal}.camera .params{margin-top:1em;padding:1em;width:640px;display:flex;flex-direction:column;border:1px solid #ccc;border-radius:1em}.camera .params label{font-weight:normal}.camera .params .head{display:flex;justify-content:center}.camera .params .head label{width:100%;display:flex;justify-content:right}.camera .params .head label .name{margin-right:1em}.camera .params .body{display:flex;flex-direction:column;margin:0 0 0 -1em}.camera .params .body .row{width:100%;display:flex;align-items:center;padding:.5em}.camera .params .body .row .name{width:30%}.camera .params .body .row input{width:70%}.camera .params .body .row:nth-child(even){background:#e4e4e4}.camera .params .body .row:hover{background:#def6ea}

View file

@ -1 +0,0 @@
.camera{min-height:90%;margin-top:4%;overflow:auto;display:flex;flex-direction:column;align-items:center}.camera .camera-container{position:relative;background:#000;margin-bottom:1em}.camera .camera-container .frame,.camera .camera-container .no-frame{position:absolute;top:0;width:100%;height:100%}.camera .camera-container .frame{z-index:1}.camera .camera-container .no-frame{display:flex;background:rgba(0,0,0,0.1);color:#fff;align-items:center;justify-content:center;z-index:2}.camera .url{width:640px;display:flex;margin:1em}.camera .url .row{width:100%;display:flex;align-items:center}.camera .url .name{width:140px}.camera .url input{width:500px;font-weight:normal}.camera .params{margin-top:1em;padding:1em;width:640px;display:flex;flex-direction:column;border:1px solid #ccc;border-radius:1em}.camera .params label{font-weight:normal}.camera .params .head{display:flex;justify-content:center}.camera .params .head label{width:100%;display:flex;justify-content:right}.camera .params .head label .name{margin-right:1em}.camera .params .body{display:flex;flex-direction:column;margin:0 0 0 -1em}.camera .params .body .row{width:100%;display:flex;align-items:center;padding:.5em}.camera .params .body .row .name{width:30%}.camera .params .body .row input{width:70%}.camera .params .body .row:nth-child(even){background:#e4e4e4}.camera .params .body .row:hover{background:#def6ea}

File diff suppressed because one or more lines are too long

View file

@ -1 +0,0 @@
.gpio-container{display:flex;flex-direction:column;height:100%;overflow:auto}.gpio-container .refresh{border-bottom:1px solid #ddd;background:#f8f8f8}.gpio-container .refresh button{border:0}.gpio-container .refresh button:hover{color:#35b870}.gpio-container .pins .pin{padding:1em;border-bottom:1px solid #ddd;display:flex;flex-direction:row;align-items:center}.gpio-container .pins .pin:nth-child(even){background:#f0f0f0}.gpio-container .pins .pin:hover{background:#def6ea}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1 +0,0 @@
.sensors .head{text-align:right}.sensors .head button{border:0}.sensors .head button:hover{background:#def6ea}.sensors .body{display:flex;flex-direction:column;margin:2rem auto;width:80%}.sensors .body .metric{margin-bottom:.75rem;padding:2rem;border:1px solid #ccc;border-radius:2rem}.sensors .body .metric:nth-child(odd){background:rgba(255,255,255,0)}.sensors .body .metric:nth-child(even){background:#f1f3f2}.sensors .body .metric:hover{background:#def6ea}.sensors .body .metric .value{text-align:right;font-weight:bold}

View file

@ -1 +0,0 @@
.sound{height:90%;margin-top:7%;overflow:hidden;display:flex;flex-direction:column;align-items:center}.sound .sound-container{margin-bottom:1em}

View file

@ -1 +0,0 @@
#assistant-google-modal .modal{width:50vw;height:50vh}#assistant-google-modal .modal .body{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}#assistant-google-modal .modal .body .icon{font-size:3em;color:#7e8;box-shadow:2px 2px 2px #ccc;border:1px solid #ccc;border-radius:3em;padding:.7em 1em .5em 1em}#assistant-google-modal .modal .body .text{margin-top:2.5em}

View file

@ -1 +0,0 @@
.switches-root .switch-root .head{padding:1rem .5rem;background:#e8e8e8;border-top:1px solid #ddd;border-bottom:1px solid #ddd;text-transform:uppercase}.switches-root .switch-root .switches{display:flex;flex-direction:column;padding:1rem}.switches-root .switch-root .device{display:flex;align-items:center}.switches-root .switch-root .device .toggle{text-align:right}.switches-root .switch-root .device:hover{background:#def6ea}.switches-root .switch-root .device:not(:last-child){border-bottom:1px solid #ddd}

View file

@ -1 +0,0 @@
.tts-container{max-width:80rem;min-height:10rem;margin:3rem auto;display:flex;align-items:center;justify-content:center;border:1px solid #ddd;border-radius:3rem}.tts-container form{margin:0;width:90%}.tts-container form input[type=text]{width:100%}.tts-container form button{border-radius:5rem}.tts-container form input:hover,.tts-container form button:hover{border-color:#35b870}

View file

@ -1 +0,0 @@
.tts-container{max-width:80rem;min-height:10rem;margin:3rem auto;display:flex;align-items:center;justify-content:center;border:1px solid #ddd;border-radius:3rem}.tts-container form{margin:0;width:90%}.tts-container form input[type=text]{width:100%}.tts-container form button{border-radius:5rem}.tts-container form input:hover,.tts-container form button:hover{border-color:#35b870}

View file

@ -1 +0,0 @@
.tv-samsung-ws-container{height:100%;display:flex;justify-content:center}.tv-samsung-ws-container .controls{max-width:500px;height:calc(100% - .15em);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:0 1em;border:1px solid #ddd;border-radius:2em;box-shadow:0 2px 9px 2px #bbb}.tv-samsung-ws-container .controls .power{color:red}.tv-samsung-ws-container .controls button{margin:.5em 0}.tv-samsung-ws-container .rows{flex-direction:column}.tv-samsung-ws-container .rows * button{width:100%}.tv-samsung-ws-container .section{width:100%;display:flex;margin:0 0 1.5em 0;padding:0 0 1.5em 0;border-bottom:1px solid #ddd}.tv-samsung-ws-container .directions{flex-direction:column}.tv-samsung-ws-container .directions * button{width:5em;height:4em}.tv-samsung-ws-container .volume,.tv-samsung-ws-container .channel{text-align:center}.tv-samsung-ws-container .colors{text-align:center}.tv-samsung-ws-container .colors .color{width:3em;height:3em;padding:0;border-radius:2em}.tv-samsung-ws-container .colors .color.red{background:red}.tv-samsung-ws-container .colors .color.green{background:green}.tv-samsung-ws-container .colors .color.yellow{background:#ff0}.tv-samsung-ws-container .colors .color.blue{background:blue}

View file

@ -1 +0,0 @@
.fa.fa-zigbee:before{content:' ';background:url('/static/img/icons/zigbee-logo.svg');background-size:1em 1em;width:1em;height:1em;display:inline-block}.zigbee-container{height:100%;padding:0 .5em;background:#f1f1f1;display:flex;flex-direction:column;align-items:center;overflow:auto}.zigbee-container .no-items{padding:2em;font-size:1.5em;color:#555;display:flex;align-items:center;justify-content:center}.zigbee-container .view-options{display:flex;width:100%;justify-content:space-between;padding:1em 0}.zigbee-container .view-options .view-selector{display:inline-flex}.zigbee-container .view-options .buttons{display:inline-flex}.zigbee-container .view-options select{width:100%;border-radius:1em}.zigbee-container .btn-default{border:0;padding:0 1em}.zigbee-container .btn-default:hover{border:1px solid #ddd;border-radius:1em}.zigbee-container .buttons{text-align:right}.zigbee-container .view{min-width:400pt;max-width:750pt;background:#fff;border:1px solid #d8d8d8;border-radius:1.5em;box-shadow:1px 2px 2px #ccc}.zigbee-container .item.selected{box-shadow:0 2px 4px 0 #bbb}.zigbee-container .item .name{padding:1em;cursor:pointer;text-transform:uppercase;letter-spacing:.06em}.zigbee-container .item .name.selected{border-radius:1.5em}.zigbee-container .item:hover{background:#def6ea}.zigbee-container .item:not(:last-child){border-bottom:1px solid #ddd}.zigbee-container .item:first-child{border-radius:1.5em 1.5em 0 0}.zigbee-container .item:last-child{border-radius:0 0 1.5em 1.5em}.zigbee-container .params{background:#fff;padding-bottom:1em}.zigbee-container .params .section{display:flex;flex-direction:column;padding:0 1em}.zigbee-container .params .section:not(:first-child){padding-top:1em}.zigbee-container .params .section .header{display:flex;align-items:center;font-weight:bold;border-bottom:1px solid #e8e8e8}.zigbee-container .params .row{display:flex;align-items:center;border-radius:1em;padding:.3em}.zigbee-container .params .row:nth-child(even){background:#ededed}.zigbee-container .params .row:nth-child(odd){background:#fff}.zigbee-container .params .row:hover{background:#def6ea}.zigbee-container .params .param-name{display:inline-flex;width:40%;margin-left:1%;vertical-align:top;letter-spacing:.04em}.zigbee-container .params .param-value{display:inline-block;width:58%;text-align:right}.zigbee-container .params .param-value .value-edit{display:flex;align-items:center}.zigbee-container .params .param-value .value-data{display:inline-block;font-weight:bold}.zigbee-container .params .param-value .slider-container{display:flex;align-items:center}.zigbee-container .params .param-value .unit{font-size:.8em;margin-left:1em;display:inline}.zigbee-container .params .param-value select{width:100%;border-radius:2em}.zigbee-container .params .param-value .numeric input.slider{text-align:left}.zigbee-container .params .param-value .numeric input[type=text]{text-align:right;width:100%}.zigbee-container .params .param-value .numeric .row{background:none}.zigbee-container .params .param-value .numeric .row:hover{background:none}.zigbee-container .params .param-value .numeric .value-min,.zigbee-container .params .param-value .numeric .value-max{width:50%;font-size:.85em;opacity:.75}.zigbee-container .params .param-value .numeric .value-min{text-align:left}.zigbee-container .params .param-value .numeric .value-max{text-align:right}.zigbee-container .btn-value-name-edit{padding:0}.zigbee-container .modal .section .header{background:none;padding:.5em 0}.zigbee-container .modal .section .body{padding:0}.zigbee-container .modal .network-info{min-width:600pt}.zigbee-container .error{color:#a00}.zigbee-container .device .actions .row,.zigbee-container .group .actions .row{cursor:pointer}.zigbee-container .device form,.zigbee-container .group form{margin-bottom:0}.zigbee-container .device .param-value input[type=text],.zigbee-container .group .param-value input[type=text]{text-align:right}

View file

@ -1 +0,0 @@
.fa.fa-zwave:before{content:' ';background:url('/static/img/icons/z-wave-logo.png');background-size:1em 1em;width:1em;height:1em;display:inline-block}.zwave-container{height:100%;padding:0 .5em;background:#f1f1f1;display:flex;flex-direction:column;align-items:center;overflow:auto}.zwave-container .no-items{padding:2em;font-size:1.5em;color:#555;display:flex;align-items:center;justify-content:center}.zwave-container .view-options{display:flex;width:100%;justify-content:space-between;padding:1em 0}.zwave-container .view-options .view-selector{display:inline-flex}.zwave-container .view-options .buttons{display:inline-flex}.zwave-container .view-options select{width:100%;border-radius:1em}.zwave-container .btn-default{border:0;padding:0 1em}.zwave-container .btn-default:hover{border:1px solid #ddd;border-radius:1em}.zwave-container .buttons{text-align:right}.zwave-container .view{min-width:400pt;max-width:750pt;background:#fff;border:1px solid #d8d8d8;border-radius:1.5em;box-shadow:1px 2px 2px #ccc}.zwave-container .item.selected{box-shadow:0 2px 4px 0 #bbb}.zwave-container .item .name{padding:1em;cursor:pointer;text-transform:uppercase;letter-spacing:.06em}.zwave-container .item .name.selected{border-radius:1.5em}.zwave-container .item:hover{background:#def6ea}.zwave-container .item:not(:last-child){border-bottom:1px solid #ddd}.zwave-container .item:first-child{border-radius:1.5em 1.5em 0 0}.zwave-container .item:last-child{border-radius:0 0 1.5em 1.5em}.zwave-container .params{background:#fff;padding-bottom:1em}.zwave-container .params .section{display:flex;flex-direction:column;padding:0 1em}.zwave-container .params .section:not(:first-child){padding-top:1em}.zwave-container .params .section .header{display:flex;align-items:center;font-weight:bold;border-bottom:1px solid #e8e8e8}.zwave-container .params .row{display:flex;align-items:center;border-radius:1em;padding:.3em}.zwave-container .params .row:nth-child(even){background:#ededed}.zwave-container .params .row:nth-child(odd){background:#fff}.zwave-container .params .row:hover{background:#def6ea}.zwave-container .params .param-name{display:inline-flex;width:40%;margin-left:1%;vertical-align:top;letter-spacing:.04em}.zwave-container .params .param-value{display:inline-block;width:58%;text-align:right}.zwave-container .params .param-value .value-edit{display:flex;align-items:center}.zwave-container .params .param-value .value-data{display:inline-block;font-weight:bold}.zwave-container .params .param-value .slider-container{display:flex;align-items:center}.zwave-container .params .param-value .unit{font-size:.8em;margin-left:1em;display:inline}.zwave-container .params .param-value select{width:100%;border-radius:2em}.zwave-container .params .param-value .numeric input.slider{text-align:left}.zwave-container .params .param-value .numeric input[type=text]{text-align:right;width:100%}.zwave-container .params .param-value .numeric .row{background:none}.zwave-container .params .param-value .numeric .row:hover{background:none}.zwave-container .params .param-value .numeric .value-min,.zwave-container .params .param-value .numeric .value-max{width:50%;font-size:.85em;opacity:.75}.zwave-container .params .param-value .numeric .value-min{text-align:left}.zwave-container .params .param-value .numeric .value-max{text-align:right}.zwave-container .btn-value-name-edit{padding:0}.zwave-container .modal .section .header{background:none;padding:.5em 0}.zwave-container .modal .section .body{padding:0}.zwave-container .modal .network-info{min-width:600pt}.zwave-container .error{color:#a00}.zwave-container .node .actions .row,.zwave-container .scene .actions .row{cursor:pointer}.zwave-container .node form,.zwave-container .scene form{margin-bottom:0}

View file

@ -1,427 +0,0 @@
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
/**
* 1. Set default font family to sans-serif.
* 2. Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
html {
font-family: sans-serif; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/**
* Remove default margin.
*/
body {
margin: 0;
}
/* HTML5 display definitions
========================================================================== */
/**
* Correct `block` display not defined for any HTML5 element in IE 8/9.
* Correct `block` display not defined for `details` or `summary` in IE 10/11
* and Firefox.
* Correct `block` display not defined for `main` in IE 11.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block;
}
/**
* 1. Correct `inline-block` display not defined in IE 8/9.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/
audio,
canvas,
progress,
video {
display: inline-block; /* 1 */
vertical-align: baseline; /* 2 */
}
/**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address `[hidden]` styling not present in IE 8/9/10.
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
*/
[hidden],
template {
display: none;
}
/* Links
========================================================================== */
/**
* Remove the gray background color from active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* Improve readability when focused and also mouse hovered in all browsers.
*/
a:active,
a:hover {
outline: 0;
}
/* Text-level semantics
========================================================================== */
/**
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
}
/**
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
*/
b,
strong {
font-weight: bold;
}
/**
* Address styling not present in Safari and Chrome.
*/
dfn {
font-style: italic;
}
/**
* Address variable `h1` font-size and margin within `section` and `article`
* contexts in Firefox 4+, Safari, and Chrome.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
* Address styling not present in IE 8/9.
*/
mark {
background: #ff0;
color: #000;
}
/**
* Address inconsistent and variable font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/* Embedded content
========================================================================== */
/**
* Remove border when inside `a` element in IE 8/9/10.
*/
img {
border: 0;
}
/**
* Correct overflow not hidden in IE 9/10/11.
*/
svg:not(:root) {
overflow: hidden;
}
/* Grouping content
========================================================================== */
/**
* Address margin not present in IE 8/9 and Safari.
*/
figure {
margin: 1em 40px;
}
/**
* Address differences between Firefox and other browsers.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
/**
* Contain overflow in all browsers.
*/
pre {
overflow: auto;
}
/**
* Address odd `em`-unit font size rendering in all browsers.
*/
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
/* Forms
========================================================================== */
/**
* Known limitation: by default, Chrome and Safari on OS X allow very limited
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct color not being inherited.
* Known issue: affects color of disabled elements.
* 2. Correct font properties not being inherited.
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
*/
button,
input,
optgroup,
select,
textarea {
color: inherit; /* 1 */
font: inherit; /* 2 */
margin: 0; /* 3 */
}
/**
* Address `overflow` set to `hidden` in IE 8/9/10/11.
*/
button {
overflow: visible;
}
/**
* Address inconsistent `text-transform` inheritance for `button` and `select`.
* All other form control elements do not inherit `text-transform` values.
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
* Correct `select` style inheritance in Firefox.
*/
button,
select {
text-transform: none;
}
/**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/
button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
}
/**
* Re-set default cursor for disabled elements.
*/
button[disabled],
html input[disabled] {
cursor: default;
}
/**
* Remove inner padding and border in Firefox 4+.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
*/
input {
line-height: normal;
}
/**
* It's recommended that you don't attempt to style these elements.
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome
* (include `-moz` to future-proof).
*/
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
/**
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Define consistent border, margin, and padding.
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct `color` not being inherited in IE 8/9/10/11.
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
*/
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
}
/**
* Remove default vertical scrollbar in IE 8/9/10/11.
*/
textarea {
overflow: auto;
}
/**
* Don't inherit the `font-weight` (applied by a rule above).
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
*/
optgroup {
font-weight: bold;
}
/* Tables
========================================================================== */
/**
* Remove most spacing between table cells.
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}

View file

@ -1,418 +0,0 @@
/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/
/* Table of contents
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/
/* Grid
*/
.container {
position: relative;
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box; }
.column,
.columns {
width: 100%;
float: left;
box-sizing: border-box; }
/* For devices larger than 400px */
@media (min-width: 400px) {
.container {
width: 85%;
padding: 0; }
}
/* For devices larger than 550px */
@media (min-width: 550px) {
.container {
width: 80%; }
.column,
.columns {
margin-left: 4%; }
.column:first-child,
.columns:first-child {
margin-left: 0; }
.one.column,
.one.columns { width: 4.66666666667%; }
.two.columns { width: 13.3333333333%; }
.three.columns { width: 22%; }
.four.columns { width: 30.6666666667%; }
.five.columns { width: 39.3333333333%; }
.six.columns { width: 48%; }
.seven.columns { width: 56.6666666667%; }
.eight.columns { width: 65.3333333333%; }
.nine.columns { width: 74.0%; }
.ten.columns { width: 82.6666666667%; }
.eleven.columns { width: 91.3333333333%; }
.twelve.columns { width: 100%; margin-left: 0; }
.one-third.column { width: 30.6666666667%; }
.two-thirds.column { width: 65.3333333333%; }
.one-half.column { width: 48%; }
/* Offsets */
.offset-by-one.column,
.offset-by-one.columns { margin-left: 8.66666666667%; }
.offset-by-two.column,
.offset-by-two.columns { margin-left: 17.3333333333%; }
.offset-by-three.column,
.offset-by-three.columns { margin-left: 26%; }
.offset-by-four.column,
.offset-by-four.columns { margin-left: 34.6666666667%; }
.offset-by-five.column,
.offset-by-five.columns { margin-left: 43.3333333333%; }
.offset-by-six.column,
.offset-by-six.columns { margin-left: 52%; }
.offset-by-seven.column,
.offset-by-seven.columns { margin-left: 60.6666666667%; }
.offset-by-eight.column,
.offset-by-eight.columns { margin-left: 69.3333333333%; }
.offset-by-nine.column,
.offset-by-nine.columns { margin-left: 78.0%; }
.offset-by-ten.column,
.offset-by-ten.columns { margin-left: 86.6666666667%; }
.offset-by-eleven.column,
.offset-by-eleven.columns { margin-left: 95.3333333333%; }
.offset-by-one-third.column,
.offset-by-one-third.columns { margin-left: 34.6666666667%; }
.offset-by-two-thirds.column,
.offset-by-two-thirds.columns { margin-left: 69.3333333333%; }
.offset-by-one-half.column,
.offset-by-one-half.columns { margin-left: 52%; }
}
/* Base Styles
*/
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
font-size: 62.5%; }
body {
font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
line-height: 1.6;
font-weight: 400;
font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #222; }
/* Typography
*/
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: 2rem;
font-weight: 300; }
h1 { font-size: 4.0rem; line-height: 1.2; letter-spacing: -.1rem;}
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
h3 { font-size: 3.0rem; line-height: 1.3; letter-spacing: -.1rem; }
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
h5 { font-size: 1.8rem; line-height: 1.5; letter-spacing: -.05rem; }
h6 { font-size: 1.5rem; line-height: 1.6; letter-spacing: 0; }
/* Larger than phablet */
@media (min-width: 550px) {
h1 { font-size: 5.0rem; }
h2 { font-size: 4.2rem; }
h3 { font-size: 3.6rem; }
h4 { font-size: 3.0rem; }
h5 { font-size: 2.4rem; }
h6 { font-size: 1.5rem; }
}
p {
margin-top: 0; }
/* Links
*/
a {
color: #1EAEDB; }
a:hover {
color: #0FA0CE; }
/* Buttons
*/
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
display: inline-block;
height: 38px;
padding: 0 30px;
color: #555;
text-align: center;
font-size: 11px;
font-weight: 600;
line-height: 38px;
letter-spacing: .1rem;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border-radius: 4px;
border: 1px solid #bbb;
cursor: pointer;
box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
color: #333;
border-color: #888;
outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
color: #FFF;
background-color: #33C3F0;
border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
color: #FFF;
background-color: #1EAEDB;
border-color: #1EAEDB; }
/* Forms
*/
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
height: 38px;
padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
background-color: #fff;
border: 1px solid #D1D1D1;
border-radius: 4px;
box-shadow: none;
box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none; }
textarea {
min-height: 65px;
padding-top: 6px;
padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
border: 1px solid #33C3F0;
outline: 0; }
label,
legend {
display: block;
margin-bottom: .5rem;
font-weight: 600; }
fieldset {
padding: 0;
border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
display: inline; }
label > .label-body {
display: inline-block;
margin-left: .5rem;
font-weight: normal; }
/* Lists
*/
ul {
list-style: circle inside; }
ol {
list-style: decimal inside; }
ol, ul {
padding-left: 0;
margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
margin: 1.5rem 0 1.5rem 3rem;
font-size: 90%; }
li {
margin-bottom: 1rem; }
/* Code
*/
code {
padding: .2rem .5rem;
margin: 0 .2rem;
font-size: 90%;
white-space: nowrap;
background: #F1F1F1;
border: 1px solid #E1E1E1;
border-radius: 4px; }
pre > code {
display: block;
padding: 1rem 1.5rem;
white-space: pre; }
/* Tables
*/
th,
td {
padding: 12px 15px;
text-align: left;
border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
padding-left: 0; }
th:last-child,
td:last-child {
padding-right: 0; }
/* Spacing
*/
button,
.button {
margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
margin-bottom: 2.5rem; }
/* Utilities
*/
.u-full-width {
width: 100%;
box-sizing: border-box; }
.u-max-full-width {
max-width: 100%;
box-sizing: border-box; }
.u-pull-right {
float: right; }
.u-pull-left {
float: left; }
/* Misc
*/
hr {
margin-top: 3rem;
margin-bottom: 3.5rem;
border-width: 0;
border-top: 1px solid #E1E1E1; }
/* Clearing
*/
/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
content: "";
display: table;
clear: both; }
/* Media Queries
*/
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/
/* Larger than mobile */
@media (min-width: 400px) {}
/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}
/* Larger than tablet */
@media (min-width: 750px) {}
/* Larger than desktop */
@media (min-width: 1000px) {}
/* Larger than Desktop HD */
@media (min-width: 1200px) {}

View file

@ -1,46 +0,0 @@
.fade-in {
--duration: $fade-in-transition-duration;
animation-name: fadeIn;
animation-timing-function: ease-in;
animation-duration: var(--duration);
animation-fill-mode:both;
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.roll-in {
--duration: $roll-in-transition-duration;
animation-name: rollIn;
animation-timing-function: ease-in;
animation-duration: var(--duration);
animation-fill-mode:both;
}
@keyframes rollIn {
0% {
opacity: 0;
transform:translateX(-100%);
}
100% {
opacity: 1;
transform:translateX(0);
}
}
.active-glow {
@include animation(active-glow 5s infinite);
}
@keyframes active-glow {
0% { background: $active-glow-bg-1; }
50% { background: $active-glow-bg-2; }
100% { background: $active-glow-bg-1; }
}

View file

@ -1,41 +0,0 @@
//// General purpose classes and rules /////
.hidden {
display: none !important;
}
.selected {
background: $selected-bg;
}
.pull-right {
text-align: right !important;
}
.clickable {
cursor: pointer;
}
a:focus {
outline: none;
}
::-moz-focus-outer,
::-moz-focus-inner {
border: 0;
}
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #000;
}
//// UI elements definitions /////
@import 'common/elements/button';
@import 'common/elements/switch';
@import 'common/elements/range-slider';
@import 'common/elements/slider';
@import 'common/elements/text';
@import 'common/elements/dropdown';
@import 'common/elements/autocomplete';

View file

@ -1,33 +0,0 @@
.autocomplete {
/*the container must be positioned relative:*/
position: relative;
display: inline-block;
}
.autocomplete-items {
position: absolute;
border: $default-border-2;
border-bottom: none;
border-top: none;
z-index: 99;
/*position the autocomplete items to be the same width as the container:*/
top: 100%;
left: 0;
right: 0;
}
.autocomplete-items div {
padding: 1em;
cursor: pointer;
border-bottom: $default-border-2;
background-color: $autocomplete-bg;
}
.autocomplete-items div:hover {
background-color: $hover-bg;
}
.autocomplete-active {
background-color: $selected-bg !important;
}

View file

@ -1,12 +0,0 @@
button[disabled],
.button[disabled] {
color: #bbb;
background: rgba(240,240,240,1);
border: 1px solid;
}
.btn-primary {
background-color: #d8ffe0 !important;
border: 1px solid #c2f0cf !important;
}

View file

@ -1,26 +0,0 @@
@import 'common/vars';
.dropdown {
position: absolute;
background: $default-bg-3;
border-radius: .75rem;
border: $default-border-3;
box-shadow: $dropdown-shadow;
min-width: 15rem;
.item {
margin: 0 !important;
padding: 1rem;
cursor: pointer;
&.disabled {
color: $dropdown-disabled-color;
cursor: initial;
}
.icon {
margin: 0 .75rem;
}
}
}

View file

@ -1,59 +0,0 @@
@supports (--css: variables) {
.input-range-container {
position: relative;
}
input[type="range"].multirange {
padding: 0;
margin: 0;
display: inline-block;
vertical-align: top;
opacity: 1 !important;
&.original {
position: absolute;
&::-webkit-slider-thumb {
position: relative;
z-index: 2;
}
&::-moz-range-thumb {
transform: scale(1); /* FF doesn't apply position it seems */
z-index: 1;
}
}
&::-moz-range-track {
border-color: transparent; /* needed to switch FF to "styleable" control */
}
&.ghost {
position: relative;
background: var(--track-background);
--track-background: linear-gradient(to right,
transparent var(--low), var(--range-color) 0,
var(--range-color) var(--high), transparent 0
) no-repeat 0 45% / 100% 40%;
--range-color: $slider-progress-bg;
&::-webkit-slider-runnable-track,
&::-moz-range-track {
background: var(--track-background);
height: 15px;
}
}
&[disabled]::-webkit-slider-thumb,
&[disabled]::-moz-range-thumb {
display: none;
}
&::-webkit-progress-value,
&::-moz-range-progress {
@include appearance(none);
background: none;
}
}
}

View file

@ -1,62 +0,0 @@
@import 'common/mixins';
.slider {
@include appearance(none);
@include transition(opacity .2s);
width: 100%;
height: 15px;
border-radius: 5px;
background: $slider-bg;
outline: none;
// Cursed be thy name Chrome for forcing designers to this hysterical redundancy
&::-webkit-slider-thumb {
@include appearance(none);
width: 25px;
height: 25px;
border-radius: 50%;
border: 0;
background: $slider-thumb-bg;
cursor: pointer;
}
&::-moz-range-thumb {
@include appearance(none);
width: 25px;
height: 25px;
border-radius: 50%;
border: 0;
background: $slider-thumb-bg;
cursor: pointer;
}
&[disabled]::-webkit-slider-thumb {
display: none;
width: 0;
}
&[disabled]::-moz-range-thumb {
display: none;
width: 0;
}
&.disabled { opacity: 0.3; }
&::-moz-range-track {
@include appearance(none);
}
&::-moz-range-progress {
background: $slider-progress-bg;
height: 15px;
}
&[disabled]::-webkit-progress-value {
background: none;
}
&[disabled]::-moz-range-progress {
background: none;
}
}

View file

@ -1,109 +0,0 @@
@import url(https://fonts.googleapis.com/css?family=Francois+One);
@import url(https://fonts.googleapis.com/css?family=PT+Sans);
@font-face {
font-family: 'Audiowide';
font-style: normal;
font-weight: 400;
src: local("Audiowide"), local("Audiowide-Regular"), url(http://themes.googleusercontent.com/static/fonts/audiowide/v2/8XtYtNKEyyZh481XVWfVOj8E0i7KZn-EPnyo3HZu7kw.woff) format("woff");
}
.switch {
display: inline-block;
text-align: center;
user-select: none;
padding: .5rem 0;
input[type=checkbox] {
display: none !important;
}
label, label:before, label:after,
input[type=checkbox], input[type=checkbox]:before, input[type=checkbox]:after,
.feature, .feature:before, .feature:after {
transition: all 250ms ease-in;
}
label:before, label:after,
input[type=checkbox]:before, input[type=checkbox]:after,
.feature:before, .feature:after {
content: '';
display: block;
}
label {
position: relative;
width: 50px;
height: 50px;
background-color: $switch-bg-1;
border-radius: 50%;
box-shadow: $switch-shadow-1;
display: block;
margin: .5rem auto 0 auto;
font-size: 1.4em;
transition: all 350ms ease-in;
&:before {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 22.7272727273px;
height: 22.7272727273px;
border-radius: 50%;
background-color: $switch-bg-2;
box-shadow: $switch-shadow-2;
}
&:after {
position: absolute;
left: 50%;
top: 35%;
transform: translate(-50%, -50%);
width: 4px;
height: 12px;
background-color: $switch-bg-3;
box-shadow: $switch-shadow-3;
}
&:before, &:after {
transition-duration: 150ms;
}
&:hover {
cursor: pointer;
&:before { box-shadow: $switch-shadow-hover; }
&:after { background-color: $switch-bg-hover; }
}
}
input[type=checkbox]:checked + label {
box-shadow: $switch-shadow-checked-1;
&:before { box-shadow: $switch-shadow-checked-2; }
&:after { background-color: $switch-bg-checked; }
}
&.glow {
label {
background-color: $switch-bg-glow-2;
box-shadow: $switch-shadow-glow-1;
&:before { box-shadow: $switch-shadow-glow-2; }
&:after {
background-color: $switch-bg-glow-3;
}
label:hover {
&:before { box-shadow: $switch-shadow-glow-hover; }
&:after { background-color: $switch-bg-glow-hover; }
}
}
input[type=checkbox]:checked + label {
box-shadow: $switch-shadow-glow-checked-1;
&:before { box-shadow: $switch-shadow-glow-checked-2; }
&:after { background-color: $switch-bg-glow-checked; }
}
}
}

View file

@ -1,26 +0,0 @@
@import 'common/vars';
.input-icon {
position: absolute;
min-width: 3rem;
padding: 1rem;
color: $text-icon-color;
}
input[type=text],
input[type=password] {
border-radius: 5rem;
&:hover {
border: $border-hover;
}
&:focus {
border: $border-focus;
}
&.with-icon {
padding-left: 3rem;
}
}

View file

@ -1,102 +0,0 @@
$widths: (
s: '(max-width: 720px)',
m: '(max-width: 1024px) and (min-width: 720px)',
l: '(min-width: 1024px)',
);
@for $i from 1 through 12 {
.col-#{$i} {
float: left;
box-sizing: border-box;
@if $i < 12 {
width: (4.66666666667%*$i) + (4% * if($i > 1, $i - 1, 0));
margin-left: 4%;
} @else {
width: 100%;
margin-left: 0;
}
&:first-child {
margin-left: 0;
}
}
.col-no-margin-#{$i} {
float: left;
box-sizing: border-box;
width: ((100%/12)*$i);
margin: 0;
}
@if $i < 12 {
.col-offset-#{$i}:first-child {
margin-left: (8.66666666667%*$i) !important;
}
.col-offset-#{$i}:not(first-child) {
margin-left: 4% + (8.66666666667%*$i) !important;
}
}
}
@each $size, $width in $widths {
@media #{$width} {
@for $i from 1 through 12 {
.col-#{$size}-#{$i} {
float: left;
box-sizing: border-box;
@if $i < 12 {
width: (4.66666666667%*$i) + (4% * if($i > 1, $i - 1, 0));
margin-left: 4%;
} @else {
width: 100%;
margin-left: 0;
}
&:first-child {
margin-left: 0;
}
}
@if $i < 12 {
.col-offset-#{$size}-#{$i} {
margin-left: (8.66666666667%*$i);
}
}
.col-no-margin-#{$size}-#{$i} {
float: left;
box-sizing: border-box;
width: ((100%/12)*$i);
}
}
.#{$size}-hidden {
display: none !important;
}
.#{$size}-visible {
display: block !important;
}
}
}
@media (min-width: 720px) and (orientation:portrait) {
body {
font-size: $default-font-size-vertial;
}
}
.vertical-center {
display: flex;
align-items: center;
}
.horizontal-center {
display: flex;
justify-content: center;
margin-left: auto;
margin-right: auto;
}

View file

@ -1,37 +0,0 @@
@mixin appearance($value) {
-webkit-appearance: $value;
-ms-appearance: $value;
-o-appearance: $value;
-ms-appearance: $value;
appearance: $value;
}
@mixin transition($value) {
-webkit-transition: $value;
-ms-transition: $value;
-o-transition: $value;
-ms-transition: $value;
transition: $value;
}
@mixin animation($value) {
-webkit-animation: $value;
-ms-animation: $value;
-o-animation: $value;
-ms-animation: $value;
animation: $value;
}
@mixin box-shadow($value) {
-webkit-box-shadow: $value;
-o-box-shadow: $value;
-ms-box-shadow: $value;
box-shadow: $value;
}
@mixin calc($property, $expression) {
#{$property}: -webkit-calc( #{$expression} );
#{$property}: -moz-calc( #{$expression} );
#{$property}: calc( #{$expression} );
}

View file

@ -1,49 +0,0 @@
.modal-container {
position: fixed;
display: flex;
align-items: center;
justify-content: center;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: var(--z-index);
background: rgba(10,10,10,0.9);
.modal {
--width: auto;
--height: auto;
width: var(--width);
height: var(--height);
.header {
border-radius: 1rem 1rem 0 0;
}
.body:first-child {
border-radius: 1rem;
}
.body:not(first-child) {
border-radius: 0 0 1rem 1rem;
}
.header {
border-bottom: $modal-header-border;
padding: .5rem;
text-align: center;
background: $modal-header-bg;
text-transform: uppercase;
letter-spacing: .1rem;
line-height: 3.8rem;
}
.body {
max-height: 75vh;
overflow: auto;
padding: 2.5rem 2rem 1.5rem 2rem;
background: $modal-body-bg;
}
}
}

View file

@ -1,73 +0,0 @@
#notifications {
position: fixed;
bottom: 0;
right: 0;
width: 25em;
z-index: 1000;
.notification {
background: $notification-bg;
border: $notification-border;
border-radius: .5rem;
margin-bottom: 1rem;
margin-right: 1rem;
cursor: pointer;
&:hover {
background: $notification-hover-bg;
&.warning { background: $notification-warning-hover-bg; }
&.error { background: $notification-error-hover-bg; }
}
&.warning {
background: $notification-warning-bg;
border: $notification-warning-border;
.image { --color: $notification-warning-icon-color; }
}
&.error {
background: $notification-error-bg;
border: $notification-error-border;
.image { --color: $notification-error-icon-color; }
}
.title {
padding: .4rem;
line-height: 3rem;
letter-spacing: .1rem;
font-weight: bold;
}
.body {
@extend .vertical-center;
height: 6em;
overflow: hidden;
padding-bottom: 1rem;
letter-spacing: .05rem;
}
.image {
height: 100%;
text-align: center;
--color: $notification-icon-color;
.row {
@extend .vertical-center;
@extend .horizontal-center;
width: 100%;
height: 100%;
.fa {
font-size: 2.5rem;
color: var(--color);
}
img {
width: 80%;
height: 80%;
}
}
}
}
}

View file

@ -1,113 +0,0 @@
//// Common defaults
$default-bg: white !default;
$default-bg-2: #f4f5f6 !default;
$default-bg-3: #f1f3f2 !default;
$default-bg-4: #edf0ee !default;
$default-bg-5: #f8f8f8 !default;
$default-bg-6: #e4e4e4 !default;
$default-fg: black !default;
$default-fg-2: #333333 !default;
$default-fg-3: #888888 !default;
$default-font-size: 15px !default;
$default-font-size-vertial: 25px !default;
$default-shadow: 2px 2px 2px #ccc !default;
$default-hover-fg: #35b870 !default;
$default-hover-fg-2: #38cf80 !default;
$default-font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$default-border: 1px solid #e1e4e8 !default;
$default-border-2: 1px solid #dddddd !default;
$default-border-3: 1px solid #cccccc !default;
$default-bottom: $default-border !default;
$default-link-fg: #5f7869 !default;
$font-size: $default-font-size !default;
$selected-bg: #c8ffd0 !default;
$hover-bg: #def6ea !default;
$header-bg: $default_bg !default;
$nav-height: 4.5rem !default;
$nav-bg: #e8e8e8 !default;
$nav-fg: $default-link-fg;
$nav-margin: .2rem;
$nav-date-time-shadow: .2rem .2rem .2rem #ccc !default;
//// Animations defaults
$transition-duration: .5s !default;
$fade-transition-duration: $transition-duration !default;
$roll-transition-duration: $transition-duration !default;
$fade-in-transition-duration: $fade-transition-duration !default;
$fade-out-transition-duration: $fade-transition-duration !default;
$roll-in-transition-duration: $roll-transition-duration !default;
$roll-out-transition-duration: $roll-transition-duration !default;
$active-glow-bg-1: #d4ffe3 !default;
$active-glow-bg-2: #9cdfb0 !default;
//// Notifications
$notification-bg: rgba(185, 255, 193, 0.9) !default;
$notification-hover-bg: rgba(160,245,178,0.95) !default;
$notification-warning-bg: rgba(228, 255, 78, 0.9) !default;
$notification-warning-hover-bg: rgba(218, 245, 68, 0.95) !default;
$notification-error-bg: rgba(255, 100, 100, 0.9) !default;
$notification-error-hover-bg: rgba(245, 90, 90, 0.95) !default;
$notification-border: 1px solid rgba(109, 205, 134, 0.62) !default;
$notification-warning-border: 1px solid rgba(205, 205, 109, 0.62) !default;
$notification-error-border: 1px solid rgba(205, 109, 109, 0.62) !default;
$notification-title-border: 1px solid rgba(83, 158, 102, 0.43) !default;
$notification-icon-color: black !default;
$notification-warning-icon-color: #662 !default;
$notification-error-icon-color: #8b0000 !default;
//// Switch element
$switch-bg-1: #f9f8f6 !default;
$switch-bg-2: #38ffa0 !default;
$switch-bg-3: #cccccc !default;
$switch-bg-hover: #b3b3b3 !default;
$switch-bg-checked: #38ffa0 !default;
$switch-bg-glow-1: #111111 !default;
$switch-bg-glow-2: #ffffff !default;
$switch-bg-glow-3: #aaaaaa !default;
$switch-bg-glow-hover: #ffffff !default;
$switch-bg-glow-checked: #00e094 !default;
$switch-shadow-1: 0 5px 10px 0px #333, 0 15px 20px 0px #cccccc !default;
$switch-shadow-2: inset 0 0 0 5px #ccc, inset 0 0 0 14px #f9f8f6 !default;
$switch-shadow-3: 0 0 0 2.5px #f9f8f6 !default;
$switch-shadow-hover: inset 0 0 0 5px #b3b3b3, inset 0 0 0 14px #f9f8f6 !default;
$switch-shadow-checked-1: 0 2px 5px 0px gray, 0 15px 20px 0px transparent !default;
$switch-shadow-checked-2: inset 0 0 0 5px #38ffa0, inset 0 0 0 14px #f9f8f6 !default;
$switch-shadow-glow-1: 0 5px 10px 0 #aaa, 0 0 0 3px #bbb, 0 0 8px 2px transparent, 0 0 0 6px #eee !default;
$switch-shadow-glow-2: inset 0 0 0 5px #aaa, inset 0 0 0 14px #fff !default;
$switch-shadow-glow-hover: inset 0 0 0 5px #fff, inset 0 0 0 14px #fff !default;
$switch-shadow-glow-checked-1: 0 0px 8px 0 #00ad72, 0 0 0 3px #00e094, 0 0 30px 0 #00e094, 0 0 0 6px #fff !default;
$switch-shadow-glow-checked-2: inset 0 0 0 5px #00e094, inset 0 0 0 14px #fff !default;
//// Slider element
$slider-bg: #e4e4e4 !default;
$slider-thumb-bg: rgba(0,215,80,1.0) !default;
$slider-thumb-disabled-bg: rgba(0,215,80,0.3) !default;
$slider-hover-on-hover-bg: #d2d2d2 !default;
$slider-progress-bg: rgba(0,215,80,0.2) !default;
//// Input element
$text-icon-color: #888;
$border-focus: 1px solid rgba(127, 216, 95, 0.83);
$border-hover: 1px solid rgba(159, 180, 152, 0.83);
$text-shadow: 2px 2px 2px #d4d4d4;
//// Header style
$header-bottom: $default-bottom;
//// Dropdown element
$dropdown-bg: rgba(241,243,242,0.9) !default;
$dropdown-disabled-color: #999 !default;
$dropdown-shadow: 1px 1px 1px #bbb !default;
//// Modal element
$modal-header-bg: #f0f0f0 !default;
$modal-header-border: 1px solid #ccc !default;
$modal-body-bg: white !default;
//// Autocomplete element
$autocomplete-bg: white !default;

View file

@ -1,60 +0,0 @@
@import 'common/vars';
@import 'common/mixins';
@import 'common/layout';
@import 'common/elements';
@import 'common/animations';
@import 'common/modal';
@import 'common/notifications';
$background-image: url('/img/dashboard-background.jpg') !default;
$background-color: white !default;
$font-family: Lato !default;
html {
min-height: 100%;
}
body {
--background-image: $background-image;
--background-color: $background-color;
background-image: var(--background-image) !important;
background-color: var(--background-color);
background-size: 100% 100%;
background-repeat: no-repeat;
font-family: $font-family;
}
main {
display: flex;
flex-flow: column;
width: 100%;
height: 100vh;
margin: 0;
.widgets-row {
height: calc(50% - 3em);
margin: 2em 1em;
display: flex;
}
.widget {
background: $background-color;
border-radius: 5px;
height: 100%;
overflow: hidden;
box-shadow: 0 3px 3px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);
}
}
#widgets-container {
height: 100%;
}
@for $i from 1 through 10 {
.row-#{$i} {
height: $i * 100% !important;
}
}

View file

@ -1,21 +0,0 @@
@import 'common/vars';
.widget .calendar {
padding: 1rem;
.event {
font-size: .95em;
}
.upcoming-event {
text-align: center;
margin-bottom: 1.5rem;
font-size: 1.2em;
.summary {
text-transform: uppercase;
font-size: 1.3em;
}
}
}

View file

@ -1,48 +0,0 @@
@import 'common/vars';
.widget .date-time-weather {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 1rem;
.date {
font-size: 1.3em;
height: 10%;
}
.time {
font-size: 2em;
height: 14%;
}
.weather {
height: 35%;
display: flex;
align-items: center;
.temperature {
font-size: 2em;
margin-left: 1rem;
}
}
.summary {
height: 28%;
}
.sensors {
width: 100%;
height: 13%;
.sensor {
padding: 0 1rem;
}
.humidity {
text-align: right;
}
}
}

View file

@ -1,30 +0,0 @@
@import 'common/vars';
.widget .image-carousel {
height: 100%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(0,0,0,0);
.background {
position: absolute;
top: 0;
width: 100%;
height: 100vh;
background-color: rgba(0,0,0,0);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
filter: blur(13px);
-webkit-filter: blur(13px);
}
img {
position: absolute;
max-height: 100%;
z-index: 2;
}
}

View file

@ -1,93 +0,0 @@
@import 'common/vars';
$progress-bar-bg: #ddd;
$playback-status-color: #757f70;
.widget .music {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: relative;
.track {
text-align: center;
.unknown,
.no-track {
font-size: 2em;
}
.artist {
font-size: 1.9em;
font-weight: bold;
margin-bottom: .25em;
}
.title {
font-size: 1.8em;
}
}
.time {
width: 100%;
margin-top: 1em;
font-size: 1.2em;
.row {
padding: 0 .5em;
}
.time-total {
text-align: right;
}
.progress-bar {
width: 100%;
height: 1em;
position: relative;
margin-bottom: .75em;
.total {
position: absolute;
width: 100%;
height: 100%;
top: 0;
background: $progress-bar-bg;
border-radius: 5rem;
}
.elapsed {
position: absolute;
width: 100%;
height: 100%;
top: 0;
background: $selected-bg;
border-radius: 5rem;
z-index: 1;
}
}
}
.playback-status {
position: absolute;
bottom: 0;
border-top: $default-border-2;
color: $playback-status-color;
width: 100%;
height: 2em;
.status-property {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.active {
color: $default-hover-fg;
}
}
}

View file

@ -1,29 +0,0 @@
@import 'common/vars';
.widget .rss-news {
height: 100%;
display: flex;
align-items: center;
.article {
width: 90%;
padding: 0 2em;
.source {
font-size: 1.7em;
font-weight: bold;
margin-bottom: .5em;
}
.title {
font-size: 1.7em;
margin-bottom: .5em;
}
.published {
text-align: right;
font-size: 1em;
}
}
}

View file

@ -1,46 +0,0 @@
@import 'common/vars';
@import 'common/mixins';
@import 'common/layout';
@import 'common/elements';
body {
width: 100vw;
height: 100vh;
margin: 0;
overflow-x: hidden;
font-family: $default-font-family;
font-size: $default-font-size;
}
main {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
margin: 0;
form {
border: $default-border-3;
border-radius: 3em;
padding: 4em;
.row {
margin: 1em 0;
}
input[type=text],
input[type=password] {
width: 100%;
}
input[type=submit] {
border-radius: 1em;
}
}
}
a {
color: $default-link-fg;
}

View file

@ -1 +0,0 @@
login

View file

@ -1,111 +0,0 @@
@import 'common/vars';
@import 'common/mixins';
@import 'common/layout';
@import 'common/elements';
@import 'common/animations';
@import 'common/modal';
@import 'common/notifications';
@import 'settings/users';
@import 'settings/token';
$nav-background: #f0f0f0;
$section-header-background: #eee;
body {
width: 100%;
height: 100%;
margin: 0;
overflow-x: hidden;
font-family: $default-font-family;
font-size: $default-font-size;
}
#app {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: row;
nav {
background: $nav-background;
color: $default-link-fg;
border-right: $default-border-3;
ul {
width: 100%;
height: 100%;
margin: 0;
overflow: auto;
list-style-type: none;
li {
display: flex;
margin: 0;
padding: 1em;
cursor: pointer;
&:not(:first-of-type) {
border-top: $default-border-3;
}
&:hover {
background: $hover-bg;
}
a:first-child {
width: 100%;
}
}
}
}
main {
margin: 0;
flex: 1 1 auto;
overflow: hidden;
height: inherit;
.section {
overflow: auto;
height: inherit;
header {
display: flex;
align-items: center;
border-bottom: $default-border-2;
background: $section-header-background;
h1 {
margin: .45em .2em;
}
button {
border: 0;
&:hover {
color: $default-hover-fg;
}
}
}
}
}
a {
color: $default-link-fg;
}
}
.dropdown {
.item {
display: flex;
flex-direction: row;
cursor: pointer;
&:hover {
background: $hover-bg;
}
}
}

View file

@ -1,21 +0,0 @@
#token {
.warning {
background: $notification-error-bg;
border: $notification-error-border;
margin: 1em;
padding: 1em;
border-radius: 1em;
}
.token-container {
display: flex;
align-items: center;
justify-content: center;
margin: 2em;
input {
width: 100%;
}
}
}

View file

@ -1,27 +0,0 @@
#users {
ul {
list-style-type: none;
li {
margin: 0;
padding: 1em .5em;
border-bottom: $default-border-3;
cursor: pointer;
&:hover {
background: $hover-bg;
}
}
}
form {
display: flex;
flex-direction: column;
width: 20em;
input {
margin: 1em .5em;
}
}
}

View file

@ -1,53 +0,0 @@
@import 'common/vars';
@import 'common/mixins';
@import 'common/layout';
@import 'common/elements';
@import 'common/animations';
@import 'common/modal';
@import 'common/notifications';
@import 'nav';
body {
width: 100%;
height: 100%;
margin: 0;
overflow-x: hidden;
font-family: $default-font-family;
font-size: $default-font-size;
}
#app {
display: flex;
flex-flow: column;
height: 100%;
main {
background: $default-bg;
margin: 0;
flex: 1 1 auto;
overflow: hidden;
// nav height hardcoded, calc won't support either CSS4 nor SASS vars
@include calc(height, '100vh - 4.8rem');
.plugins-container {
height: inherit;
.plugin-container {
overflow: auto;
height: inherit;
.plugin {
overflow: auto;
}
}
}
}
a {
color: $default-link-fg;
}
}

View file

@ -1,84 +0,0 @@
:root {
--nav-height: $nav-height;
}
nav {
width: 100%;
position: relative;
height: var(--nav-height);
background: $nav-bg;
margin-bottom: $nav-margin;
border-bottom: $default-bottom;
box-shadow: 0 2.5px 4px 0 #bbb;
flex: 0 1 auto;
z-index: 2;
ul {
position: relative;
width: 75%;
display: inline-flex;
margin: 0;
padding: 0;
list-style-type: none;
align-items: center;
li {
padding: 1rem 1.5rem;
display: inline-block;
margin: 0;
text-transform: uppercase;
letter-spacing: .1rem;
border-radius: 2rem;
&:hover {
background: $hover-bg;
letter-spacing: .4rem;
}
a {
text-decoration: none;
display: block;
color: $nav-fg;
&:hover {
color: $nav-fg;
}
}
}
&:hover {
.decorator {
display: none;
}
li.selected {
border-radius: 2rem;
}
}
}
.date-time {
position: absolute;
width: 25%;
display: inline-block;
right: 0;
margin-right: .7rem;
font-size: 14pt;
text-shadow: $nav-date-time-shadow;
.time {
display: inline-block;
}
}
.settings {
display: inline-block;
padding: .75rem 1rem;
&:hover {
background: $hover-bg;
border-radius: 3rem;
}
}
}

View file

@ -1,34 +0,0 @@
$icon-color: #7e8;
$icon-border: 1px solid #ccc;
$icon-shadow: 2px 2px 2px #ccc;
#assistant-google-modal {
.modal {
width: 50vw;
height: 50vh;
.body {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
.icon {
font-size: 3em;
color: $icon-color;
box-shadow: $icon-shadow;
border: $icon-border;
border-radius: 3em;
padding: .7em 1em .5em 1em;
}
.text {
margin-top: 2.5em;
}
}
}
}

View file

@ -1,39 +0,0 @@
@import 'common/vars';
.camera {
min-height: 90%;
margin-top: 4%;
overflow: auto;
display: flex;
flex-direction: column;
align-items: center;
.camera-container {
min-width: 640px;
min-height: 480px;
position: relative;
background: black;
margin-bottom: 1em;
.frame, .no-frame {
position: absolute;
top: 0;
width: 100%;
height: 100%;
}
.frame {
z-index: 1;
}
.no-frame {
display: flex;
background: rgba(0, 0, 0, 0.1);
color: white;
align-items: center;
justify-content: center;
z-index: 2;
}
}
}

View file

@ -1,116 +0,0 @@
@import 'common/vars';
.camera {
min-height: 90%;
margin-top: 4%;
overflow: auto;
display: flex;
flex-direction: column;
align-items: center;
.camera-container {
position: relative;
background: black;
margin-bottom: 1em;
.frame, .no-frame {
position: absolute;
top: 0;
width: 100%;
height: 100%;
}
.frame {
z-index: 1;
}
.no-frame {
display: flex;
background: rgba(0, 0, 0, 0.1);
color: white;
align-items: center;
justify-content: center;
z-index: 2;
}
}
.url {
width: 640px;
display: flex;
margin: 1em;
.row {
width: 100%;
display: flex;
align-items: center;
}
.name {
width: 140px;
}
input {
width: 500px;
font-weight: normal;
}
}
.params {
margin-top: 1em;
padding: 1em;
width: 640px;
display: flex;
flex-direction: column;
border: $default-border-3;
border-radius: 1em;
label {
font-weight: normal;
}
.head {
display: flex;
justify-content: center;
label {
width: 100%;
display: flex;
justify-content: right;
.name {
margin-right: 1em;
}
}
}
.body {
display: flex;
flex-direction: column;
margin: 0 0 0 -1em;
.row {
width: 100%;
display: flex;
align-items: center;
padding: 0.5em;
.name {
width: 30%;
}
input {
width: 70%;
}
&:nth-child(even) {
background: $default-bg-6;
}
&:hover {
background: $hover-bg;
}
}
}
}
}

View file

@ -1,173 +0,0 @@
@import 'common/vars';
@import 'common/layout';
@import 'webpanel/plugins/execute/vars';
.execute-container {
height: 99%;
color: $default-fg-2;
font-weight: 400;
//line-height: 3.8rem;
//letter-spacing: .1rem;
border-bottom: $default-border-2;
border-radius: 0 0 1em 1em;
.title {
background: $title-bg;
padding: .2em;
border: $title-border;
box-shadow: $title-shadow;
font-size: 1.1em;
}
.request-type-container {
display: flex;
flex-direction: row;
align-items: baseline;
margin: 1em 0 0 1em;
label {
margin: 0 1em 0 .5em;
}
}
.request {
margin: 0 .5em;
form {
margin-bottom: 0 !important;
}
.autocomplete {
width: 80%;
max-width: 60em;
}
.action-name {
box-shadow: $action-name-shadow;
width: 100%;
}
[type=submit] {
margin-left: 2em;
}
.options {
display: flex;
margin-top: .5em;
margin-bottom: 1.5em;
padding-top: .5em;
}
.params {
margin-right: 1.5em;
max-height: 50vh;
overflow: auto;
.param {
margin-bottom: .25em;
}
.action-param-value {
width: 100%;
}
}
.add-param {
width: 100%;
button {
width: 100%;
background: $extra-params-btn-bg;
border: $title-border;
}
}
.extra-param {
display: flex;
margin-bottom: .5em;
.action-extra-param-del {
border: 0;
text-align: right;
padding: 0 .5em;
}
}
.output-container {
max-height: 50vh;
overflow: auto;
.response,
.error,
.doc {
padding: .5em .5em 0 .5em;
border-radius: 1em;
}
.response {
background: $response-bg;
border: $response-border;
}
.error {
background: $error-bg;
border: $error-border;
}
.doc {
background: $doc-bg;
border: $doc-border;
}
}
textarea {
width: 80%;
max-width: 60em;
height: 10em;
border-radius: 1em;
}
}
.raw-request {
.first-row {
display: flex;
flex-direction: row;
}
}
.procedures-container {
.procedure {
border-bottom: $default-border-2;
padding: 1.5em .5em;
cursor: pointer;
&:hover {
background: $hover-bg;
}
&.selected {
background: $selected-bg;
}
form {
display: flex;
margin-bottom: 0 !important;
flex-direction: column;
}
.head {
display: flex;
align-items: center;
}
.btn-container {
text-align: right;
}
button {
background: $procedure-submit-btn-bg;
}
}
}
}

View file

@ -1,14 +0,0 @@
$title-bg: #eee;
$title-border: 1px solid #ddd;
$title-shadow: 0 3px 3px 0 rgba(187,187,187,0.75);
$action-name-shadow: 1px 1px 1px 1px #ddd;
$extra-params-btn-bg: #eee;
$response-bg: #edfff2;
$response-border: 1px dashed #98ff98;
$error-bg: #ffbcbc;
$error-border: 1px dashed #ff5353;
$doc-bg: #e8feff;
$doc-border: 1px dashed #84f9ff;
$procedure-submit-btn-bg: #ebffeb;

View file

@ -1,39 +0,0 @@
@import 'common/vars';
.gpio-container {
display: flex;
flex-direction: column;
height: 100%;
overflow: auto;
.refresh {
border-bottom: $default-border-2;
background: $default-bg-5;
button {
border: 0;
&:hover {
color: $default-hover-fg;
}
}
}
.pins {
.pin {
padding: 1em;
border-bottom: $default-border-2;
display: flex;
flex-direction: row;
align-items: center;
&:nth-child(even) {
background: $modal-header-bg;
}
&:hover {
background: $hover-bg;
}
}
}
}

View file

@ -1,163 +0,0 @@
@import 'common/vars';
@import 'common/layout';
@import 'webpanel/plugins/light.hue/vars';
.light-hue-container {
display: flex;
color: $default-fg-2;
font-weight: 400;
line-height: 3.8rem;
letter-spacing: .1rem;
border-bottom: $default-border-2;
border-radius: 0 0 1em 1em;
%panel {
margin: 1.5rem auto;
padding: 1.5rem;
font-weight: 100;
border: $default-border-2;
border-radius: 1.5rem;
background: $light-hue-properties-bg;
box-shadow: $light-hue-properties-shadow;
}
.groups,
.scenes,
.units {
&:not(:last-child) {
border-right: $default-border-2;
}
.title {
padding: .75rem;
background: $default-bg-2;
border-bottom: $default-border-2;
&:last-child {
border-radius: 0 1rem 0 0;
}
}
.group,
.scene,
.unit,
.animations,
.group-controller {
padding: 1rem;
cursor: pointer;
&:hover {
background: $hover-bg;
}
&:not(:last-child) {
border-bottom: $default-border-2;
}
&:not(.hidden) {
.row {
width: 100%;
}
}
* > .properties {
@extend %panel;
.slider-container {
@extend .vertical-center;
margin: 1rem auto;
}
* > .fa {
font-size: 2.5rem;
color: $light-hue-icon-color;
}
* > .color-logo {
width: 2rem;
height: 2rem;
border-radius: 1rem;
}
* > .color-logo-red { background-color: red; }
* > .color-logo-green { background-color: green; }
* > .color-logo-blue { background-color: blue; }
}
&:hover {
* > .properties {
background: $light-hue-properties-hover-bg;
}
}
}
.group {
text-transform: uppercase;
}
.group-controller {
font-weight: 600;
}
.animations {
.row {
.caption {
font-style: italic;
}
.animation-container {
@extend %panel;
cursor: auto;
.animation {
.row {
padding: 1rem .3333rem;
&:hover {
background: $hover-bg;
border-radius: 1.5rem;
* > input[type=range] {
background: $slider-hover-on-hover-bg;
}
}
}
}
}
select[name=animation-type] {
width: 100%;
}
}
* > .input-range-container {
margin-top: 1rem;
margin-bottom: -1rem;
}
* > input[type="text"] {
width: 100%;
}
&:hover {
.row {
.animation-container {
background: $light-hue-properties-hover-bg;
}
}
}
}
}
.groups {
.title {
border-radius: 1rem 0 0 0;
}
}
.units {
.title {
border-radius: 0 1rem 0 0;
}
}
}

View file

@ -1,5 +0,0 @@
$light-hue-properties-bg: rgba(239,239,240,0.5);
$light-hue-properties-hover-bg: white;
$light-hue-properties-shadow: 0 0 4px 2px rgba(187,187,187,0.75);
$light-hue-icon-color: #555;

View file

@ -1,104 +0,0 @@
.media-plugin {
.controls {
@extend .vertical-center;
width: 100%;
border-top: $default-border-2;
box-shadow: $control-panel-shadow;
flex: 0 0 $control-panel-height;
.item-container {
@extend .vertical-center;
padding-left: 1rem;
line-height: 2.6rem;
.item-info {
font-size: 1.15em;
letter-spacing: .02em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
cursor: pointer;
&:hover {
color: $default-hover-fg;
}
}
}
button {
&:hover {
.fa {
color: $button-hover-color;
}
}
}
.playback-controls {
.row {
@extend .vertical-center;
justify-content: center;
}
.position {
margin-top: .75em;
}
button {
padding: 0 1.5rem;
.fa-play, .fa-pause {
color: $button-hover-color;
font-size: $font-size * 2;
margin-top: .3rem;
&:hover {
color: $play-button-hover-color;
}
}
}
}
.pull-right {
button {
&:not(last-child) {
padding: 0 .7rem;
}
&:last-child {
padding: 0;
}
}
.volume-container {
button {
padding: 0 .3rem 0 0;
background: none;
}
}
}
.seek-slider {
width: 75%;
}
.volume-slider {
width: 75%;
margin-right: 1rem;
}
.elapsed-time,
.total-time {
font-size: .7em;
color: .7em;
}
.elapsed-time {
margin-right: 1.5rem;
}
.total-time {
margin-left: 1.5rem;
}
}
}

View file

@ -1,44 +0,0 @@
.media-plugin {
.devices {
display: inline-block;
button {
padding: .5rem;
margin-right: .5rem;
&.selected {
background: initial;
color: $default-hover-fg;
&:hover {
color: $default-hover-fg-2;
}
}
}
.dropdown {
white-space: nowrap;
.item {
display: flex;
align-items: center;
.text {
text-align: left;
margin-left: 2rem;
}
&:first-child {
border-bottom: $default-border-3;
color: $devices-dropdown-refresh-fg;
font-size: .8em;
}
&:hover {
background: $hover-bg
}
}
}
}
}

View file

@ -1,60 +0,0 @@
@import 'common/vars';
@import 'common/mixins';
@import 'common/layout';
@import 'common/animations';
@import 'webpanel/plugins/media/vars';
@import 'webpanel/plugins/media/search';
@import 'webpanel/plugins/media/devices';
@import 'webpanel/plugins/media/results';
@import 'webpanel/plugins/media/controls';
@import 'webpanel/plugins/media/info';
@import 'webpanel/plugins/media/subs';
@import 'webpanel/plugins/media/torrents';
.media-plugin {
display: flex;
flex-direction: column;
height: inherit;
letter-spacing: .03rem;
.dropdown {
z-index: $devices-dropdown-z-index;
.item {
display: flex;
align-items: center;
.text {
margin-left: 1rem;
}
&:hover {
background: $hover-bg;
}
}
}
input[type=text] {
width: 100%;
&:hover {
border-color: $default-hover-fg;
}
}
button {
border: 0;
}
.icon {
color: $result-item-icon;
margin-right: .5em;
}
.top-buttons {
text-align: right;
float: right;
}
}

View file

@ -1,33 +0,0 @@
.media-plugin {
#media-info {
.modal {
max-width: 90%;
}
}
.info-container {
.row {
display: flex;
align-items: center;
padding: .75em .5em;
border-bottom: $default-border-2;
&:nth-child(odd) { background: rgba(255,255,255,0.0); }
&:nth-child(even) { background: $default-bg-3; }
&:hover {
background: $hover-bg;
border-radius: 1em;
}
.attr {
font-size: 1.1em;
}
.value {
text-align: right;
}
}
}
}

View file

@ -1,42 +0,0 @@
@import 'common/animations';
.media-plugin {
.results {
position: relative; // For the dropdown menu
overflow: auto;
@include calc(height, '100%');
&.resize {
@include calc(height, '100% - 16rem');
}
.active {
@extend .active-glow;
height: 4rem;
}
.empty {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5em;
letter-spacing: .1rem;
color: $empty-results-color;
}
.media-item {
display: flex;
align-items: center;
cursor: pointer;
border-radius: 1rem;
padding: .5rem;
&:nth-child(odd) { background: rgba(255, 255, 255, 0.0); }
&:nth-child(even) { background: $default-bg-3; }
&:hover { background: $hover-bg; }
&.selected { background: $selected-bg; }
}
}
}

View file

@ -1,53 +0,0 @@
.media-plugin {
.search {
display: flex;
align-items: center;
width: 100%;
background: $default-bg-3;
border-bottom: $default-border-3;
input[type=text] {
width: 80%;
max-width: 600px;
}
[type=submit] {
color: $default-hover-fg;
font-size: 1.2em;
&:hover {
border: $default-border-2;
border-radius: 5rem;
}
}
.types {
.type {
display: inline-block;
padding: 1rem 1rem 0 1rem;
}
label {
display: inline-block;
font-weight: normal;
margin: 0;
}
}
button {
padding: 0 2rem;
border: 0;
&:hover {
color: $default-hover-fg;
}
}
form {
width: 100%;
margin: 0;
padding: 1rem 0;
}
}
}

View file

@ -1,60 +0,0 @@
.media-plugin {
#media-subs {
.body {
padding: 0;
}
}
.subs-container {
.loading, .no-results {
display: flex;
align-items: center;
padding: 3rem;
font-size: 1.5em;
}
.subs {
.list {
max-height: 50vh;
overflow: auto;
}
.sub {
display: flex;
align-items: center;
padding: .75em .5em;
border-bottom: $default-border-2;
cursor: pointer;
&:nth-child(odd) { background: rgba(255, 255, 255, 0.0); }
&:nth-child(even) { background: $default-bg-3; }
&.selected { background: $selected-bg; }
&:hover {
background: $hover-bg;
border-radius: 1em;
}
}
.controls {
position: relative;
padding: 1.5rem 0;
height: $subs-control-height;
button {
position: absolute;
right: 0;
margin-right: 1rem;
border: $default-border-2;
box-shadow: $btn-default-shadow;
&:hover:not([disabled]) {
box-shadow: $btn-hover-default-shadow;
color: $default-hover-fg;
}
}
}
}
}
}

View file

@ -1,51 +0,0 @@
.media-plugin {
#media-torrents {
.modal {
width: 90%;
.body {
padding: 0;
text-align: center;
.search {
input[type=text] {
width: 88%;
max-width: none;
}
input[type=submit] {
width: 8%;
}
}
.head {
font-weight: bold;
padding: .5rem 0 2.5rem 0;
background: $torrents-head-bg;
border-bottom: $default-border-3;
}
.transfers-container {
margin: 0;
width: 100%;
}
.transfer {
display: flex;
padding: 1.5rem;
cursor: pointer;
&:nth-child(odd) { background: rgba(255,255,255,0.0); }
&:nth-child(even) { background: $default-bg-3; }
&.selected { background: $selected-bg; }
&:hover {
background: $hover-bg;
border-radius: .5rem;
}
}
}
}
}
}

View file

@ -1,21 +0,0 @@
$button-enabled-color: #59df3e;
$button-hover-color: $button-enabled-color;
$play-button-hover-color: #64ef4a;
$control-panel-bg: rgba(245,245,245,0.95);
$control-panel-height: 10rem !default;
$control-panel-shadow: 0 -2.5px 4px 0 #c0c0c0;
$control-time-color: #666;
$empty-results-color: #506050;
$result-item-icon: #444;
$devices-dropdown-z-index: 2;
$devices-dropdown-refresh-fg: #666;
$subs-control-height: 4rem;
$btn-default-shadow: 2px 2px 2px #ddd;
$btn-hover-default-shadow: 3px 3px 3px #ddd;
$torrents-head-bg: #e8e8e8;

View file

@ -1,453 +0,0 @@
@import 'common/vars';
@import 'common/mixins';
@import 'common/layout';
@import 'common/animations';
@import 'webpanel/plugins/music.mpd/vars';
.music-mpd-container {
display: flex;
flex-direction: column;
line-height: 3rem;
letter-spacing: .03rem;
height: inherit;
overflow: hidden;
.item {
display: flex;
align-items: center;
cursor: pointer;
border-radius: 1rem;
padding: .5rem;
&:nth-child(odd) { background: rgba(255, 255, 255, 0.0); }
&:nth-child(even) { background: $default-bg-3; }
&:hover { background: $hover-bg !important; }
&.selected { background: $selected-bg !important; }
.artist {
font-size: .9em;
}
}
.duration {
color: $duration-color;
font-size: .7em;
}
button {
border: 0;
&:disabled {
background: none;
}
&.enabled {
color: $button-enabled-color !important;
.fa { color: $button-enabled-color !important; }
}
&:hover {
.fa {
opacity: 0.75;
}
}
}
.spacer {
height: 5rem;
}
.panels {
display: flex;
flex-direction: row;
flex: 0 1 auto;
order: 0;
@include calc(height, '100% - 10.1rem');
.panel {
height: 100%;
}
}
.browser {
width: 40%;
min-width: 20rem;
max-width: 35rem;
background: $browser-panel-bg;
font-size: .9em;
.item {
background: none;
}
.fa {
color: #666;
}
}
%ctrl-button {
border: 0;
padding: 0 1.5rem;
&:disabled {
background: none;
}
&.enabled {
color: $button-enabled-color;
}
.fa-search {
color: $button-hover-color;
}
}
%move {
background: $move-mode-track-bg !important;
border-top: $move-mode-track-border;
border-bottom: $move-mode-track-border;
cursor: move;
}
.browser,
.search,
.playlist {
.results {
position: relative; // For the dropdown menu
@include calc(height, '100% - 5.1rem');
overflow: auto;
}
.browser-controls,
.results-controls,
.playlist-controls {
width: 100%;
height: 4rem;
background: $playlist-controls-bg;
border-bottom: $playlist-controls-border;
padding: .5rem 0;
input[type=text] {
width: 100%;
}
button {
@extend %ctrl-button;
padding: 0 .75rem;
}
}
.empty {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
font-size: 5rem;
color: $empty-playlist-color;
text-shadow: $empty-playlist-shadow;
}
.item {
.empty {
font-size: 1em;
display: block;
height: auto;
}
&.active {
height: 4rem;
@extend .active-glow;
}
&.move:hover {
@extend %move;
}
}
}
.playlist {
width: 100%;
}
.playlist-add,
.editor {
.editor-controls,
.playlist-add-controls {
background: $playlist-controls-bg;
border-bottom: $playlist-controls-border;
border-radius: 0;
box-shadow: $filter-bar-shadow;
margin: -2.5rem -2rem 0 -2rem;
padding: .5rem;
}
input[type=text] {
width: 100%;
}
button {
@extend %ctrl-button;
padding: 0 .75rem;
}
.editor-container,
.playlists-container {
overflow: auto;
margin: 0 -2rem;
padding: 1rem;
}
.playlists-container {
max-height: 70vh;
}
.editor-container {
max-height: 65vh;
.item {
&.move:hover {
@extend %move;
}
}
}
}
.controls {
@extend .vertical-center;
width: 100%;
border-top: $default-border-2;
background: $control-panel-bg;
box-shadow: $control-panel-shadow;
z-index: 2;
order: 1;
flex: 0 0 $control-panel-height;
.track-container {
@extend .vertical-center;
padding-left: 1rem;
line-height: 2.6rem;
a {
color: initial;
text-decoration: none;
&:hover {
color: $track-info-hover-color;
}
}
.track-info {
.artist {
font-weight: bold;
}
}
}
button {
&:hover {
.fa {
color: $button-hover-color;
}
}
}
.playback-controls {
.row {
@extend .vertical-center;
justify-content: center;
}
button {
padding: 0 1.5rem;
.fa-play, .fa-pause {
color: $button-hover-color;
font-size: $font-size * 2;
margin-top: .3rem;
&:hover {
color: $play-button-hover-color;
}
}
}
}
.pull-right {
padding-right: 2.5rem;
button {
&:not(last-child) {
padding: 0 .7rem;
}
&:last-child {
padding: 0;
}
}
.volume-container {
button {
padding: 0 .3rem 0 0;
background: none;
}
}
}
.seek-slider {
width: 75%;
}
.volume-slider {
width: 75%;
margin-right: 1rem;
}
.elapsed-time,
.total-time {
font-size: .7em;
color: .7em;
}
.elapsed-time {
margin-right: 1.5rem;
}
.total-time {
margin-left: 1.5rem;
}
}
.search {
--width: 90vw;
padding: 0;
form {
margin-bottom: 0;
padding: 2.7rem;
.row {
padding: .5rem;
}
.footer {
padding-top: 1.5rem;
margin: 2.5rem 0;
border-top: $search-modal-footer-border;
.left {
display: flex;
justify-content: left;
}
}
button, input[type=submit] {
border-radius: 5rem;
}
}
.results-controls {
padding: 0;
border-bottom: $default-border-2;
width: var(--width);
height: 4.5rem;
display: flex;
align-items: center;
z-index: 502;
}
form, .results {
position: relative;
}
.results {
@include calc(height, '100% - 4.7rem');
}
}
.dropdown {
width: 20rem;
}
.filter-container {
position: relative;
}
}
#music-mpd-info {
.modal {
.body {
.row {
margin: .5rem;
padding: .5rem;
border-bottom: $info-modal-row-border;
&:hover {
border-radius: 1rem;
background: $hover-bg;
}
.attr {
color: $info-modal-attr-color;
}
.value {
text-align: right;
}
}
}
}
}
#music-mpd-search-modal,
#music-mpd-playlist-edit {
.dropdown {
z-index: 503;
}
}
#music-mpd-search-modal {
.header {
height: 3.8rem;
}
.body {
display: flex;
padding: 0;
}
}
#music-mpd-playlist-add {
.modal {
min-width: 50rem;
}
}
#music-mpd-playlist-edit {
.modal {
min-width: 80rem;
}
}
@media #{map-get($widths, 's')} {
#music-mpd-info {
.modal {
width: 80vw;
}
}
}
@media #{map-get($widths, 'm')} {
#music-mpd-info {
.modal {
width: 70vw;
}
}
}
@media #{map-get($widths, 'l')} {
#music-mpd-info {
.modal {
width: 45vw;
}
}
}

View file

@ -1,28 +0,0 @@
$button-enabled-color: #59df3e;
$button-hover-color: $button-enabled-color;
$play-button-hover-color: #64ef4a;
$duration-color: #666;
$control-panel-height: 10rem !default;
$control-panel-bg: rgba(245,245,245,0.95);
$control-panel-shadow: 0 -2.5px 4px 0 #c0c0c0;
$control-time-color: #666;
$browser-panel-bg: rgba(248,250,250,0.95);
$empty-playlist-color: rgba(200,200,200,0.7);
$empty-playlist-shadow: 2px 1px rgb(235,235,235);
$playlist-controls-bg: rgba(247,247,247,0.95);
$playlist-controls-border: $default-border-2;
$move-mode-track-border: 3px dotted rgb(216,156,136);
$move-mode-track-bg: rgba(216,156,136,0.3);
$search-modal-footer-border: 1px solid #ccc;
$info-modal-row-border: 1px solid #ddd;
$info-modal-attr-color: #777;
$track-info-hover-color: rgb(46,190,110);
$filter-bar-shadow: 0 2.5px 4px 0 #bbb;

View file

@ -1,153 +0,0 @@
@import 'common/vars';
@import 'common/mixins';
@import 'common/layout';
$host-border: $default-border-2;
$host-shadow: $default-shadow;
.music-snapcast-container {
.host {
width: 95%;
margin: 2rem auto;
border: $host-border;
border-radius: 1rem;
box-shadow: $host-shadow;
.head {
padding: 1rem .5rem;
background: $default-bg-4;
border-bottom: $host-border;
border-radius: 1rem 1rem 0 0;
display: flex;
align-items: center;
.name {
padding-left: .5rem;
text-transform: uppercase;
&:hover {
color: $default-hover-fg;
cursor: pointer;
}
}
button {
padding: 0;
border: 0;
&:hover { color: $default-hover-fg; }
}
}
.group {
.head {
background: $default-bg-5;
border-radius: 0;
}
.head,
.client {
padding: 0 1rem;
}
.client {
display: flex;
align-items: center;
&.offline { color: $default-fg-3; }
&:hover { background: $hover-bg; }
.name {
&:hover {
color: $default-hover-fg;
cursor: pointer;
}
}
}
}
.icon { margin-right: 1rem; }
}
.modal {
.info {
padding: 2rem;
.section {
border: $default-border-2;
border-radius: 1rem;
&:not(last-child) { margin-bottom: 2rem; }
.title {
border-bottom: $default-border-2;
padding: 1rem;
text-transform: uppercase;
}
&.clients .row {
padding: .5rem;
label {
margin: 0 0 0 .5rem;
}
}
}
.row {
padding: .33rem .5rem;
border-radius: .75rem;
display: flex;
align-items: center;
&:nth-child(odd) { background: rgba(255, 255, 255, 0.0); }
&:nth-child(even) { background: $default-bg-3; }
&:hover { background: $hover-bg; }
.label { font-weight: bold; }
.value { text-align: right; }
}
}
}
}
#music-snapcast-client-info {
.info {
.buttons {
background: initial;
margin-top: 1.5rem;
padding-top: 1.5rem;
border-top: $default-border-2;
display: flex;
justify-content: center;
button {
color: #900;
border-color: #900;
}
}
}
}
@media #{map-get($widths, 's')} {
.music-snapcast-container {
.modal {
width: 80vw;
}
}
}
@media #{map-get($widths, 'm')} {
.music-snapcast-container {
.modal {
width: 70vw;
}
}
}
@media #{map-get($widths, 'l')} {
.music-snapcast-container {
.modal {
width: 45vw;
}
}
}

View file

@ -1,36 +0,0 @@
@import 'common/vars';
.sensors {
.head {
text-align: right;
button {
border: 0;
&:hover { background: $hover-bg; }
}
}
.body {
display: flex;
flex-direction: column;
margin: 2rem auto;
width: 80%;
.metric {
margin-bottom: .75rem;
padding: 2rem;
border: $default-border-3;
border-radius: 2rem;
&:nth-child(odd) { background: rgba(255, 255, 255, 0.0); }
&:nth-child(even) { background: $default-bg-3; }
&:hover { background: $hover-bg; }
.value {
text-align: right;
font-weight: bold;
}
}
}
}

View file

@ -1,15 +0,0 @@
@import 'common/vars';
.sound {
height: 90%;
margin-top: 7%;
overflow: hidden;
display: flex;
flex-direction: column;
align-items: center;
.sound-container {
margin-bottom: 1em;
}
}

View file

@ -1,34 +0,0 @@
@import 'common/vars';
$head-bg: #e8e8e8;
.switches-root {
.switch-root {
.head {
padding: 1rem .5rem;
background: $head-bg;
border-top: $default-border-2;
border-bottom: $default-border-2;
text-transform: uppercase;
}
.switches {
display: flex;
flex-direction: column;
padding: 1rem;
}
.device {
display: flex;
align-items: center;
.toggle {
text-align: right;
}
&:hover { background: $hover-bg; }
&:not(:last-child) { border-bottom: $default-border-2; }
}
}
}

View file

@ -1,32 +0,0 @@
@import 'common/vars';
.tts-container {
max-width: 80rem;
min-height: 10rem;
margin: 3rem auto;
display: flex;
align-items: center;
justify-content: center;
border: $default-border-2;
border-radius: 3rem;
form {
margin: 0;
width: 90%;
input[type=text] {
width: 100%;
}
button {
border-radius: 5rem;
}
input, button {
&:hover {
border-color: $default-hover-fg;
}
}
}
}

View file

@ -1,73 +0,0 @@
@import 'common/vars';
.tv-samsung-ws-container {
height: 100%;
display: flex;
justify-content: center;
.controls {
max-width: 500px;
height: calc(100% - .15em);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding: 0 1em;
border: $default-border-2;
border-radius: 2em;
box-shadow: 0 2px 9px 2px #bbb;
.power { color: red; }
button { margin: .5em 0; }
}
.rows {
flex-direction: column;
* {
button {
width: 100%;
}
}
}
.section {
width: 100%;
display: flex;
margin: 0 0 1.5em 0;
padding: 0 0 1.5em 0;
border-bottom: $default-border-2;
}
.directions {
flex-direction: column;
* {
button {
width: 5em;
height: 4em;
}
}
}
.volume, .channel {
text-align: center;
}
.colors {
text-align: center;
.color {
width: 3em;
height: 3em;
padding: 0;
border-radius: 2em;
&.red { background: red; }
&.green { background: green; }
&.yellow { background: yellow; }
&.blue { background: blue; }
}
}
}

View file

@ -1,264 +0,0 @@
@import 'common/vars';
@import 'webpanel/plugins/zigbee.mqtt/vars';
.fa.fa-zigbee:before {
content: ' ';
background: url('/static/img/icons/zigbee-logo.svg');
background-size: 1em 1em;
width: 1em;
height: 1em;
display: inline-block;
}
.zigbee-container {
height: 100%;
padding: 0 .5em;
background: $container-bg;
display: flex;
flex-direction: column;
align-items: center;
overflow: auto;
.no-items {
padding: 2em;
font-size: 1.5em;
color: $no-items-color;
display: flex;
align-items: center;
justify-content: center;
}
.view-options {
display: flex;
width: 100%;
justify-content: space-between;
padding: 1em 0;
.view-selector {
display: inline-flex;
}
.buttons {
display: inline-flex;
}
select {
width: 100%;
border-radius: 1em;
}
}
.btn-default {
border: 0;
padding: 0 1em;
&:hover {
border: $default-border-2;
border-radius: 1em;
}
}
.buttons {
text-align: right;
}
.view {
min-width: 400pt;
max-width: 750pt;
background: $view-bg;
border: $view-border;
border-radius: 1.5em;
box-shadow: $view-box-shadow;
}
.item {
&.selected {
box-shadow: $selected-item-box-shadow;
}
.name {
padding: 1em;
cursor: pointer;
text-transform: uppercase;
letter-spacing: .06em;
&.selected {
border-radius: 1.5em;
}
}
&:hover {
background: $hover-bg;
}
&:not(:last-child) {
border-bottom: $item-border;
}
&:first-child {
border-radius: 1.5em 1.5em 0 0;
}
&:last-child {
border-radius: 0 0 1.5em 1.5em;
}
}
.params {
background: $params-bg;
padding-bottom: 1em;
.section {
display: flex;
flex-direction: column;
padding: 0 1em;
&:not(:first-child) {
padding-top: 1em;
}
.header {
display: flex;
align-items: center;
font-weight: bold;
border-bottom: $param-section-header-border;
}
}
.row {
display: flex;
align-items: center;
border-radius: 1em;
padding: .3em;
&:nth-child(even) {
background: $param-even-row-bg;
}
&:nth-child(odd) {
background: $param-odd-row-bg;
}
&:hover {
background: $hover-bg;
}
}
.param-name {
display: inline-flex;
width: 40%;
margin-left: 1%;
vertical-align: top;
letter-spacing: .04em;
}
.param-value {
display: inline-block;
width: 58%;
text-align: right;
.value-edit {
display: flex;
align-items: center;
}
.value-data {
display: inline-block;
font-weight: bold;
}
.slider-container {
display: flex;
align-items: center;
}
.unit {
font-size: .8em;
margin-left: 1em;
display: inline;
}
select {
width: 100%;
border-radius: 2em;
}
.numeric {
input.slider {
text-align: left;
}
input[type=text] {
text-align: right;
width: 100%;
}
.row {
background: none;
&:hover {
background: none;
}
}
.value-min, .value-max {
width: 50%;
font-size: .85em;
opacity: .75;
}
.value-min {
text-align: left;
}
.value-max {
text-align: right;
}
}
}
}
.btn-value-name-edit {
padding: 0;
}
.modal {
.section {
.header {
background: none;
padding: .5em 0;
}
.body {
padding: 0;
}
}
.network-info {
min-width: 600pt;
}
}
.error {
color: $error-color;
}
.device, .group {
.actions {
.row {
cursor: pointer;
}
}
form {
margin-bottom: 0;
}
.param-value {
input[type=text] {
text-align: right;
}
}
}
}

Some files were not shown because too many files have changed in this diff Show more