status/gui/dashboard/components/aspectratio.svelte
Romein van Buren 6241de18fe
Dashboard aspect ratio
Signed-off-by: Romein van Buren <romein@vburen.nl>
2022-07-08 14:50:15 +02:00

30 lines
508 B
Svelte

<div class="center">
<div class="ratio">
<slot />
</div>
</div>
<style>
.center {
display: flex;
align-items: center;
justify-content: center;
width: 100vw;
height: 100vh;
}
.ratio {
border-radius: var(--radius);
background-color: var(--dark);
background-color: red;
height: 56.25vw;
left: 50%;
max-height: 100vh;
max-width: 177.77778vh;
position: absolute;
top: 50%;
transform: translate(-50%,-50%);
width: 100vw;
}
</style>