1 line
5.1 KiB
CSS
1 line
5.1 KiB
CSS
html{box-sizing:border-box;font-size:62.5%}body{background-color:#000;color:#fff;font-family:Verdana,Arial,sans-serif;font-size:1.3em;font-weight:300;letter-spacing:.01em;line-height:1.3;padding-bottom:3rem}@media screen and (min-width:768px){body{padding-top:3rem}}a{text-decoration:none}[v-cloak]{display:none}#container{background:#202020;margin-top:2rem;padding:1rem;box-shadow:0 0 50px #fcf6cf;border:solid 1px #000}@media screen and (min-width:768px){#container{width:768px;margin-left:auto;margin-right:auto}}.header{position:relative}.header img{float:left;margin-right:1rem}@media screen and (max-width:767px){.header .wifistatus{clear:both;margin-top:3rem}}@media screen and (min-width:768px){.header .wifistatus{position:absolute;right:0;top:0}}.header .wifistatus .indicator{display:inline-block;width:1rem;height:1rem;border-radius:50%;margin-right:.5rem}.header .wifistatus .indicator[data-status=connected]{background-color:#396}.header .wifistatus .indicator[data-status=disconnected]{border:solid 1px grey}.header .wifistatus .indicator[data-status=connecting]{background-color:#f93}.header .wifistatus .indicator[data-status=error]{background-color:#c00}.button,.check .control,.notification,.panel .panel-body,.panel .panel-header,.radio .control,.warning,h3{border:1px solid #111;border-radius:3px;box-shadow:inset 0 1px rgba(255,255,255,.1),inset 0 -1px 3px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.08),0 1px 2px rgba(0,0,0,.15)}.button.active,.button:active{border-color:#000 #111 #111;box-shadow:inset 0 1px 2px rgba(0,0,0,.25),0 1px rgba(255,255,255,.08)}.button{display:inline-block;padding:0 12px;color:#ddd;background:#404040;cursor:pointer}.button.focus,.button:focus,.button:hover{color:#ddd;background:#505050;outline:0}.button.active,.button:active{color:#ccc;background:#282828}a.button{line-height:3rem;text-decoration:none}.tabs{clear:both;margin-top:3rem}.tabs>.button{margin-left:-1px;border-radius:0}.tabs>.button:first-child{margin-left:0;border-radius:3px 0 0 3px}.tabs>.button:last-child{border-radius:0 3px 3px 0}.tabs>.button:focus{position:relative;z-index:1}.version{color:grey;font-size:8pt;text-align:center;margin-top:2rem}.notificationContainer{position:fixed;top:2rem;z-index:666}@media screen and (min-width:768px){.notificationContainer{width:512px;left:50%}}.notification{background:#297ab8;box-shadow:0 0 10px #000;color:#fff;cursor:pointer;padding:.5em;margin-bottom:2rem;position:relative}@media screen and (min-width:768px){.notification{left:-50%}}.notification .message{white-space:pre}.notification.error{background:#973a38}.check,.radio{display:inline-block;cursor:pointer;user-select:none;white-space:nowrap}.check .control,.radio .control{background:#404040;display:inline-block;width:16px;height:16px;position:relative}.check .label,.radio .label{display:inline-block;margin-left:.5em;vertical-align:top}.check.checked .control,.radio.checked .control{background:#606060}.radio .control,.radio .control .inner{border-radius:50%}.radio .control .inner{color:#000;position:absolute;top:5px;left:5px;width:6px;height:6px}.radio.checked .control .inner{background:#ccc;box-shadow:0 1px rgba(0,0,0,.5)}.check .control .inner{position:absolute;top:5px;left:4px;width:6px;height:3px}.check.checked .control .inner{border:solid rgba(255,255,255,.8);border-width:0 0 2px 2px;transform:rotate(-45deg);box-shadow:-1px 0 rgba(0,0,0,.2),0 1px rgba(0,0,0,.5)}input,textarea{color:#fff}input[type=range]{margin-top:1rem;margin-bottom:1rem}h1{font-size:2rem;margin:0}h2{color:silver;font-size:1.2rem;margin:0}h3{color:grey;background-color:#282828;font-size:1.2rem;padding:.5rem}input[disabled]{cursor:not-allowed;color:grey;background-color:#262626}.label-inline{margin-right:2rem}.hint{display:block;font-size:8pt;color:grey;margin-bottom:1.5rem}.loading{margin-top:3rem;text-align:center}.suboptions{margin-left:5rem}.buttons{text-align:center}.sliders{margin-top:2rem}.step{margin-left:3rem;margin-right:3rem;position:relative}.step .slidercontainer{margin-right:4em}.step .value{position:absolute;right:0;top:.1rem;color:grey}.slider{-webkit-appearance:none;width:100%;height:.5rem;border-radius:.25rem;background:#404040;outline:0}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:2rem;height:2rem;border-radius:50%;background:#fcf6cf;cursor:pointer}.slider::-moz-range-thumb{width:2rem;height:2rem;border-radius:50%;background:#fcf6cf;cursor:pointer}.warning{background:#973a38;padding:.5em;margin-bottom:2rem;margin-top:1rem}.nodata{color:grey;text-align:center}.clear{clear:both}.panel{margin-bottom:2rem;padding:0}.panel .panel-header{border-radius:3px 3px 0 0;border-bottom-width:0;padding:.5em;background-color:#302f28;color:#fff}.panel .panel-header input[type=checkbox]{margin-left:.5em;margin-top:.5em;margin-bottom:.5em}.panel .panel-header label{font-size:1em}@media screen and (min-width:768px){.panel .panel-header .actions{float:right}}.panel .panel-header a,.panel .panel-header label{color:#fff}.panel .panel-body{border-radius:0 0 3px 3px;background-color:#242422;padding:2rem}select{background:#202020;color:#fff}select:focus{background-image:none}.inline{display:inline-block;width:auto}.weekdays .label{width:8em} |