From 74e9a8e50112217ee9bdbe296078dd7ad3046156 Mon Sep 17 00:00:00 2001
From: jhynsoo <jhynsoo@gmail.com>
Date: Mon, 13 May 2024 14:38:39 +0900
Subject: [PATCH] Feat: Add board header

---
 src/components/article/BoardHeader.vue | 53 ++++++++++++++++++++++++++
 1 file changed, 53 insertions(+)
 create mode 100644 src/components/article/BoardHeader.vue

diff --git a/src/components/article/BoardHeader.vue b/src/components/article/BoardHeader.vue
new file mode 100644
index 0000000..26b6e4e
--- /dev/null
+++ b/src/components/article/BoardHeader.vue
@@ -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>