refactor(ui): better rendering with Inter font

components/graphql/Type.vue

@@ -1,7 +1,7 @@
 <template>
   <div :id="`type_${gqlType.name}`" class="p-4">
     <div
-      class="font-semibold text-xs type-title"
+      class="font-semibold type-title"
       :class="{ 'text-accent': isHighlighted }"
     >
       <span v-if="isInput" class="text-accent">input </span>
@@ -9,14 +9,11 @@
       <span v-else-if="isEnum" class="text-accent">enum </span>
       {{ gqlType.name }}
     </div>
-    <div
-      v-if="gqlType.description"
-      class="text-xs text-secondaryLight py-2 type-desc"
-    >
+    <div v-if="gqlType.description" class="text-secondaryLight py-2 type-desc">
       {{ gqlType.description }}
     </div>
     <div v-if="interfaces.length > 0">
-      <h5 class="my-2 text-xs">Interfaces:</h5>
+      <h5 class="my-2">Interfaces:</h5>
       <div
         v-for="(gqlInterface, index) in interfaces"
         :key="`gqlInterface-${index}`"
@@ -29,7 +26,7 @@
       </div>
     </div>
     <div v-if="children.length > 0" class="mb-2">
-      <h5 class="my-2 text-xs">Children:</h5>
+      <h5 class="my-2">Children:</h5>
       <GraphqlTypeLink
         v-for="(child, index) in children"
         :key="`child-${index}`"
@@ -39,7 +36,7 @@
       />
     </div>
     <div v-if="gqlType.getFields">
-      <h5 class="my-2 text-xs">Fields:</h5>
+      <h5 class="my-2">Fields:</h5>
       <GraphqlField
         v-for="(field, index) in gqlType.getFields()"
         :key="`field-${index}`"
@@ -50,7 +47,7 @@
       />
     </div>
     <div v-if="isEnum">
-      <h5 class="my-2 text-xs">Values:</h5>
+      <h5 class="my-2">Values:</h5>
       <div
         v-for="(value, index) in gqlType.getValues()"
         :key="`value-${index}`"