10. Logging Users Out

Published 4 months 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>

Comments

Want to participate?

Create a free Chris Courses account to begin

or
Sign In

No comments yet, be the first to add one

Cheat Sheet Preview

Download The Official Chris Courses HTML5 Canvas Cheat Sheet

Essential canvas syntax at your fingertips.

Download Now

Providing the lift to launch your development career

© 2020 Chris Courses. All rights reserved.