refactor: set placement as top by edfault for modals, better response header layout

components/app/Search.vue

@@ -1,5 +1,5 @@
 <template>
-  <SmartModal v-if="show" placement="top" @close="$emit('hide-modal')">
+  <SmartModal v-if="show" @close="$emit('hide-modal')">
     <template #body>
       <input
         id="command"

components/app/Shortcuts.vue

@@ -38,7 +38,8 @@
               pl-8
               transition
               truncate
-              focus:border-divider focus:outline-none
+              focus:(border-divider
+              outline-none)
             "
             :placeholder="$t('search')"
           />

components/app/Sidenav.vue

@@ -30,18 +30,21 @@
         v-tippy="{ theme: 'tooltip', placement: 'top' }"
         :title="`${$t('app.search')} <kbd>/</kbd>`"
         icon="search"
+        class="rounded"
         @click.native="showSearch = true"
       />
       <ButtonSecondary
         v-tippy="{ theme: 'tooltip', placement: 'top' }"
         :title="$t('app.invite')"
         icon="person_add_alt"
+        class="rounded"
         @click.native="showShare = true"
       />
       <ButtonSecondary
         v-tippy="{ theme: 'tooltip', placement: 'top' }"
         :title="`${$t('support.title')} <kbd>?</kbd>`"
         icon="support"
+        class="rounded"
         @click.native="showSupport = true"
       />
     </nav>

components/app/Support.vue

@@ -2,7 +2,6 @@
   <SmartModal
     v-if="show"
     :title="$t('support.title')"
-    placement="top"
     @close="$emit('hide-modal')"
   >
     <template #body>