Small styling fix for the controls bar

Signed-off-by: Julius Härtl <jus@bitgrid.net>

src/components/Controls.vue

@@ -380,7 +380,7 @@ export default {
 <style lang="scss" scoped>
 	.controls {
 		display: flex;
-		padding: 3px;
+		margin: 5px;
 		height: 44px;
 		padding-left: 44px;
 
@@ -431,6 +431,9 @@ export default {
 	}
 
 	.deck-search {
+		display: flex;
+		align-items: center;
+		justify-content: center;
 		input[type=search] {
 			background-position: 5px;
 			padding-left: 24px;

src/components/icons/DeckIcon.vue

@@ -1,19 +1,39 @@
 <template>
-    <svg xmlns="http://www.w3.org/2000/svg" :height="size" :width="size" version="1.1" viewBox="0 0 16 16">
-        <rect ry="1" height="8" width="14" y="7" x="1"/>
-        <rect ry=".5" height="1" width="12" y="5" x="2"/>
-        <rect ry=".5" height="1" width="10" y="3" x="3"/>
-        <rect ry=".5" height="1" width="8" y="1" x="4"/>
-    </svg>
+	<svg xmlns="http://www.w3.org/2000/svg"
+		:height="size"
+		:width="size"
+		version="1.1"
+		viewBox="0 0 16 16">
+		<rect ry="1"
+			height="8"
+			width="14"
+			y="7"
+			x="1" />
+		<rect ry=".5"
+			height="1"
+			width="12"
+			y="5"
+			x="2" />
+		<rect ry=".5"
+			height="1"
+			width="10"
+			y="3"
+			x="3" />
+		<rect ry=".5"
+			height="1"
+			width="8"
+			y="1"
+			x="4" />
+	</svg>
 </template>
 <script>
 export default {
-    name: 'DeckIcon',
-    props: {
-        size: {
-            type: Number,
-            default: 16,
-        },
-    },
+	name: 'DeckIcon',
+	props: {
+		size: {
+			type: Number,
+			default: 16,
+		},
+	},
 }
-</script>
+</script>

src/main.js

@@ -76,8 +76,9 @@ window.addEventListener('DOMContentLoaded', () => {
 
 /* eslint-disable-next-line no-new */
 new Vue({
-	name: 'Deck',
 	el: '#content',
+	// eslint-disable-next-line vue/match-component-file-name
+	name: 'Deck',
 	router,
 	store,
 	data() {