mirror of
https://github.com/HendrikRauh/dmx-interface.git
synced 2025-07-09 23:25:45 +00:00
added logic for loading available networks
This commit is contained in:
parent
5c5e8e9e5a
commit
12aa87ac90
7 changed files with 145 additions and 11 deletions
|
@ -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;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue