first commit

2023-02-14 23:10:12 +02:00
parent 164b86db1d
commit f79b95ef2f
44 changed files with 2674 additions and 99 deletions
@@ -0,0 +1,46 @@
+import React from "react";
+
+export default function Form() {
+  return (
+    <div className="mt-10 flex flex-wrap justify-between w-[660px]">
+      <input
+        type="text"
+        className="border rounded p-3 w-80 mb-4"
+        placeholder="First name"
+      />
+      <input
+        type="text"
+        className="border rounded p-3 w-80 mb-4"
+        placeholder="Last name"
+      />
+      <input
+        type="text"
+        className="border rounded p-3 w-80 mb-4"
+        placeholder="Phone number"
+      />
+      <input
+        type="text"
+        className="border rounded p-3 w-80 mb-4"
+        placeholder="Email"
+      />
+      <input
+        type="text"
+        className="border rounded p-3 w-80 mb-4"
+        placeholder="Occasion (optional)"
+      />
+      <input
+        type="text"
+        className="border rounded p-3 w-80 mb-4"
+        placeholder="Requests (optional)"
+      />
+      <button className="bg-red-600 w-full p-3 text-white font-bold rounded disabled:bg-gray-300">
+        Complete reservation
+      </button>
+      <p className="mt-4 text-sm">
+        By clicking “Complete reservation” you agree to the OpenTable Terms of
+        Use and Privacy Policy. Standard text message rates may apply. You may
+        opt out of receiving text messages at any time.
+      </p>
+    </div>
+  );
+}
@@ -0,0 +1,24 @@
+import React from "react";
+
+export default function Header() {
+  return (
+    <div>
+      <h3 className="font-bold">You're almost done!</h3>
+      <div className="mt-5 flex">
+        <img
+          src="https://images.otstatic.com/prod1/49153814/2/medium.jpg"
+          alt=""
+          className="w-32 h-18 rounded"
+        />
+        <div className="ml-4">
+          <h1 className="text-3xl font-bold">Aiāna Restaurant Collective</h1>
+          <div className="flex mt-3">
+            <p className="mr-6">Tues, 22, 2023</p>
+            <p className="mr-6">7:30 PM</p>
+            <p className="mr-6">3 people</p>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
@@ -0,0 +1,10 @@
+export default function Head() {
+  return (
+    <>
+      <title>Reserve</title>
+      <meta content="width=device-width, initial-scale=1" name="viewport" />
+      <meta name="description" content="Generated by create next app" />
+      <link rel="icon" href="/favicon.ico" />
+    </>
+  )
+}
@@ -0,0 +1,13 @@
+import Header from "./components/Header";
+import Form from "./components/Form";
+
+export default function Reserve() {
+  return (
+    <div className="border-t h-screen">
+      <div className="py-9 w-3/5 m-auto">
+        <Header />
+        <Form />
+      </div>
+    </div>
+  );
+}