<template>
|
<header class="pam-header">
|
<img class="pam-header__logo" src="~/assets/images/logo.png" alt="">
|
<!-- <el-button @click="$router.push('/login')">登入</el-button>
|
<el-button @click="$router.push('/notification')">通知功能</el-button>
|
<el-button @click="$router.push('/accountSetting')">個人帳號設定</el-button>
|
<el-button @click="$router.push('/record/contactRecord')">查看紀錄</el-button>
|
<el-button @click="$router.push('/contactList/consultantList')">查看聯絡清單</el-button> -->
|
<div class="pam-header__title">
|
我的幸福我作主
|
<div class="pam-header__sub-title">
|
預約我的幸福守護者
|
</div>
|
</div>
|
<div class="pam-header__action-bar">
|
<i class="icon-bell"></i>
|
<i class="icon-avatar"></i>
|
</div>
|
</header>
|
</template>
|
|
<script lang="ts">
|
import { Vue, Component } from 'vue-property-decorator';
|
|
@Component
|
export default class NavBar extends Vue {
|
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.pam-header {
|
height: 53px;
|
display: flex;
|
align-items: center;
|
.pam-header__logo {
|
height: 100%;
|
}
|
.pam-header__title {
|
flex: 1;
|
margin: 10px 0;
|
padding-left: 10px;
|
border-left: 1px solid #CCCCCC;
|
font-size: 16px;
|
font-weight: bold;
|
color: #68737A;
|
letter-spacing: 3.6px;
|
.pam-header__sub-title {
|
padding-top: 2px;
|
font-size: 13px;
|
font-weight: bold;
|
color: #F09491;
|
letter-spacing: 1.2px
|
}
|
}
|
.pam-header__action-bar {
|
display: flex;
|
font-size: 24px;
|
color: #1B365D;
|
font-weight: bold;
|
i {
|
padding: 0 15px;
|
}
|
}
|
}
|
</style>
|
