feat: more storybook stories

components/app/Header.vue

@@ -1,16 +1,10 @@
 <template>
   <header class="flex flex-1 py-2 px-4 items-center justify-between">
     <div
-      class="
-        font-extrabold
-        space-x-2
-        flex-shrink-0
-        text-sm
-        inline-flex
-        items-center
-      "
+      class="font-bold space-x-2 flex-shrink-0 text-sm inline-flex items-center"
     >
       <AppLogo />
+      <span>Hoppscotch</span>
     </div>
     <div class="space-x-2 flex-shrink-0 inline-flex items-center">
       <AppGitHubStarButton class="mt-1 mr-2" />
@@ -59,7 +53,7 @@
           <SmartItem
             to="/settings"
             icon="settings"
-            :label="$t('settings')"
+            :label="$t('navigation.settings')"
             @click.native="$refs.user.tippy().hide()"
           />
           <FirebaseLogout @confirm-logout="$refs.user.tippy().hide()" />

components/app/Logo.vue

@@ -1,7 +1,15 @@
 <template>
-  <svg class="logo" xmlns="http://www.w3.org/2000/svg" width="32" height="32">
-    <circle class="fill-current" r="8" cx="50%" cy="50%" />
-    <circle class="fill-primary" r="6" cx="50%" cy="50%" />
+  <svg
+    class="logo"
+    viewBox="0 0 24 24"
+    width="16"
+    height="16"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      class="fill-current"
+      d="M2.534 9.287C2.534 15.46 7.56 24 12 24c4.18 0 9.466-8.539 9.466-14.713C21.467 3.113 17.228 0 12 0 6.772 0 2.534 3.113 2.534 9.287zm11.926 4.565a4.649 4.649 0 014.257-1.261 4.649 4.649 0 01-1.262 4.256 4.649 4.649 0 01-4.257 1.262 4.649 4.649 0 011.262-4.257zm-9.177-1.261a4.649 4.649 0 014.258 1.261 4.649 4.649 0 011.261 4.257 4.649 4.649 0 01-4.257-1.262 4.649 4.649 0 01-1.262-4.256z"
+    />
   </svg>
 </template>