Use anilist color for login button + small refactor

src/components/auth/AuthButton.vue

@@ -2,8 +2,9 @@
   import href from '../../auth/anilist'
 </script>
 <template>
-  <a class="button inline-flex mx-auto max-w-sm items-center" :href="href" target="_blank">
+  <a class="shadow-md hover:shadow-xl p-2 rounded-full text-white px-6
+    transition-shadow bg-blue-900 inline-flex mx-auto max-w-sm items-center" :href="href" target="_blank">
     Login with Anilist
-    <img class="h-5 w-5 ml-3" src="../../assets/android-chrome-512x512.png" />
+    <img class="h-8 w-8 ml-3" src="../../assets/android-chrome-512x512.png" />
   </a>
 </template>

src/main.js

@@ -16,7 +16,7 @@ library.add(faPlus);
 library.add(faPoo);
 
 import ApolloClient from "apollo-boost";
-import { DefaultApolloClient } from "@vue/apollo-composable";
+import { DefaultApolloClient, provideApolloClient} from "@vue/apollo-composable";
 
 const apolloClient = new ApolloClient({
   uri: `https://graphql.anilist.co/`,
@@ -25,7 +25,6 @@ const apolloClient = new ApolloClient({
 import { createApp, provide, h } from 'vue'
 import App from './App.vue'
 import './index.css'
-import { provideApolloClient } from "@vue/apollo-composable";
 
 provideApolloClient(apolloClient)
 

tailwind.config.js

@@ -9,6 +9,9 @@ module.exports = {
       colors: {
         gray: {
           900: '#202225'
+        },
+        blue: {
+          900: '#19212D'
         }
       }
     },