ctbk/dmx-interface
1
0
Fork 0
mirror of https://github.com/HendrikRauh/dmx-interface.git synced 2025-07-09 23:25:45 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

added logic for loading available networks

Browse source
This commit is contained in:
RaffaelW 2024-11-09 22:38:37 +01:00
parent 5c5e8e9e5a
commit 12aa87ac90
7 changed files with 145 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

30
data/style.css
View file

@ -3,6 +3,7 @@
--color-on-primary: white;
--color-background: #222;
--color-danger: #fa2b58;
--icon-button-size: 2.5rem;
}
body {
@ -38,11 +39,16 @@ fieldset {
label {
display: block;
display: flex;
gap: 8px;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
label span {
flex-grow: 1;
}
input,
select {
width: clamp(200px, 100%, 400px);
@ -60,6 +66,10 @@ select:focus {
border-color: var(--color-primary);
}
select:has(+ .icon-button) {
width: calc(clamp(200px, 100%, 400px) - var(--icon-button-size) - 8px);
}
button {
border: none;
inset: none;
@ -143,10 +153,14 @@ label.switch input:checked + .slider::before {
justify-content: center;
}
h2.error {
.error {
color: var(--color-danger);
}
.error-bg {
background-color: var(--color-danger) !important;
}
button.reload {
display: block;
margin: 0 auto;
@ -195,3 +209,17 @@ button.reload {
transform: rotate(360deg);
}
}
.icon-button {
padding: 8px;
font-size: 0;
width: var(--icon-button-size);
height: var(--icon-button-size);
}
.spinning {
animation-name: spin;
animation-duration: 0.5s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}