From bf1a143f0327bf12f33697329c0c71b702512bd2 Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyasthomas@gmail.com>
Date: Fri, 10 Jan 2020 05:30:38 +0530
Subject: [PATCH] :art: Minor stylings

---
 components/autocomplete.vue     |  1 +
 components/graphql/argument.vue | 16 +++++-----------
 components/graphql/field.vue    | 24 +++++++++++++-----------
 components/graphql/type.vue     |  2 +-
 components/graphql/typelink.vue | 13 +++++++------
 components/history.vue          |  1 +
 6 files changed, 28 insertions(+), 29 deletions(-)

diff --git a/components/autocomplete.vue b/components/autocomplete.vue
index 3a0a936d8..6a32c306b 100644
--- a/components/autocomplete.vue
+++ b/components/autocomplete.vue
@@ -58,6 +58,7 @@
       padding: 8px 16px;
       font-size: 16px;
       font-family: "Roboto Mono", monospace;
+      font-weight: 400;
 
       &:last-child {
         border-radius: 0 0 8px 8px;
diff --git a/components/graphql/argument.vue b/components/graphql/argument.vue
index 335381a41..d70f0d01c 100644
--- a/components/graphql/argument.vue
+++ b/components/graphql/argument.vue
@@ -4,18 +4,14 @@
       {{ argName }}
     </span>
     :
-    <typelink 
-      :type="argType"
-      :jumpTypeCallback="jumpCallback"
-    />
+    <typelink :type="argType" :jumpTypeCallback="jumpCallback" />
   </span>
 </template>
 
-<style>
-</style>
+<style></style>
 
 <script>
-import typelink from './typelink';
+import typelink from "./typelink";
 
 export default {
   components: {
@@ -36,9 +32,7 @@ export default {
   },
 
   methods: {
-    jumpCallback(typeName) {
-
-    }
+    jumpCallback(typeName) {}
   }
-}
+};
 </script>
diff --git a/components/graphql/field.vue b/components/graphql/field.vue
index e717cca2c..b0fc403e5 100644
--- a/components/graphql/field.vue
+++ b/components/graphql/field.vue
@@ -4,14 +4,19 @@
       {{ fieldName }}
       <span v-if="fieldArgs.length > 0">
         (
-          <span v-for="(field, index) in fieldArgs" :key="index">
-            {{ field.name }}: <typelink :gqlType="field.type" :jumpTypeCallback="jumpTypeCallback" />
-            <span v-if="index !== fieldArgs.length - 1">
-              ,
-            </span>
+        <span v-for="(field, index) in fieldArgs" :key="index">
+          {{ field.name }}:
+          <typelink
+            :gqlType="field.type"
+            :jumpTypeCallback="jumpTypeCallback"
+          />
+          <span v-if="index !== fieldArgs.length - 1">
+            ,
           </span>
-        )
-      </span>: <typelink :gqlType="gqlField.type" :jumpTypeCallback="jumpTypeCallback" />
+        </span>
+        ) </span
+      >:
+      <typelink :gqlType="gqlField.type" :jumpTypeCallback="jumpTypeCallback" />
     </div>
     <div class="field-desc" v-if="gqlField.description">
       {{ gqlField.description }}
@@ -20,7 +25,6 @@
     <div class="field-deprecated" v-if="gqlField.isDeprecated">
       DEPRECATED
     </div>
-
   </div>
 </template>
 
@@ -49,7 +53,7 @@
 </style>
 
 <script>
-import typelink from './typelink';
+import typelink from "./typelink";
 
 export default {
   components: {
@@ -58,7 +62,6 @@ export default {
 
   props: {
     gqlField: Object,
-
     jumpTypeCallback: Function
   },
 
@@ -73,7 +76,6 @@ export default {
         );
       }, "");
       const argsString = args.length > 0 ? `(${args})` : "";
-
       return `${
         this.gqlField.name
       }${argsString}: ${this.gqlField.type.toString()}`;
diff --git a/components/graphql/type.vue b/components/graphql/type.vue
index 4bf00b511..0c9b338cd 100644
--- a/components/graphql/type.vue
+++ b/components/graphql/type.vue
@@ -35,9 +35,9 @@ export default {
   components: {
     "gql-field": () => import("./field")
   },
+
   props: {
     gqlType: {},
-
     jumpTypeCallback: Function
   }
 };
diff --git a/components/graphql/typelink.vue b/components/graphql/typelink.vue
index b451d7f93..2d1c97d8e 100644
--- a/components/graphql/typelink.vue
+++ b/components/graphql/typelink.vue
@@ -3,16 +3,18 @@
 </template>
 
 <style>
-  .typelink {
-    color: red
-  }
+.typelink {
+  color: var(--ac-color);
+  font-family: "Roboto Mono", monospace;
+  font-weight: 400;
+  cursor: pointer;
+}
 </style>
 
 <script>
 export default {
   props: {
     gqlType: null,
-
     // (typeName: string) => void
     jumpTypeCallback: Function
   },
@@ -28,6 +30,5 @@ export default {
       this.jumpTypeCallback(this.gqlType);
     }
   }
-}
+};
 </script>
-
diff --git a/components/history.vue b/components/history.vue
index 2b1acbfac..ad248c56f 100644
--- a/components/history.vue
+++ b/components/history.vue
@@ -298,6 +298,7 @@ ol li {
     top: 10px;
     right: 10px;
     font-family: "Roboto Mono", monospace;
+    font-weight: 400;
     background-color: transparent;
     padding: 2px 6px;
     border-radius: 8px;