From f774699bfb7c45378b2d0b77b6b03c9c100fcf73 Mon Sep 17 00:00:00 2001
From: 1ilit <lilitmousheghyan@gmail.com>
Date: Tue, 19 Sep 2023 15:51:40 +0300
Subject: [PATCH] Add navbar

---
 src/App.js                   |   2 ++
 src/assets/logo_light_46.png | Bin 0 -> 6236 bytes
 src/pages/landing_page.jsx   |  49 ++++++++++++++++++++++++++++++++---
 src/pages/survey.jsx         |   5 ++++
 4 files changed, 52 insertions(+), 4 deletions(-)
 create mode 100644 src/assets/logo_light_46.png
 create mode 100644 src/pages/survey.jsx

diff --git a/src/App.js b/src/App.js
index add60c0..1a7052f 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,6 +1,7 @@
 import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
 import Editor from "./pages/editor";
 import LandingPage from "./pages/landing_page";
+import Survey from "./pages/survey";
 
 function App() {
   return (
@@ -9,6 +10,7 @@ function App() {
         <Routes>
           <Route path="/" element={<LandingPage />} />
           <Route path="/editor" element={<Editor name="Untitled" />} />
+          <Route path="/survey" element={<Survey />} />
         </Routes>
       </Router>
     </>
diff --git a/src/assets/logo_light_46.png b/src/assets/logo_light_46.png
new file mode 100644
index 0000000000000000000000000000000000000000..966ffac6644f7371fb6fac1c28aa3ac4f6b4e84b
GIT binary patch
literal 6236
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
GLSTY;LngZb

literal 0
HcmV?d00001

diff --git a/src/pages/landing_page.jsx b/src/pages/landing_page.jsx
index 7f44b8d..7e8fd4a 100644
--- a/src/pages/landing_page.jsx
+++ b/src/pages/landing_page.jsx
@@ -1,12 +1,53 @@
-import React from "react";
+import React, { useState } from "react";
 import { Link } from "react-router-dom";
+import { IconCrossStroked } from "@douyinfe/semi-icons";
+import logo from "../assets/logo_light_46.png";
 
 export default function LandingPage() {
+  const [showSurvey, setShowSurvey] = useState(true);
+
   return (
     <div>
-      <Link to="/editor">editor</Link>
-      <br />
-      LandingPage  
+      {showSurvey && (
+        <div className="text-white font-semibold py-1.5 px-4 text-sm text-center bg-gradient-to-r from-slate-700 from-10% via-slate-500 via-30% to-90% to-slate-700">
+          <Link to="/survey" className="hover:underline">
+            Help us improve! Share your feedback.
+          </Link>
+          <div className="float-right">
+            <button onClick={() => setShowSurvey(false)}>
+              <IconCrossStroked size="small" />
+            </button>
+          </div>
+        </div>
+      )}
+      <div>
+        <div className="md:py-5 px-6 flex justify-between">
+          <div className="md:flex md:items-center md:justify-start">
+            <Link to="/">
+              <img src={logo} alt="logo" className="me-2" />
+            </Link>
+            <Link className="ms-4 text-lg font-semibold hover:text-indigo-700">
+              Features
+            </Link>
+            <Link
+              to="/editor"
+              className="ms-4 text-lg font-semibold hover:text-indigo-700"
+            >
+              Editor
+            </Link>
+            <Link className="ms-4 text-lg font-semibold hover:text-indigo-700">
+              Templates
+            </Link>
+            <Link className="ms-4 text-lg font-semibold hover:text-indigo-700">
+              Download
+            </Link>
+          </div>
+          <button className="px-6 py-2 bg-[#386b8f] text-white font-semibold rounded">
+            Log in
+          </button>
+        </div>
+        <hr />
+      </div>
     </div>
   );
 }
diff --git a/src/pages/survey.jsx b/src/pages/survey.jsx
new file mode 100644
index 0000000..031e8a8
--- /dev/null
+++ b/src/pages/survey.jsx
@@ -0,0 +1,5 @@
+import React from "react";
+
+export default function Survey() {
+  return <div>Survey</div>;
+}