57 lines
1.3 KiB
Vue
57 lines
1.3 KiB
Vue
|
<template>
|
||
|
<header>
|
||
|
<nuxt-link to="/" class="title">
|
||
|
<svg width="13" height="16" viewBox="0 0 13 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
|
<path
|
||
|
d="M0 7.07348C0 6.81265 0.101912 6.56214 0.284 6.37538L5.784 0.73436C6.17647 0.331827 6.82353 0.331826 7.216 0.734359L12.716 6.37538C12.8981 6.56214 13 6.81265 13 7.07348V15C13 15.5523 12.5523 16 12 16H1C0.447715 16 0 15.5523 0 15V7.07348Z"
|
||
|
fill="#8BCDCD"/>
|
||
|
</svg>
|
||
|
Boussolle <span class="bold">PLUSS</span>
|
||
|
</nuxt-link>
|
||
|
<span class="team">
|
||
|
Équipe : {{ team }}
|
||
|
</span>
|
||
|
</header>
|
||
|
</template>
|
||
|
|
||
|
<script lang="ts">
|
||
|
import {Component, Vue} from "nuxt-property-decorator";
|
||
|
|
||
|
@Component
|
||
|
export default class TeamHeader extends Vue {
|
||
|
|
||
|
get team() {
|
||
|
return this.$auth.user ? this.$auth.user.username : "Non connecté";
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
|
||
|
<style lang="scss" scoped>
|
||
|
@import "assets/css/color";
|
||
|
@import "assets/css/spacing";
|
||
|
@import "assets/css/font";
|
||
|
|
||
|
header {
|
||
|
margin-top: $xx_small;
|
||
|
color: $black;
|
||
|
display: flex;
|
||
|
justify-content: space-between;
|
||
|
}
|
||
|
|
||
|
.title {
|
||
|
text-transform: uppercase;
|
||
|
color: $black;
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
|
||
|
.title svg {
|
||
|
margin-right: $xxx_small;
|
||
|
}
|
||
|
|
||
|
.team {
|
||
|
font-size: $small-font-size;
|
||
|
}
|
||
|
|
||
|
</style>
|