add brand, fix typo, clickable cards

components/Card.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  .card
+  .card(@click="goToSite(url)")
     .card--title
       p {{title}}
     .card--body
@@ -9,7 +9,12 @@
 
 <script>
 export default {
-  props: ['title', 'desc', 'url']
+  props: ['title', 'desc', 'url'],
+  methods: {
+    goToSite(url){
+      location.href = url
+    }
+  }
 }
 </script>
 
@@ -19,6 +24,17 @@ export default {
   background: #2D3748;
   border-radius: .3rem;
   padding: 1rem;
+  transition: .2s ease-in-out;
+  display:flex;
+  flex-direction: column;
+
+  &:hover {
+    transform: scale(1.002);
+    background: #008190;
+    cursor: pointer;
+    box-shadow: 0 4px 6px -1px rgba(45, 55, 72, 0.1), 0 2px 4px -1px rgba(45, 55, 72, 0.06);
+
+  }
 
   &--title {
     p{
@@ -38,6 +54,7 @@ export default {
     a {
      font-size: 12px;
      line-height: 1;
+     align-self: bottom;
     }
   }
 }

components/Logo.vue

@@ -1,15 +1,38 @@
 <template lang="pug">
-  nuxt-link(to="/").logo
+  .logo(@click="goToHome")
     img(src="~/assets/logo.svg")
+    p webgems.io
 </template>
 
+<script>
+export default {
+  methods: {
+    goToHome(){
+      this.$router.push("/")
+    }
+  }
+}
+</script>
+
 
 <style lang="scss" scoped>
 .logo {
   display: flex;
   align-items: center;
+  justify-content: center;
+  flex-direction: row;
+
+  &:hover {
+    cursor: pointer;
+  }
+  img {
+    max-width:30px;
+  }
+  p {
+    margin: 0 0 0 .3rem;
+    font-size: 12px;
+  }
 }
-img {
+
-  padding: .2rem;
+
-}
 </style>

nuxt.config.js

@@ -7,7 +7,7 @@ export default {
   ** Headers of the page
   */
   head: {
-    title: '💎webgems',
+    title: 'webgems',
     meta: [
       { charset: 'utf-8' },
       { name: 'viewport', content: 'width=device-width, initial-scale=1' },

pages/index.vue

@@ -2,8 +2,7 @@
 div
   main
     h1.text-black.font-bold.text-xl.mb-2 What is  
-      span.text-teal webgems 💎 
+      span 💎 webgems ?
-      | ?
     p As of now, it's a curated list of resources for developers and designers. If you want to suggest a resource, go ahead and contact me 
       a(href="https://twitter.com/lostdesign") @lostdesign 
       | or lost#0001 on discord