mirror of
https://github.com/daniviga/django-ram.git
synced 2025-08-04 21:27:49 +02:00
Import WebThrottle-EX from ca33f6a
This commit is contained in:
226
ram/driver/static/wt/css/themes/dark.css
Normal file
226
ram/driver/static/wt/css/themes/dark.css
Normal file
@@ -0,0 +1,226 @@
|
||||
body{
|
||||
background: #111111;
|
||||
}
|
||||
.rendered-form{
|
||||
background: #1b1b1b;
|
||||
background-image: url(../../images/carbon_fibre.png);
|
||||
background-repeat: repeat;
|
||||
color: #fff;
|
||||
background-size: 16px;
|
||||
}
|
||||
.rs-control .rs-bg-color, #throttle-window{
|
||||
background: #1b1b1b;
|
||||
background-image: url(../../images/carbon_fibre.png);
|
||||
background-repeat: repeat;
|
||||
background-size: 16px;
|
||||
}
|
||||
.rs-control .rs-range-color{
|
||||
background-color: #00A3B9;
|
||||
}
|
||||
#throttle-window{
|
||||
border: 1px solid #303030;
|
||||
box-shadow: 0px 0px 10px 0px #0c0c0c;
|
||||
}
|
||||
label.formbuilder-text-label,
|
||||
label.formbuilder-select-label,
|
||||
label.formbuilder-textarea-label,
|
||||
label.formbuilder-file-label{
|
||||
color: #ffffff;
|
||||
}
|
||||
input.form-control, select.form-control, textarea.form-control {
|
||||
border: 1px solid #3b3b3b;
|
||||
border-radius: 4px;
|
||||
background: #282828;
|
||||
color: #ffffff;
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
.formbuilder-button .btn, .server-button .btn, .fn-button .btn {
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
}
|
||||
.fn-button.field-button-fn .btn.press{
|
||||
border: 1px solid #3e8e41;
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
}
|
||||
.fn-button.field-button-fn button[aria-pressed="true"].btn.press{
|
||||
border: 1px solid #3e8e41;
|
||||
box-shadow: none;
|
||||
}
|
||||
.select-control {
|
||||
border: 1px solid #3b3b3b;
|
||||
border-radius: 4px;
|
||||
background: #282828;
|
||||
color: #ffffff;
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
.btn-grey{
|
||||
background: #282828;
|
||||
border: 1px solid #3f3f3f;
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
color: #afafaf;
|
||||
}
|
||||
.btn-hide{
|
||||
background: #282828;
|
||||
border: 1px solid #3f3f3f;
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
color: #afafaf;
|
||||
}
|
||||
.btn-speed {
|
||||
background: #282828;
|
||||
border: 4px solid #3f3f3f;
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
color: #afafaf;
|
||||
}
|
||||
.btn-speed:hover {
|
||||
background: #3f3f3f;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.rotaryswitchPlugin.big .mark{
|
||||
background: #111111;
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
|
||||
.slider{
|
||||
border: 1px solid #3b3b3b;
|
||||
background: #121212;
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
border-radius: 34px;
|
||||
}
|
||||
.slider:before {
|
||||
left: 3px;
|
||||
bottom: 2px;
|
||||
background: #484848;
|
||||
border: 1px solid #3f3f3f;
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
}
|
||||
input:checked + .slider:before{
|
||||
box-shadow: 0px 0px 2px #b40000;
|
||||
border: 1px solid #ff3a3a;
|
||||
}
|
||||
input + .slider,
|
||||
input:checked + .slider{
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
input:checked + .slider.debug-slider{
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
input:checked + .slider.debug-slider:before{
|
||||
box-shadow: 0px 0px 2px #00A3B9;
|
||||
border: 1px solid #01b3ca;
|
||||
}
|
||||
.slider.debug-slider:before {
|
||||
bottom: 1px;
|
||||
}
|
||||
.knob-value{
|
||||
text-shadow: 0 0px 1px #000000, 0px 0px 4px #31d9f3;
|
||||
}
|
||||
.log-msg{
|
||||
color: cyan;
|
||||
border: 1px solid #3b3b3b;
|
||||
background: #121212;
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
.dir-toggle {
|
||||
background-color: #121212;
|
||||
-moz-box-shadow: inset 0 0 5px #000000;
|
||||
-webkit-box-shadow: inset 0 0 5px #000000;
|
||||
box-shadow: inset 0 0 5px #000000;
|
||||
border: 4px solid #141414;
|
||||
}
|
||||
.dir-toggle:before{
|
||||
-moz-box-shadow: 0 0 5px #000000;
|
||||
-webkit-box-shadow: 0 0 5px #000000;
|
||||
box-shadow: 0 0 5px #000000;
|
||||
}
|
||||
.em-btn button.em-stop{
|
||||
padding: 12px;
|
||||
box-shadow: 0 0 5px 2px #000000;
|
||||
border: 1px solid #ececec;
|
||||
background: #ddd;
|
||||
}
|
||||
|
||||
.rotaryswitchPlugin.big.light {
|
||||
margin: 36px;
|
||||
background: url(../../images/darkmkBigBackground.png) no-repeat;
|
||||
background-size: 100%;
|
||||
background-position: center;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.rotaryswitchPlugin.big.light .switch {
|
||||
background: url(../../images/darkmkBigFront.png) no-repeat;
|
||||
background-size: 93%;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.ui-slider .ui-slider-range {
|
||||
background: #282828;
|
||||
box-shadow: inset 0 0 5px 0px #000;
|
||||
|
||||
}
|
||||
.ui-widget.ui-widget-content {
|
||||
border: 4px solid #3f3f3f;
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
}
|
||||
.ui-slider-vertical .ui-slider-handle {
|
||||
border: 1px solid #3f3f3f;
|
||||
background-color: #282828;
|
||||
background: linear-gradient(to bottom,#3b3b3b, #282828);
|
||||
left: -6px;
|
||||
}
|
||||
hr {
|
||||
border-color: #3f3f3f;
|
||||
}
|
||||
.menu {
|
||||
box-shadow: 0 0px 10px #000000;
|
||||
border-right: 1px solid #2f2f2f;
|
||||
}
|
||||
.nav-btn, .btn-expand, .btn-info, .btn-hide{
|
||||
color: #afafaf;
|
||||
}
|
||||
.nav-btn:hover, .btn-expand:hover, .btn-info:hover{
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.add-loco-form .add-loco-head,
|
||||
.add-loco-form .row label {
|
||||
color: #333;
|
||||
}
|
||||
.settings-group{
|
||||
border: 1px solid #3b3b3b;
|
||||
background: #121212;
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
.settings-heading {
|
||||
border-bottom: 1px solid #000000;
|
||||
box-shadow: 0 1px 0px #464646;
|
||||
}
|
||||
.side-panel {
|
||||
border-right: 1px solid #000000;
|
||||
box-shadow: 1px 0 #464646;
|
||||
}
|
||||
.row.settings-group.fnhead{
|
||||
background: #232323;
|
||||
box-shadow: 0 1px 1px black;
|
||||
border: 1px solid #333;
|
||||
}
|
||||
a.edit-cur-loco, a.option-btn{
|
||||
background: #282828;
|
||||
border: 1px solid #3f3f3f;
|
||||
box-shadow: 0px 0px 2px #000000;
|
||||
color: #ffffff;
|
||||
}
|
||||
.loco-details p.ac-loco-name{
|
||||
text-shadow: 0 0 1px #000000;
|
||||
color: #00A3B9
|
||||
}
|
||||
.loco-details .sub-text p{
|
||||
background: #282828;
|
||||
}
|
||||
.loco-list-ctrl input{
|
||||
border: 1px solid #3b3b3b;
|
||||
background: #282828;
|
||||
color: #ffffff;
|
||||
box-shadow: inset 0px 0px 2px #000000;
|
||||
}
|
||||
208
ram/driver/static/wt/css/themes/metallic.css
Normal file
208
ram/driver/static/wt/css/themes/metallic.css
Normal file
@@ -0,0 +1,208 @@
|
||||
|
||||
|
||||
.rendered-form{
|
||||
background-image: url("../../images/pattern.png");
|
||||
background-size: 50%;
|
||||
background-repeat: repeat;
|
||||
}
|
||||
.btn-speed {
|
||||
border: 1px solid #dcdcdc;
|
||||
background: linear-gradient(to bottom,#e2e2e2, #cfd0da);
|
||||
color: rgb(59, 59, 59);
|
||||
border: 1px solid #9e9e9e;
|
||||
text-shadow: 0px 1px 0px #fafafa;
|
||||
box-shadow: 0px 1px 1px 1px #b3b3b3;
|
||||
}
|
||||
.btn-speed:hover{
|
||||
background-color: #c7c7c7;
|
||||
background: linear-gradient(to bottom, #e2e2e2, #cfd0da);
|
||||
color: rgb(59, 59, 59);
|
||||
}
|
||||
.btn-speed:active{
|
||||
box-shadow: 0 1px 2px 1px #b3b3b3 inset;
|
||||
background: linear-gradient(to bottom,#cfd0da, #e2e2e2);
|
||||
border: 1px solid #9e9e9e;
|
||||
}
|
||||
.dir-toggle:before{
|
||||
width: 40px;
|
||||
height: 70px;
|
||||
}
|
||||
.dir-btn span.arrow-up,
|
||||
.dir-btn span.arrow-down{
|
||||
color: #4d4d4d;
|
||||
}
|
||||
.dir-btn span.stop{
|
||||
background: #4d4d4d;
|
||||
}
|
||||
.dir-btn.selected span.stop{
|
||||
background: #da0000;
|
||||
box-shadow: 0px 0px 4px #da0000;
|
||||
}
|
||||
.dir-btn.selected span.arrow-up,
|
||||
.dir-btn.selected span.arrow-down{
|
||||
color: #00bcd6;
|
||||
text-shadow: 0px 0px 4px #29d6ec;
|
||||
}
|
||||
.dir-toggle.forward:before, .dir-toggle.stop:before, .dir-toggle.backward:before{
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #f9f9f9;
|
||||
background-color: #efefef;
|
||||
background: linear-gradient(to bottom,#efefef, #e2e2e2);
|
||||
}
|
||||
.em-btn button.em-stop{
|
||||
padding: 12px;
|
||||
background: linear-gradient(to bottom,#e2e2e2, #cfd0da);
|
||||
border: 1px solid #9e9e9e;
|
||||
text-shadow: 0px 1px 0px #fafafa;
|
||||
box-shadow: 0px 1px 1px 1px #b3b3b3;
|
||||
}
|
||||
.fn-button.field-button-fn .btn, .save-fn, .btn-grey,
|
||||
.fn-button.field-button-fn .btn.press{
|
||||
color: rgb(59, 59, 59);
|
||||
border: 1px solid #9e9e9e;
|
||||
border-bottom: 4px solid #9e9e9e;
|
||||
text-shadow: 0px 1px 0px #fafafa;
|
||||
background-color: #efefef;
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#e2e2e2));
|
||||
background: -moz-linear-gradient(top, #efefef, #e2e2e2);
|
||||
box-shadow: -1px 2px 4px 2px #c7c7c7; /* 0 0 0px 4px #d8d8d8, 0 0 0px 1px #ddd;*/
|
||||
background: linear-gradient(to bottom,#efefef, #e2e2e2);
|
||||
height: 30px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.fn-button.field-button-fn button[aria-pressed="true"].btn,
|
||||
.fn-button.field-button-fn button[aria-pressed="true"].btn.press,
|
||||
.save-fn:active {
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#cfd0da), to(#e2e2e2));
|
||||
background: -moz-linear-gradient(top, #bfbfbf, #dcdcdc);
|
||||
box-shadow: 1px 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, 0.3);
|
||||
border: 1px solid #9e9e9e;
|
||||
}
|
||||
.fn-button.field-button-fn .btn.press {
|
||||
color: #005a69;
|
||||
}
|
||||
|
||||
.formbuilder-button .btn, .server-button .btn, .fn-button .btn, .dropbtn{
|
||||
border: 1px solid #007a8a;
|
||||
border-bottom: 4px solid #007a8a;
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#00b2ca), to(#00A3B9));
|
||||
background: -moz-linear-gradient(top, #00b2ca, #00A3B9);
|
||||
background: linear-gradient(to bottom,#00b2ca, #00A3B9);
|
||||
box-shadow: -1px 2px 4px 2px #c7c7c7; /* 0 0 0px 4px #d8d8d8, 0 0 0px 1px #ddd;*/
|
||||
vertical-align: middle;
|
||||
box-sizing: border-box;
|
||||
text-shadow: 0px 0px 1px #444444;
|
||||
}
|
||||
.formbuilder-button .btn:active ,
|
||||
.server-button .btn:active, .dropbtn:active{
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#0299ad), to(#00A3B9));
|
||||
background: -moz-linear-gradient(top, #0299ad, #00A3B9);
|
||||
background: linear-gradient(to bottom,#0299ad, #00A3B9);
|
||||
box-shadow: 1px 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, 0.3);
|
||||
border-bottom: 1px solid #007a8a;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.dropbtn{
|
||||
padding: 5px 8px;
|
||||
}
|
||||
.dropbtn:active{
|
||||
padding: 6px 8px;
|
||||
}
|
||||
.server-button .btn, .fn-button .btnm,
|
||||
input.form-control, select.form-control, textarea.form-control {
|
||||
padding: 7px 8px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
input.form-control:active, select.form-control:active, textarea.form-control:active,
|
||||
input.form-control:focus, select.form-control:focus, textarea.form-control:focus{
|
||||
background: #ffffff;
|
||||
}
|
||||
.formbuilder-button .btn.acq-loco-btn,
|
||||
.server-button .btn,
|
||||
.formbuilder-button .add-loco-btn,
|
||||
.formbuilder-button .btn.acq-loco-btn:active,
|
||||
.server-button .btn:active,
|
||||
.formbuilder-button .add-loco-btn:active{
|
||||
height: 34px;
|
||||
}
|
||||
.select-control{
|
||||
height: 30px;
|
||||
border: 1px solid #9e9e9e;
|
||||
box-shadow: 1px 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, 0.3);
|
||||
background: #fafafa;
|
||||
}
|
||||
.select-control.select-xl{
|
||||
height: 36px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.btn-grey{
|
||||
padding: 7px;
|
||||
padding-top: 5px;
|
||||
height: 30px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
|
||||
/* Acquire loco heading Styles*/
|
||||
.loco-board{
|
||||
display: inline-block;
|
||||
border-radius: 20px;
|
||||
background: linear-gradient(to bottom,#e2e2e2, #cfd0da);
|
||||
color: rgb(59, 59, 59);
|
||||
border: 1px solid #9e9e9e;
|
||||
border-bottom: 4px solid #9e9e9e;
|
||||
text-shadow: 0px 1px 0px #fafafa;
|
||||
box-shadow: inset 0px 1px 1px #f5f5f5;
|
||||
padding: 7px 11px;
|
||||
min-width: 270px;
|
||||
}
|
||||
|
||||
.nut-effect{
|
||||
border-radius: 16px;
|
||||
padding: 5px;
|
||||
background: #dededd;
|
||||
height: 5px;
|
||||
width: 5px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
box-shadow: 0 0 2px #737373;
|
||||
}
|
||||
.nut-effect:after{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
background: #b9b9b9;
|
||||
height: 15px;
|
||||
width: 1px;
|
||||
position: relative;
|
||||
top: -5px;
|
||||
left: 0;
|
||||
}
|
||||
.nut-effect.l{
|
||||
margin-left: 10px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
.nut-effect.r{
|
||||
margin-left: 16px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.nut-effect.l:after{
|
||||
transform: rotate(135deg);
|
||||
}
|
||||
.nut-effect.r:after{
|
||||
transform: rotate(15deg);
|
||||
}
|
||||
|
||||
.rs-control .rs-bg-color {
|
||||
background-color: #ddd;
|
||||
background-image: url(../../images/pattern.png);
|
||||
background-size: 900%;
|
||||
opacity: 0.9;
|
||||
}
|
||||
.rs-overlay.rs-transition.rs-bg-color{
|
||||
background: #dcdcdc;
|
||||
opacity: 1;
|
||||
}
|
||||
Reference in New Issue
Block a user