Update the QueryStatus app theme (closes #61)

This commit is contained in:
Oliver 2026-05-01 15:26:57 -06:00
parent 6723e0d25f
commit 749d442bd8
3 changed files with 56 additions and 7 deletions

View file

@ -1,4 +1,9 @@
.taf.QueryStatus {
> .window-content {
color: var(--query-status-colour);
background: var(--query-status-background);
}
.user-list {
display: flex;
flex-direction: column;
@ -11,7 +16,8 @@
display: flex;
flex-direction: column;
margin: 0;
border: 1px solid rebeccapurple;
color: var(--query-status-user-colour);
background: var(--query-status-user-background);
border-radius: 4px;
padding: 4px 8px;
@ -22,6 +28,19 @@
/* Same height as the icons used for loading/disconnected */
height: 35px;
}
button {
color: var(--query-status-user-button-colour);
background: var(--query-status-user-button-background);
&:hover {
background: var(--query-status-user-button-hover-background);
}
&:focus-visible {
border-color: var(--query-status-user-button-focus);
}
}
}
}
@ -29,5 +48,23 @@
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
button {
color: var(--query-status-control-colour);
background: var(--query-status-control-background);
&:hover {
background: var(--query-status-control-hover-background);
}
&:focus-visible {
border-color: var(--query-status-control-focus);
}
}
}
button {
border: 2px solid transparent;
outline: none;
}
}