From c3921bebf22e4ebb511a0eb9ae9130ddfbec1151 Mon Sep 17 00:00:00 2001
From: liyasthomas <liyascthomas@gmail.com>
Date: Mon, 26 Jul 2021 09:08:06 +0530
Subject: [PATCH] fix: proper padding and margins

---
 assets/scss/styles.scss              |  3 ++-
 components/environments/index.vue    |  2 +-
 components/http/BodyParameters.vue   |  2 +-
 components/http/Headers.vue          |  2 +-
 components/http/Parameters.vue       |  2 +-
 components/http/PreRequestScript.vue |  2 +-
 components/http/RawBody.vue          |  2 +-
 components/http/Request.vue          | 19 ++++++++-----------
 components/http/Tests.vue            |  4 ++--
 components/smart/Modal.vue           |  2 +-
 layouts/error.vue                    |  2 +-
 pages/index.vue                      |  2 +-
 12 files changed, 21 insertions(+), 23 deletions(-)

diff --git a/assets/scss/styles.scss b/assets/scss/styles.scss
index 143964424..e9bec8e2a 100644
--- a/assets/scss/styles.scss
+++ b/assets/scss/styles.scss
@@ -166,7 +166,8 @@ hr {
   @apply bg-primary;
   @apply truncate;
   @apply rounded;
-  @apply font-semibold;
+  @apply text-xs;
+  @apply font-semibold font-mono;
   @apply border border-divider;
   @apply transition;
   @apply focus:(outline-none border-accent);
diff --git a/components/environments/index.vue b/components/environments/index.vue
index 117633b62..45fd0adee 100644
--- a/components/environments/index.vue
+++ b/components/environments/index.vue
@@ -9,7 +9,7 @@
             bg-primaryLight
             border-b border-dividerLight
             flex
-            font-medium
+            font-semibold font-mono
             w-full
             py-2
             px-4
diff --git a/components/http/BodyParameters.vue b/components/http/BodyParameters.vue
index 91b9388d7..ec5bd3f74 100644
--- a/components/http/BodyParameters.vue
+++ b/components/http/BodyParameters.vue
@@ -6,7 +6,7 @@
         border-b border-dividerLight
         flex flex-1
         pl-4
-        top-98px
+        top-24
         z-10
         sticky
         items-center
diff --git a/components/http/Headers.vue b/components/http/Headers.vue
index 3e41678a0..6c84f3618 100644
--- a/components/http/Headers.vue
+++ b/components/http/Headers.vue
@@ -6,7 +6,7 @@
         border-b border-dividerLight
         flex flex-1
         pl-4
-        top-98px
+        top-24
         z-10
         sticky
         items-center
diff --git a/components/http/Parameters.vue b/components/http/Parameters.vue
index aae94ff1e..820ffd5fa 100644
--- a/components/http/Parameters.vue
+++ b/components/http/Parameters.vue
@@ -6,7 +6,7 @@
         border-b border-dividerLight
         flex flex-1
         pl-4
-        top-98px
+        top-24
         z-10
         sticky
         items-center
diff --git a/components/http/PreRequestScript.vue b/components/http/PreRequestScript.vue
index 0738e7636..f49cc4c98 100644
--- a/components/http/PreRequestScript.vue
+++ b/components/http/PreRequestScript.vue
@@ -6,7 +6,7 @@
         border-b border-dividerLight
         flex flex-1
         pl-4
-        top-98px
+        top-24
         z-10
         sticky
         items-center
diff --git a/components/http/RawBody.vue b/components/http/RawBody.vue
index 6a21a3c70..5a510ed41 100644
--- a/components/http/RawBody.vue
+++ b/components/http/RawBody.vue
@@ -6,7 +6,7 @@
         border-b border-dividerLight
         flex flex-1
         pl-4
-        top-98px
+        top-24
         z-10
         sticky
         items-center
diff --git a/components/http/Request.vue b/components/http/Request.vue
index 42560b528..95d488810 100644
--- a/components/http/Request.vue
+++ b/components/http/Request.vue
@@ -20,8 +20,9 @@
                 cursor-pointer
                 flex
                 font-semibold font-mono
+                h-8
                 text-secondaryDark
-                py-2
+                py-1
                 px-4
                 transition
                 w-28
@@ -53,10 +54,11 @@
         class="
           bg-primaryLight
           border border-divider
+          flex
           font-semibold font-mono
+          flex-1
           text-secondaryDark
-          w-full
-          py-2
+          py-1
           px-4
           transition
           truncate
@@ -76,7 +78,6 @@
         class="rounded-none"
         :label="!loading ? $t('send') : $t('cancel')"
         :shortcut="[getSpecialKey(), 'G']"
-        outline
         @click.native="!loading ? newSendRequest() : cancelRequest()"
       />
       <span class="inline-flex">
@@ -89,11 +90,7 @@
           arrow
         >
           <template #trigger>
-            <ButtonPrimary
-              class="rounded-l-none"
-              icon="keyboard_arrow_down"
-              outline
-            />
+            <ButtonPrimary class="rounded-l-none" icon="keyboard_arrow_down" />
           </template>
           <SmartItem
             :label="$t('import_curl')"
@@ -123,7 +120,7 @@
         </tippy>
       </span>
       <ButtonSecondary
-        class="rounded-r-none ml-2"
+        class="rounded-r-none h-8 ml-2"
         :label="$t('save')"
         :shortcut="[getSpecialKey(), 'S']"
         outline
@@ -142,7 +139,7 @@
             <ButtonSecondary
               icon="keyboard_arrow_down"
               outline
-              class="rounded-l-none"
+              class="rounded-l-none h-8"
             />
           </template>
           <input
diff --git a/components/http/Tests.vue b/components/http/Tests.vue
index cb4b89909..857b79d8c 100644
--- a/components/http/Tests.vue
+++ b/components/http/Tests.vue
@@ -6,7 +6,7 @@
         border-b border-dividerLight
         flex flex-1
         pl-4
-        top-98px
+        top-24
         z-10
         sticky
         items-center
@@ -43,7 +43,7 @@
           border-b border-dividerLight
           flex flex-1
           pl-4
-          top-98px
+          top-24
           z-10
           sticky
           items-center
diff --git a/components/smart/Modal.vue b/components/smart/Modal.vue
index e02f5c52c..abb2c08b7 100644
--- a/components/smart/Modal.vue
+++ b/components/smart/Modal.vue
@@ -3,7 +3,7 @@
     <div
       ref="modal"
       class="
-        bg-primaryLight
+        bg-primaryDark
         flex
         h-full
         w-full
diff --git a/layouts/error.vue b/layouts/error.vue
index 2748f33fd..48e33bc57 100644
--- a/layouts/error.vue
+++ b/layouts/error.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="page page-error">
     <h1 class="font-mono mb-4 text-4xl heading">{{ statusCode }}</h1>
-    <h3 class="font-mono text-xs">{{ message }}</h3>
+    <h3 class="font-mono font-semibold text-xs">{{ message }}</h3>
     <p class="mt-4">
       <ButtonSecondary to="/" icon="home" :label="$t('go_home')" />
       <ButtonSecondary
diff --git a/pages/index.vue b/pages/index.vue
index 3a6c05d2f..695b03d23 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -6,7 +6,7 @@
         <Splitpanes :dbl-click-splitter="false" horizontal>
           <Pane class="hide-scrollbar !overflow-auto">
             <HttpRequest />
-            <SmartTabs styles="sticky top-66px z-10">
+            <SmartTabs styles="sticky top-16 z-10">
               <SmartTab
                 :id="'params'"
                 :label="$t('parameters')"