Add a realization status indicator

This commit is contained in:
Aaron Fenyes 2025-06-09 22:21:34 -07:00
parent 6d2e3d776b
commit b54a8a92e7
4 changed files with 105 additions and 29 deletions

View file

@ -18,6 +18,17 @@ body {
font-family: 'Fira Sans', sans-serif;
}
.invalid {
color: var(--text-invalid);
}
.status {
width: 20px;
text-align: center;
font-family: 'Noto Emoji';
font-style: normal;
}
/* sidebar */
#sidebar {
@ -138,6 +149,7 @@ details[open]:has(li) .element-switch::after {
}
.regulator-input {
margin-right: 4px;
color: inherit;
background-color: inherit;
border: 1px solid var(--border);
@ -159,14 +171,6 @@ details[open]:has(li) .element-switch::after {
border-color: var(--border-invalid);
}
.status {
width: 20px;
padding-left: 4px;
text-align: center;
font-family: 'Noto Emoji';
font-style: normal;
}
.regulator-input.invalid + .status::after, details:has(.invalid):not([open]) .status::after {
content: '⚠';
color: var(--text-invalid);
@ -174,8 +178,28 @@ details[open]:has(li) .element-switch::after {
/* diagnostics */
#loss-history {
#diagnostics {
margin: 10px;
}
#realization-status {
display: flex;
}
#realization-status .status {
margin-right: 4px;
}
#realization-status .status::after {
content: '✓';
}
#realization-status.invalid .status::after {
content: '⚠';
}
#loss-history {
margin-top: 10px;
background-color: var(--display-background);
border-radius: 8px;
}