jonas/SimonSays
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style centers now vertical also in portrait mode

Browse Source
This commit is contained in:
Jonas Weinz 2019-02-26 15:05:10 +01:00
parent 9f78586bac
commit 6f9fdef63b
1 changed files with 4 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
style.css
View File

@ -17,6 +17,7 @@ body {
--opacity: 0.2; --opacity: 0.2;
--border-radius: 1vh; --border-radius: 1vh;
--sidebar-width: 25vh; --sidebar-width: 25vh;
--sidebar-height: none; /* unused if not in portrait mode */
} }
/* override settings on portrait mode: */ /* override settings on portrait mode: */
@ -27,6 +28,7 @@ body {
--tile-size: calc((100vw / var(--grid-width)) - 2 * var(--button-margin)); --tile-size: calc((100vw / var(--grid-width)) - 2 * var(--button-margin));
--border-radius: 1vw; --border-radius: 1vw;
--sidebar-width: 40vw; --sidebar-width: 40vw;
--sidebar-height: 15vw;
} }
} }
@ -113,7 +115,7 @@ body {
.main-container { .main-container {
white-space: normal; white-space: normal;
padding-top: 10px; padding-top: calc(50vh - 0.5 * (var(--grid-height) * var(--tile-size) + var(--sidebar-height)) - 2 * var(--border-radius));
} }
} }
@ -149,7 +151,7 @@ body {
display: inline-flex; display: inline-flex;
justify-content: space-between; justify-content: space-between;
flex-direction:row; flex-direction:row;
min-height: 0; min-height: var(--sidebar-height);
min-width: calc(var(--grid-width) * var(--tile-size)); min-width: calc(var(--grid-width) * var(--tile-size));
} }