Initial commit

pages/elements/banner.js

@@ -0,0 +1,7 @@
+export default function Banner() {
+  return (
+    <div>
+      <img src="/logo.png"></img>
+    </div>
+  );
+}

pages/elements/links.js

@@ -0,0 +1,10 @@
+export default function Links() {
+  return (
+    <div className="flex items-center">
+      <p className="text-2xl pl-4 underline underline-offset-1 cursor-pointer">
+        Lorem
+      </p>
+      <p className="text-2xl pl-4 cursor-pointer">Dolor</p>
+    </div>
+  );
+}

pages/elements/main.js

@@ -0,0 +1,32 @@
+import Image from "next/image";
+
+export default function Main() {
+  return (
+    <div className="flex px-48 py-12 ">
+      <div className="relative ">
+        <div className="absolute rounded-l-3xl h-full w-1/2 bg-slate-800 opacity-50 "></div>
+        <div className="absolute rounded-l-3xl h-full w-1/2 text-white p-12">
+          <h1 className="text-6xl py-4">Lorem Ipsum</h1>
+          <p className="text-2xl py-4">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
+            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
+            ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
+            aliquip ex ea commodo consequat. Duis aute irure dolor in
+            reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
+            pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
+            culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </div>
+        <div
+          className="absolute rounded-xl bg-slate-300 right-20 bottom-20 px-3 py-2 cursor-pointer"
+          onClick={(e) => {
+            console.log(e.target.innerHTML);
+          }}
+        >
+          Więcej
+        </div>
+        <img src="/main.png" alt="Prąd" className="rounded-3xl"></img>
+      </div>
+    </div>
+  );
+}

pages/elements/second.js

@@ -0,0 +1,22 @@
+export default function Second() {
+	return (
+		<div className="flex py-12">
+			<div className="w-2/5">
+				<img src="/map.png" className="w-fit"></img>
+			</div>
+			<div className="w-3/5 px-8 text-right">
+				<h1 className="text-6xl py-4">Lorem Ipsum</h1>
+				<p className="text-2xl py-2">Lorem ipsum dolor sit amet,</p>
+				<p className="text-2xl py-2">consectetur adipiscing elit,</p>
+				<p className="text-2xl py-2">
+					eiusmod tempor incididunt ut labore et dolore magna aliqua.
+				</p>
+				<p className="text-2xl py-2">
+					quis nostrud exercitation ullamco laboris nisi ut
+				</p>
+				<p className="text-2xl py-2">aliquip ex ea commodo consequat.</p>
+			</div>
+			<div className="grow bg-slate-600 w-48 opacity-40"></div>
+		</div>
+	);
+}

pages/elements/third.js

@@ -0,0 +1,31 @@
+export default function Third() {
+	return (
+		<div className="flex px-48 py-12">
+			<div className="w-1/2 border-t-2 border-l-2 p-4">
+				<div className="flex justify-evenly">
+					<div className="">Lorem</div>
+					<div className="">Dolorem</div>
+				</div>
+				Sunt eiusmod voluptate anim sint minim id aliqua elit ipsum culpa.
+				Consectetur laborum duis duis laboris do aute aliquip adipisicing ut
+				tempor irure non nisi tempor. Cillum deserunt eu ea ipsum nostrud.
+				Nostrud adipisicing et quis mollit et culpa ea irure incididunt eiusmod
+				reprehenderit veniam eiusmod sint. Nisi ex exercitation velit sit ea ex.
+				Ullamco eu ea esse nulla commodo commodo irure. Aliqua nostrud eiusmod
+				et velit esse voluptate voluptate ipsum nisi laborum exercitation.
+			</div>
+			<div className="w-1/2 border-b-2 border-r-2 p-4">
+				<h2>20 Lat Doświadczenia</h2>
+				<p>
+					Głównym profilem działalności firmy jest projektowanie instalacji
+					elektrycznych oraz nadzór. Świadczymy również usługi w zakresie
+					audytów instalacji elektrycznych, umożliwiających wskazanie
+					konkretnych rozwiązań technicznych. Jako projektanci posiadający
+					wieloletnie doświadczenie, potwierdzone odpowiednimi uprawnieniami,
+					możemy Państwu zapewnić wykonywanie projektów na najwyższym poziomie
+					technicznym i w zadowalających terminach realizacji.
+				</p>
+			</div>
+		</div>
+	);
+}