medlogic
/
olivetin
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feature: displays have basic styling (#317)

This commit is contained in:
James Read 2024-05-23 09:21:57 +01:00 committed by GitHub
parent 7e34efd453
commit 8fbbd9b32c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
webui.dev/js/marshaller.js
View File

@ -422,6 +422,7 @@ function createDirectoryBreadcrumb (title, link) {
function marshalDisplay (item, fieldset) { function marshalDisplay (item, fieldset) {
const display = document.createElement('div') const display = document.createElement('div')
display.innerHTML = item.title display.innerHTML = item.title
display.classList.add('display')
fieldset.appendChild(display) fieldset.appendChild(display)
} }

22
webui.dev/style.css
View File

@ -202,22 +202,13 @@ tr.log-row span.icon {
.error { .error {
background-color: salmon; background-color: salmon;
color: black;
} }
.title.temporary-status-message { .title.temporary-status-message {
color: gray; color: gray;
} }
div.entity {
background-color: white;
box-shadow: 0 0 10px 0 #444;
display: grid;
grid-column: auto / span 2;
grid-row: auto / span 2;
grid-template-rows: auto min-content;
grid-template-columns: minmax(min-content, auto);
}
h2 { h2 {
display: inline-block; display: inline-block;
font-size: 1em; font-size: 1em;
@ -472,6 +463,13 @@ div.toolbar * {
margin-right: 1em; margin-right: 1em;
} }
div.display {
align-content: center;
border: 1px solid #666;
box-shadow: 0 0 6px 0 #aaa;
border-radius: .7em;
}
@media screen and (width <= 600px) { @media screen and (width <= 600px) {
fieldset { fieldset {
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
@ -575,4 +573,8 @@ div.toolbar * {
div.toolbar { div.toolbar {
background-color: black; background-color: black;
} }
div.display {
box-shadow: 0 0 6px 0 #444;
}
} }