Changes to improve display on small screens

This commit is contained in:
Emilia Allison 2023-06-13 12:01:37 -04:00
parent c27693b7fb
commit 4665788a27
Signed by: emilia
GPG Key ID: 7A3F8997BFE894E0
4 changed files with 12 additions and 3 deletions

View File

@ -4,7 +4,7 @@
div.plate_container { div.plate_container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-around; justify-content: center;
align-items: center; align-items: center;
border: 2px solid $color-dark; border: 2px solid $color-dark;
@ -15,4 +15,8 @@ div.plate_container {
margin-bottom: 1%; margin-bottom: 1%;
text-align: center; text-align: center;
} }
.plate_container--destination {
margin-top: 3%;
}
} }

View File

@ -15,12 +15,11 @@ table, tr, td {
} }
th { th {
font-family: monospace; font-family: monospace;
font-size: 0.5em; font-size: 0.5rem;
} }
td.plate_cell { td.plate_cell {
height: 2.3vmin;
background: none; background: none;
} }

View File

@ -57,6 +57,8 @@ input {
} }
&[type="number"] { &[type="number"] {
width: 2em; width: 2em;
-webkit-appearance: none;
-moz-appearance: textfield;
} }
&.volume_input { &.volume_input {
width: 4em; width: 4em;

View File

@ -8,3 +8,7 @@
.fs-600 { font-size: $fs-600; font-weight: 300;} .fs-600 { font-size: $fs-600; font-weight: 300;}
.fs-500 { font-size: $fs-500; font-weight: 200;} .fs-500 { font-size: $fs-500; font-weight: 200;}
.fs-400 { font-size: $fs-400; font-weight: 200;} .fs-400 { font-size: $fs-400; font-weight: 200;}
html {
font-size: 1vmin;
}