Feat: Add board header
This commit is contained in:
parent
beb6f3283a
commit
74e9a8e501
53
src/components/article/BoardHeader.vue
Normal file
53
src/components/article/BoardHeader.vue
Normal file
@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<header>
|
||||
<RouterLink class="back" :to="{ name: 'board' }">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<polyline points="15 18 9 12 15 6"></polyline>
|
||||
</svg>
|
||||
<span> 게시판 보기 </span>
|
||||
</RouterLink>
|
||||
<slot name="title"></slot>
|
||||
<div v-if="$slots.info" class="info">
|
||||
<slot name="info"></slot>
|
||||
</div>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
header {
|
||||
margin: 12px 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.back {
|
||||
display: inline-flex;
|
||||
color: var(--color-text-secondary);
|
||||
text-decoration: none;
|
||||
transition: scale 0.25s;
|
||||
}
|
||||
|
||||
.back:active {
|
||||
scale: 0.9;
|
||||
}
|
||||
|
||||
.info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
.date {
|
||||
font-weight: normal;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue
Block a user