refactor: remove absolute classes

components/graphql/Request.vue

@@ -15,10 +15,7 @@
           w-full
           py-2
           px-4
-          transition
-          truncate
-          focus:(border-accent
-          outline-none)
+          focus-visible:border-accent
         "
         :placeholder="$t('url')"
         @keyup.enter="onConnectClick"

components/graphql/RequestOptions.vue

@@ -163,7 +163,7 @@
                 bg-primaryLight
                 flex
                 flex-1
-          py-1
+                py-1
                 px-4
                 truncate
                 focus:outline-none
@@ -177,14 +177,7 @@
               "
             />
             <input
-              class="
-                bg-primaryLight
-                flex flex-1
-                py-2
-                px-4
-                truncate
-                focus:outline-none
-              "
+              class="bg-primaryLight flex flex-1 py-2 px-4"
               :placeholder="$t('count.value', { count: index + 1 })"
               :name="`value ${index}`"
               :value="header.value"
@@ -210,9 +203,9 @@
                 :icon="
                   header.hasOwnProperty('active')
                     ? header.active
-                      ? 'check_box'
-                      : 'check_box_outline_blank'
-                    : 'check_box'
+                      ? 'check_circle_outline'
+                      : 'radio_button_unchecked'
+                    : 'check_circle_outline'
                 "
                 color="green"
                 @click.native="
@@ -228,7 +221,7 @@
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
                 :title="$t('delete')"
-                icon="delete"
+                icon="remove_circle_outline"
                 color="red"
                 @click.native="removeRequestHeader(index)"
               />

components/graphql/Sidebar.vue

@@ -17,16 +17,7 @@
                 v-model="graphqlFieldsFilterText"
                 type="search"
                 :placeholder="$t('search')"
-                class="
-                  bg-primaryLight
-                  flex
-                  w-full
-                  py-2
-                  pr-2
-                  pl-9
-                  truncate
-                  focus:outline-none
-                "
+                class="bg-primaryLight flex w-full py-2 pr-2 pl-9"
               />
             </div>
             <div class="flex">