vehicle-monitor/src/layout/layout-header/components/LayoutHeaderHome.vue

33 lines
640 B
Vue
Raw Normal View History

2025-02-28 22:57:26 +08:00
<script lang="ts" setup>
2025-04-16 23:11:49 +08:00
import { useRoute } from 'vue-router';
2025-03-01 21:32:03 +08:00
2025-05-12 15:49:19 +08:00
import LayoutHeaderNav from '@/layout/layout-header/components/LayoutHeaderNav.vue';
2025-03-01 21:32:03 +08:00
const route = useRoute();
2025-02-28 22:57:26 +08:00
</script>
<template>
<header>
2025-03-05 13:57:51 +08:00
<div class="header-title">
<h1>{{ route.meta.title }}</h1>
2025-05-12 15:49:19 +08:00
<LayoutHeaderNav />
2025-02-28 22:57:26 +08:00
</div>
</header>
</template>
<style lang="scss" scoped>
2025-03-05 13:57:51 +08:00
.header-title {
2025-02-28 22:57:26 +08:00
width: 100%;
height: 108px;
2025-05-12 15:49:19 +08:00
background: url('@/layout/layout-header/images/layout-header-1.png') no-repeat center;
2025-02-28 22:57:26 +08:00
background-size: cover;
h1 {
2025-03-05 13:57:51 +08:00
color: #fff;
2025-02-28 22:57:26 +08:00
text-align: center;
2025-03-01 20:52:06 +08:00
line-height: 100px;
2025-02-28 22:57:26 +08:00
font-size: 42px;
}
}
</style>