<template>
  <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"
                >
              </div>
              <div class="text-body2">
                <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>
          </div>
          <div class="col-md-3 col-sm-12 text-subtitle2 text-left">
            <ul>
              <li>
                <a
                  href="https://textile-academy.org"
                  class="text-grey-7"
                >About Fabricademy</a>
              </li>
              <li>
                <router-link
                  to="/catalogue"
                  class="text-grey-7"
                >
                  Browse Catalogue
                </router-link>
              </li>
              <li>
                <router-link
                  to="/collections"
                  class="text-grey-7"
                >
                  Collections
                </router-link>
              </li>
            </ul>
          </div>
          <div class="col-md-3 col-sm-12 text-subtitle2">
            <ul>
              <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>
            </ul>
          </div>
        </div>
      </q-toolbar-title>
    </q-toolbar>
  </q-footer>
</template>

<script>
export default {
  // name: 'ComponentName',
  data () {
    return {};
  }
};
</script>

<style>
</style>