108 lines
No EOL
1.7 KiB
CSS
108 lines
No EOL
1.7 KiB
CSS
:root {
|
|
--bg-color: #403F3C;
|
|
--primary-color: #ccc;
|
|
}
|
|
|
|
html {
|
|
background: var(--bg-color);
|
|
}
|
|
|
|
|
|
body {
|
|
padding-top: 20px;
|
|
width: 80%;
|
|
height: 100%;
|
|
color: var(--primary-color);
|
|
margin: auto;
|
|
font-family: "monospace";
|
|
}
|
|
|
|
|
|
.controls {
|
|
display: flex;
|
|
width: 40em;
|
|
}
|
|
|
|
fieldset {
|
|
flex: auto;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.buttons {
|
|
width: 30em;
|
|
|
|
}
|
|
|
|
input.button_color {
|
|
width: 6em;
|
|
margin: 4px;
|
|
border: none;
|
|
padding: 5px 10px;
|
|
/* border-radius: 5px; */
|
|
|
|
}
|
|
|
|
.button_color_white {
|
|
background-color: #ffffff;
|
|
color: #000000;
|
|
}
|
|
|
|
.button_color_red {
|
|
background-color: #ff0000;
|
|
color: #000000;
|
|
}
|
|
|
|
.button_color_yellow {
|
|
background-color: #ffff00;
|
|
color: #000000;
|
|
}
|
|
|
|
.button_color_green {
|
|
background-color: #00ff00;
|
|
color: #000000;
|
|
}
|
|
|
|
.button_color_cyan {
|
|
background-color: #00ffff;
|
|
color: #000000;
|
|
}
|
|
|
|
.button_color_blue {
|
|
background-color: #0000ff;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.button_color_magenta {
|
|
background-color: #ff00ff;
|
|
color: #000000;
|
|
}
|
|
|
|
/* adjustments for display in club assistant. hacky WIP but should fix most display problems.
|
|
TODO: better recognition than max-width, full design parity to ha/lovelace*/
|
|
@media only screen and (max-width: 600px) {
|
|
:root {
|
|
--bg-color: #1c1c1c;
|
|
--primary-color: #e1e1e1;
|
|
}
|
|
body {
|
|
width: 100%;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
font-family: Roboto,Noto,sans-serif;
|
|
}
|
|
h1 {
|
|
display: none;
|
|
}
|
|
label {
|
|
display: inline;
|
|
}
|
|
.buttons {
|
|
width: 30%;
|
|
}
|
|
.colors {
|
|
width: 70%;
|
|
}
|
|
.controls {
|
|
width: 100%;
|
|
}
|
|
} |