10. Logging Users Out

Published a month ago

Site Header - layouts/default.vue
<nav class="bg-white shadow-sm">
  <div class="container mx-auto px-4 sm:px-6 lg:px-8">
    <div class="flex justify-between h-16">
      <div class="flex">
        <div class="hidden sm:ml-6 sm:flex">
          <nuxt-link
            to="/"
            class="ml-8 inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-500 hover:text-gray-700 hover:border-gray-300 focus:outline-none focus:text-gray-700 focus:border-gray-300 transition duration-150 ease-in-out"
          >
            Home
          </nuxt-link>
          <nuxt-link
            to="/registration"
            class="ml-8 inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-500 hover:text-gray-700 hover:border-gray-300 focus:outline-none focus:text-gray-700 focus:border-gray-300 transition duration-150 ease-in-out"
          >
            Register
          </nuxt-link>
          <a
            href="#"
            class="ml-8 inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-500 hover:text-gray-700 hover:border-gray-300 focus:outline-none focus:text-gray-700 focus:border-gray-300 transition duration-150 ease-in-out"
          >
            Logout
          </a>
        </div>
      </div>
    </div>
  </div>
</nav>
Vue Script Tags - layouts/default.vue
<script>
export default {
  methods: {
    
  }
}
</script>

SHARE

Cheat Sheet Preview

Download The Official Chris Courses HTML5 Canvas Cheat Sheet

Essential canvas syntax at your fingertips.

Download Cheat Sheet

Providing the lift to launch your development career

© 2020 Chris Courses. All rights reserved.