From ed248a88e5653c160ac11b539a05fc69c4df8298 Mon Sep 17 00:00:00 2001
From: v4ltages <contact@voltages.me>
Date: Tue, 29 Apr 2025 11:49:15 +0300
Subject: [PATCH] Added tickets and timetable pages

---
 src/app/layout.tsx         |  2 ++
 src/app/page.tsx           | 46 +++++++++++++--------------------
 src/app/tickets/page.tsx   | 53 ++++++++++++++++++++++++++++++++++++++
 src/app/timetable/page.tsx | 10 +++++++
 src/components/Footer.tsx  | 21 +++++++++++++++
 5 files changed, 104 insertions(+), 28 deletions(-)
 create mode 100644 src/app/tickets/page.tsx
 create mode 100644 src/app/timetable/page.tsx
 create mode 100644 src/components/Footer.tsx

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index e347979..c885956 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -34,6 +34,7 @@ export const vipnagorgialla = localFont({
 
 import "./globals.css";
 import Header from "@/components/Header";
+import Footer from "@/components/Footer";
 
 const workSans = Work_Sans({
   subsets: ["latin"],
@@ -56,6 +57,7 @@ export default function RootLayout({
       >
         <Header />
         {children}
+        <Footer />
       </body>
     </html>
   );
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 721f43b..322a35e 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,6 +1,6 @@
 import { vipnagorgialla } from "./layout";
-import { SiDiscord, SiInstagram, SiFacebook } from "react-icons/si";
 import { MdEast, MdEmojiEvents, MdEventNote, MdWeekend } from "react-icons/md";
+import Link from 'next/link';
 
 export default function Home() {
   return (
@@ -16,12 +16,14 @@ export default function Home() {
       {/* Grid of buttons */}
       <div className="grid grid-cols-1 xl:grid-cols-3 border-[#007CAB] min-h-[33vh]">
         <div className="p-12 flex flex-col justify-between border-b-3 lg:border-r-3 group border-[#007CAB] hover:bg-[#007CAB] transition-all">
-          <div className="cursor-pointer flex flex-row justify-between">
-            <h2 className={`text-5xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] group-hover:text-black`}>
-              Ajakava
-            </h2>
-            <MdEast size={'4em'} className="text-[#007CAB] group-hover:translate-x-2 -translate-y-2 group-hover:text-[#EEE5E5] transition-all"/>
-          </div>
+          <Link href="/timetable" prefetch={true}>
+            <div className="cursor-pointer flex flex-row justify-between">
+              <h2 className={`text-5xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] group-hover:text-black`}>
+                Ajakava
+              </h2>
+              <MdEast size={'4em'} className="text-[#007CAB] group-hover:translate-x-2 -translate-y-2 group-hover:text-[#EEE5E5] transition-all"/>
+            </div>
+          </Link>
           <div>
             <MdEventNote size={'4em'} className="text-[#007CAB] group-hover:text-[#EEE5E5] mb-4"/>
             <p className="text-xl group-hover:text-black">
@@ -62,32 +64,20 @@ export default function Home() {
       </div>
       {/* Date */}
       <div className={`p-12 flex flex-col ${vipnagorgialla.className} font-bold italic border-b-3 border-[#007CAB] hover:bg-[#007CAB] group transition-all`}>
-        <div className="cursor-pointer text-left flex flex-row justify-between xl:justify-start">
-          <h3 className="text-5xl text-[#2A2C3F] group-hover:text-black pb-8">
-            Broneeri oma koht juba täna.
-          </h3>
-          <MdEast size={'4em'} className="text-[#007CAB] ml-8 group-hover:translate-x-2 -translate-y-2 group-hover:text-[#EEE5E5] transition-all"/>
-        </div>
+        <Link href="/tickets" prefetch={true}>
+          <div className="cursor-pointer text-left flex flex-row justify-between xl:justify-start">
+            <h3 className="text-5xl text-[#2A2C3F] group-hover:text-black pb-8">
+              Broneeri oma koht juba täna!
+            </h3>
+            <MdEast size={'4em'} className="text-[#007CAB] ml-8 group-hover:translate-x-2 -translate-y-2 group-hover:text-[#EEE5E5] transition-all"/>
+          </div>
+        </Link>
         <h2 className="text-6xl text-[#007CAB] group-hover:text-[#EEE5E5]">
           24.-26. okt.
         </h2>
       </div>
       {/* Footer */}
-      <div className="flex items-center justify-between h-60 px-12">
-        <img src="/tipilan-white.svg" alt="TipiLAN Logo" className="h-16"/>
-        {/* Social media */}
-        <div className="flex flex-row">
-          <a href="#" target="_blank" rel="noopener noreferrer">
-            <SiDiscord title="Discord" size={'2em'} className="mx-4 text-[#2A2C3F]"/>
-          </a>
-          <a href="#" target="_blank" rel="noopener noreferrer">
-            <SiInstagram title="Instagram" size={'2em'} className="mx-4 text-[#2A2C3F]"/>
-          </a>
-          <a href="#" target="_blank" rel="noopener noreferrer">
-            <SiFacebook title="Facebook" size={'2em'} className="mx-4 text-[#2A2C3F]"/>
-          </a>
-        </div>
-      </div>
+
     </div>
   );
 }
\ No newline at end of file
diff --git a/src/app/tickets/page.tsx b/src/app/tickets/page.tsx
new file mode 100644
index 0000000..9d0f5b1
--- /dev/null
+++ b/src/app/tickets/page.tsx
@@ -0,0 +1,53 @@
+import { vipnagorgialla } from "../layout";
+import Link from 'next/link';
+
+export default function Tickets() {
+    return (
+        <div className="flex flex-col min-h-[90vh] bg-[#EEE5E5] p-12">
+            <h1 className={`text-6xl ${vipnagorgialla.className} font-bold text-[#2A2C3F] mt-8 pb-8`}>Piletid ja registreerimine</h1>
+            <div className="flex justify-center items-center flex-row gap-16 flex-grow">
+                <div className="bg-[#007CAB] -skew-x-5 text-white px-12 py-16 w-72 hover:scale-105 transition-all">   
+                    <h2 className={`text-5xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-4`}>8€</h2>
+                    <h3 className={`text-3xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-2`}>Osaleja</h3>
+                    <ul className="pl-4 pb-4 list-[square] marker:text-[#1F5673]">
+                    <li className="text-xl">Isiklik laud, voolu- ja internetiühendus</li>
+                        <li className="text-xl">Ligipääs demoalale</li>
+                        <li className="text-xl">Turniiride pealt vaatamine</li>
+                        <li className="text-xl">Võimalus osaleda miniturniiridel</li>
+                    </ul>
+                    <Link href="https://fienta.com/et/tipilan">
+                        <button className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}>OSTA PILET</button>
+                    </Link>
+                </div>
+
+                <div className="bg-[#007CAB] -skew-x-5 text-white px-12 py-16 w-72 hover:scale-105 transition-all">
+                    <h2 className={`text-5xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-4`}>10€</h2>
+                    <h3 className={`text-3xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-2`}>Võistleja</h3>
+                    <ul className="pl-4 pb-4 list-[square] marker:text-[#1F5673]">
+                        <li className="text-xl">Võimalus osaleda turniiridel</li>
+                        <li className="text-xl">Isiklik laud, voolu- ja internetiühendus</li>
+                        <li className="text-xl">Ligipääs demoalale</li>
+                        <li className="text-xl">Turniiride pealt vaatamine</li>
+                        <li className="text-xl">Võimalus osaleda miniturniiridel</li>
+                    </ul>
+                    <Link href="https://fienta.com/et/tipilan">
+                        <button className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}>OSTA PILET</button>
+                    </Link>
+                </div>
+
+                <div className="bg-[#007CAB] -skew-x-5 text-white px-12 py-16 w-72 hover:scale-105 transition-all">
+                    <h2 className={`text-5xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-4`}>6€</h2>
+                    <h3 className={`text-3xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-2`}>Külastaja</h3>
+                    <ul className="pl-4 pb-4 list-[square] marker:text-[#1F5673]">
+                        <li className="text-xl">Ligipääs demoalale</li>
+                        <li className="text-xl">Turniiride pealt vaatamine</li>
+                        <li className="text-xl">Võimalus osaleda miniturniiridel</li>
+                    </ul>
+                    <Link href="https://fienta.com/et/tipilan">
+                        <button className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}>OSTA PILET</button>
+                    </Link>
+                </div>
+            </div>
+        </div>
+    );
+}
\ No newline at end of file
diff --git a/src/app/timetable/page.tsx b/src/app/timetable/page.tsx
new file mode 100644
index 0000000..fc39307
--- /dev/null
+++ b/src/app/timetable/page.tsx
@@ -0,0 +1,10 @@
+import { vipnagorgialla } from "../layout";
+
+export default function Timetable() {
+    return (
+        <div className="flex flex-col min-h-[90vh] bg-[#EEE5E5] p-12">
+            <h1 className={`text-6xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] mt-8 mb-4`}>Ajakava</h1>
+            <p className="text-xl  text-[#2A2C3F]">Ajakava on tegemisel.</p>
+        </div>
+    );
+}
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
new file mode 100644
index 0000000..8955671
--- /dev/null
+++ b/src/components/Footer.tsx
@@ -0,0 +1,21 @@
+import { SiDiscord, SiInstagram, SiFacebook } from "react-icons/si";
+
+const Footer = () => (
+    <div className="flex items-center justify-between h-60 px-12">
+        <img src="/tipilan-white.svg" alt="TipiLAN Logo" className="h-16"/>
+        {/* Social media */}
+        <div className="flex flex-row">
+            <a href="#" target="_blank" rel="noopener noreferrer">
+                <SiDiscord title="Discord" size={'2em'} className="mx-4 text-[#2A2C3F]"/>
+            </a>
+            <a href="#" target="_blank" rel="noopener noreferrer">
+                <SiInstagram title="Instagram" size={'2em'} className="mx-4 text-[#2A2C3F]"/>
+            </a>
+            <a href="#" target="_blank" rel="noopener noreferrer">
+                <SiFacebook title="Facebook" size={'2em'} className="mx-4 text-[#2A2C3F]"/>
+            </a>
+        </div>
+    </div>
+);
+
+export default Footer;
\ No newline at end of file