Style theme switching button

2020-06-01 16:53:53 +02:00
parent aab9885242
commit dd4e2ca9fb
1 changed files with 18 additions and 2 deletions
@@ -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>