Fix CSS extraneous space beneath icons

client/web/src/components/widgets/DropdownButton.vue

@@ -13,6 +13,7 @@
 	outline: none;
 	border: none;
 	border-radius: 2px;
+	vertical-align: top;
 	background: #111;
 	fill: #ddd;
 

client/web/src/components/widgets/IconButton.vue

@@ -8,17 +8,15 @@
 .icon-button {
 	display: inline-block;
 	flex: 0 0 auto;
+	padding: 0;
 	outline: none;
 	border: none;
-	padding: 0;
+	border-radius: 2px;
+	background: none;
+	vertical-align: top;
+	fill: #ddd;
 	width: 16px;
 	height: 16px;
-	background: none;
-	font-weight: bold;
-	font-size: 10px;
-	border-radius: 2px;
-	color: #ddd;
-	fill: #ddd;
 
 	&:not(.gap-after) + .icon-button {
 		margin-left: 0;

client/web/src/components/widgets/IconContainer.vue

@@ -8,17 +8,10 @@
 .icon-container {
 	display: inline-block;
 	flex: 0 0 auto;
-	outline: none;
-	border: none;
-	padding: 0;
+	fill: #ddd;
+	vertical-align: top;
 	width: 16px;
 	height: 16px;
-	background: none;
-	font-weight: bold;
-	font-size: 10px;
-	border-radius: 2px;
-	color: #ddd;
-	fill: #ddd;
 
 	&:not(.gap-after) + .icon-container {
 		margin-left: 0;

client/web/src/components/widgets/NumberInput.vue

@@ -24,7 +24,7 @@
 		padding: 0;
 		line-height: 22px;
 		color: #ddd;
-		font-size: 14px;
+		font-size: inherit;
 		text-align: center;
 		font-family: inherit;
 

client/web/src/components/widgets/RadioPicker.vue

@@ -6,8 +6,6 @@
 
 <style lang="scss">
 .radio-picker {
-	font-size: 0;
-
 	button {
 		fill: #ddd;
 		border-radius: 0;

client/web/src/components/widgets/ShelfItem.vue

@@ -8,7 +8,6 @@
 .shelf-item {
 	padding: 4px;
 	border-radius: 2px;
-	font-size: 0;
 
 	&:hover {
 		background: #666;
@@ -21,6 +20,7 @@
 	svg {
 		width: 24px;
 		height: 24px;
+		vertical-align: top;
 	}
 }
 </style>