Files
thetool/public/css/views/RaspberryDisplay.css
Luca Haid 742a2c1495 - fixed RaspberryDisplay definition
- added axios library to plugins
- added vue library to plugins
- added tt-frontend-framework for vue with basic documentation
- added git_merge_ts to additionalCSS
- added git_merge_ts to additionalJS
- added property JSGlobals
- refactored RaspberryDisplay Module
2024-02-14 11:05:52 +01:00

51 lines
857 B
CSS

[v-cloak] {
display: none !important;
}
.display-grid {
display: grid;
grid-template-columns: repeat(8, 11.25vw);
grid-row-gap: 20px;
width: 100vw;
}
.display {
background-color: #f8f9fa;
border: 2px solid #dee2e6;
border-radius: 4px;
overflow: hidden;
font-size: clamp(0.6rem, 0.8rem, 1.1rem);
display: grid;
grid-template-rows: repeat(3, 1fr);
justify-items: center;
}
.display > *:nth-child(1) {
align-self: start;
}
.display > *:nth-child(2) {
align-self: center;
}
.display > *:nth-child(3) {
align-self: end;
}
.small-27-inch {
grid-column: span 1;
margin: 0 0.37vw;
width: calc(10.5vw);
height: calc(10.5vw * 9 / 16)
}
.big-42-inch {
grid-column: span 2;
margin: 0 0.37vw;
width: calc(21vw);
height: calc(21vw * 9 / 16)
}
label {
margin: 0;
}