From 82b28bd52c61a8eb70f167c95e0f07c5482aa279 Mon Sep 17 00:00:00 2001
From: JeongBin0227 <45503248+JeongBin0227@users.noreply.github.com>
Date: Mon, 22 Feb 2021 02:00:07 +0900
Subject: [PATCH] [#7] feat : restaurant info

---
 .../Restaurant/RestaurantInfo/index.tsx       | 20 +++++++++++++
 .../Restaurant/RestaurantInfo/style.scss      | 30 +++++++++++++++++++
 2 files changed, 50 insertions(+)
 create mode 100644 src/components/Restaurant/RestaurantInfo/index.tsx
 create mode 100644 src/components/Restaurant/RestaurantInfo/style.scss

diff --git a/src/components/Restaurant/RestaurantInfo/index.tsx b/src/components/Restaurant/RestaurantInfo/index.tsx
new file mode 100644
index 0000000..b932bf0
--- /dev/null
+++ b/src/components/Restaurant/RestaurantInfo/index.tsx
@@ -0,0 +1,20 @@
+import React from 'react'
+import './style.scss'
+
+export const RestaurantInfo: React.FC<{}> = ({}) => {
+  return (
+    <div className="restaurant-title">
+      <div className="main">
+        <a>
+          <h1 className="title">라이스&포테이토</h1>
+        </a>
+        <span className="subject-title">한식</span>
+      </div>
+      <div className="sub">
+        <span>김치철판볶음밥 등 최고의 맛집</span>
+        <span>김치철판볶음밥 등 최고의 맛집1</span>
+        <span>김치철판볶음밥 등 최고의 맛집2</span>
+      </div>
+    </div>
+  )
+}
diff --git a/src/components/Restaurant/RestaurantInfo/style.scss b/src/components/Restaurant/RestaurantInfo/style.scss
new file mode 100644
index 0000000..e91d1cb
--- /dev/null
+++ b/src/components/Restaurant/RestaurantInfo/style.scss
@@ -0,0 +1,30 @@
+@use '@/style/package' as *;
+
+.restaurant-title {
+  border-bottom: 0.1rem solid $color-white;
+  padding: 1.2rem 1rem;
+
+  .main {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .title {
+    font-size: 3rem;
+    font-weight: 500;
+    letter-spacing: 0.025em;
+    color: $color-white;
+  }
+  .subject-title {
+    padding-left: 1rem;
+  }
+  .sub {
+    display: grid;
+    padding-top: 0.8rem;
+    font-size: 1.5rem;
+    font-weight: 300;
+    color: $color-white;
+    letter-spacing: -0.025;
+    margin-right: 0.8rem;
+  }
+}