From dd4e2ca9fbf29a54686a96323a90fac90564eb70 Mon Sep 17 00:00:00 2001
From: Raymonzut <40148684+Raymonzut@users.noreply.github.com>
Date: Mon, 1 Jun 2020 16:53:40 +0200
Subject: [PATCH] Style theme switching button

---
 client/src/App.vue | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/client/src/App.vue b/client/src/App.vue
index 52c0f7c..a903e65 100644
--- a/client/src/App.vue
+++ b/client/src/App.vue
@@ -5,10 +5,10 @@
     <router-link to="/posts">Posts</router-link> |
     <router-link to="/qa">QA</router-link>
   </div>
-  <router-view />
   <div>
-  <button @click="toggleTheme">{{ themeToggleVerb }} my eyes</button>
+    <button id="toggleThemeButton" @click="toggleTheme">{{ themeToggleVerb }} my eyes</button>
   </div>
+  <router-view />
 </div>
 </template>
 
@@ -67,5 +67,21 @@ body {
   min-height: 100vh;
 }
 
+#toggleThemeButton {
+  background: var(--primary-color);
+  border: 0px;
+  color: var(--text-color);
+  margin: 0 auto;
+
+  margin-right: 0px;
+}
+
+@media (min-width:420px) {
+  #toggleThemeButton {
+    float:right;
+    margin-right: 10px;
+  }
+}
+
 </style>