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>
+  );
+}