dyna3/app-proto/inversive-display/main.css
2024-09-09 00:32:29 -07:00

60 lines
818 B
CSS

body {
margin-left: 20px;
margin-top: 20px;
color: #fcfcfc;
background-color: #202020;
}
#app {
display: flex;
flex-direction: column;
width: 600px;
}
canvas {
float: left;
background-color: #020202;
border-radius: 10px;
margin-top: 5px;
}
.hidden {
display: none;
}
.control, .tab-pane {
display: flex;
flex-direction: row;
width: 600px;
}
input[type="radio"] {
display: none;
}
.tab-pane > label {
border: 1px solid #aaa;
border-radius: 5px;
text-align: center;
padding: 5px;
margin-right: 10px;
margin-bottom: 5px;
}
.tab-pane > label:has(:checked) {
border-color: #fcfcfc;
background-color: #555;
}
.tab-pane > label:hover:not(:has(:checked)) {
border-color: #bbb;
background-color: #333;
}
.control > span {
width: 170px;
}
input {
flex-grow: 1;
}