Footer update texts and links

src/components/Footer.vue

 <template>
-  <q-footer class="q-pt-xl bg-transparent  text-grey-7">
-    <q-toolbar class="bg-white-3 q-pa-xl">
+  <q-footer class="footer q-pt-md bg-grey-1 text-grey-7">
+    <q-toolbar class="bg-white-3 q-px-xl">
       <q-toolbar-title>
         <div class="flex row content-center items-center">
           <div class="col-md-6 col-sm-12">
             <div class="flex text-caption content-center items-center">
               <div>
-                <img
-                  src="statics/600x600fabr.png"
-                  style="width: 150px"
-                >
+                <img src="statics/600x600fabr.png" style="width: 150px" />
               </div>
               <div class="text-body2">
-                <div class="text-h6">open-source circular fashion</div>
-                <div class="text-body1">a project by:
-                  <a href="https://textile-academy.org">Fabricademy</a><br>
-                  A new textile and technology academy
-                  <br>&copy; 2017-2019 All rights reserved
+                <div class="subtitle">open-source circular fashion</div>
+                <div class="text-caption">
+                  a project by:
+                  <a href="https://textile-academy.org">Fabricademy</a>
+                  <br />A new textile and technology academy
+                  <br />&copy; 2017-2019 All rights reserved
                 </div>
               </div>
             </div>
@@ -24,35 +22,26 @@
           <div class="col-md-3 col-sm-12 text-subtitle2 text-left">
             <ul>
               <li>
-                <a
-                  href="https://textile-academy.org"
-                  class="text-grey-7"
-                >Fabricademy</a>
+                <a href="https://textile-academy.org" class="text-grey-7">About Fabricademy</a>
               </li>
               <li>
-                <a
-                  href="https://textile-academy.org"
-                  class="text-grey-7"
-                >Fabricademy</a>
+                <router-link to="/catalogue" class="text-grey-7">Browse Catalogue</router-link>
               </li>
               <li>
-                <a
-                  href="https://textile-academy.org"
-                  class="text-grey-7"
-                >Fabricademy</a>
-              </li>
-              <li>
-                <a
-                  href="https://textile-academy.org"
-                  class="text-grey-7"
-                >Fabricademy</a>
+                <router-link to="/collections" class="text-grey-7">Collections</router-link>
               </li>
             </ul>
           </div>
           <div class="col-md-3 col-sm-12 text-subtitle2">
-            Something about Circular Fashion.
-            <br>Id non eiusmod nostrud cupidatat
-            <br>commodo consequat duis eiusmod cupidatat
+            <li>
+              <router-link to="/terms_conditions" class="text-grey-7">Terms and conditions</router-link>
+            </li>
+            <li>
+              <router-link to="/privacy" class="text-grey-7">Privacy</router-link>
+            </li>
+            <li>
+              <router-link to="/contacts" class="text-grey-7">Contacts</router-link>
+            </li>
           </div>
         </div>
       </q-toolbar-title>
@@ -63,7 +52,7 @@
 <script>
 export default {
   // name: 'ComponentName',
-  data () {
+  data() {
     return {};
   }
 };