Files
ghibli-api/components/Header/index.vue

32 lines
745 B
Vue

<template>
<header
id="header"
class="fixed top-0 left-0 w-screen bg-white h-16 px-4 md:px-8 py-3 shadow-md flex items-center justify-between"
>
<router-link to="/" class="flex w-auto h-full items-center">
<img
class="h-full mr-4"
src="https://avatars2.githubusercontent.com/u/1080062?s=200&v=4"
alt="PeopleDoc - Icon"
/>
<h1 class="text-2xl font-light tracking-wide">PeopleDoc</h1>
</router-link>
<h2 class="font-medium hidden sm:block">{{ description }}</h2>
</header>
</template>
<script>
import pkg from "@/package.json";
export default {
name: "Header",
computed: {
description: function() {
return pkg.description;
}
}
};
</script>
<style></style>