Changes to improve display on small screens

assets/scss/default_theme/components/_plate_container.scss

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

assets/scss/default_theme/components/_plates.scss

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

assets/scss/default_theme/components/_transfer_menu.scss

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

assets/scss/default_theme/main.scss

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