popskip/components/Header.vue
2019-12-04 23:20:29 +07:00

41 lines
714 B
Vue

<template>
<div>
<header>
<div class="header-left">
<nuxt-link to="/"><p class="header-link">Damillora</p></nuxt-link>
</div>
<div class="header-middle">
</div>
<div class="header-right">
<nuxt-link to="/projects"><p class="header-link">Projects</p></nuxt-link>
</div>
</header>
<div class="h-16"></div>
</div>
</template>
<script>
export default {
}
</script>
<style>
header {
@apply h-16 fixed top-0 w-full z-10 flex flex-row justify-start items-center px-4;
background-color: rgba(0,0,0,0.4);
}
.header-link {
@apply text-white text-lg;
}
.header-left {
}
.header-middle {
@apply flex-grow;
}
.header-right {
}
</style>