changed favicon, adjusted sidebar

src/app/globals.css

@@ -43,6 +43,10 @@
   --radius-xl: calc(var(--radius) + 4px);
 }
 
+@theme {
+  --breakpoint-xs: 30rem;
+}
+
 body {
   font-family: "Work Sans", Arial, Helvetica, sans-serif;
   width: 100vw;

src/app/layout.tsx

@@ -1,5 +1,5 @@
 // Head metadata
-// import type { Metadata } from "next";
+import type { Metadata } from "next";
 import Head from 'next/head';
 
 // Provides the theme context to the app
@@ -20,10 +20,10 @@ const workSans = Work_Sans({
 
 // Commented out for now, because it doesn't work having client components in the layout file
 
-// export const metadata: Metadata = {
-//   title: "Tipilan",
-//   description: "TipiLAN on pungil põnevatest turniiridest, mini-võistlustest, loengutest ja paljust muust.",
-// };
+export const metadata: Metadata = {
+  title: "TipiLAN",
+  description: "TipiLAN 2025 – Eesti suurim tudengite korraldatud LAN!",
+};
 
 export default function RootLayout({
   children,

src/app/page.tsx

@@ -6,7 +6,7 @@ export default function Home() {
     return (
         <div>
             {/* Title */}
-            <div className="border-b-3 border-[#007CAB] dark:border-[#00A3E0] flex items-center justify-between mt-18 gap-12 py-8">
+            <div className="border-b-3 border-[#1F5673] flex items-center justify-between mt-18 gap-12 py-8">
                 <Image
                     src="/tipilan-white.svg"
                     width={850}
@@ -33,10 +33,10 @@ export default function Home() {
                 </div>
             </div>
             {/* Grid of buttons */}
-            <div className="grid grid-cols-1 xl:grid-cols-3 border-[#007CAB] dark:border-[#00A3E0]">
+            <div className="grid grid-cols-1 xl:grid-cols-3 border-[#1F5673]">
                 <Link
                     href="/ajakava"
-                    className="px-8 md:px-12 py-8 flex flex-col gap-4 border-b-3 lg:border-r-3 group border-[#007CAB] dark:border-[#00A3E0] hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] transition"
+                    className="px-8 md:px-12 py-8 flex flex-col gap-4 border-b-3 lg:border-r-3 group border-[#1F5673] hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] transition"
                 >
                     <div className="cursor-pointer flex flex-row justify-between gap-4 items-center">
                         <h2
@@ -56,7 +56,7 @@ export default function Home() {
                 </Link>
                 <Link
                     href="/turniirid"
-                    className="px-8 md:px-12 py-8 flex flex-col gap-4 border-b-3 lg:border-r-3 group border-[#007CAB] dark:border-[#00A3E0] hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] transition"
+                    className="px-8 md:px-12 py-8 flex flex-col gap-4 border-b-3 lg:border-r-3 group border-[#1F5673] hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] transition"
                 >
                     <div className="cursor-pointer flex flex-row justify-between gap-4 items-center">
                         <h2
@@ -77,7 +77,7 @@ export default function Home() {
                 </Link>
                 <Link
                     href="/messiala"
-                    className="px-8 md:px-12 py-8 flex flex-col gap-4 border-b-3 border-[#007CAB] dark:border-[#00A3E0] group hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] transition-all"
+                    className="px-8 md:px-12 py-8 flex flex-col gap-4 border-b-3 border-[#1F5673] group hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] transition-all"
                 >
                     <div className="cursor-pointer flex flex-row justify-between gap-4 items-center">
                         <h2
@@ -99,7 +99,7 @@ export default function Home() {
             {/* Date */}
             <Link
                 href="/piletid"
-                className={`p-8 md:p-12 flex flex-col ${vipnagorgialla.className} font-bold italic border-b-3 border-[#007CAB] dark:border-[#00A3E0] hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] group transition`}
+                className={`p-8 md:p-12 flex flex-col ${vipnagorgialla.className} font-bold italic border-b-3 border-[#1F5673] hover:bg-[#007CAB] dark:hover:bg-[#00A3E0] group transition`}
             >
                 <div className="cursor-pointer text-left flex flex-row justify-between xl:justify-start gap-8">
                     <h3 className="text-4xl md:text-5xl dark:text-[#EEE5E5] dark:group-hover:text-[#2A2C3F] text-[#2A2C3F] group-hover:text-black">
@@ -113,7 +113,7 @@ export default function Home() {
             </Link>
             {/* Sponsors */}
             <div
-                className={`p-12 flex flex-col ${vipnagorgialla.className} font-bold italic border-b-3 border-[#007CAB] dark:border-[#00A3E0]`}
+                className={`p-12 flex flex-col ${vipnagorgialla.className} font-bold italic border-b-3 border-[#1F5673]`}
             >
                 <div className="text-left flex flex-col justify-between xl:justify-start">
                     <h3 className="text-4xl md:text-5xl dark:text-[#EEE5E5] text-[#2A2C3F] group-hover:text-black pb-8">

src/app/piletid/page.tsx

@@ -23,7 +23,7 @@ export default function Tickets() {
                     <h2 className={`text-6xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-2`}>12-15€</h2>
                     <h3 className={`text-3xl ${vipnagorgialla.className} font-bold italic text-[#EEE5E5] pb-4`}>Võistleja</h3>
                     <ul className="pl-4 mb-8 list-[square] marker:text-[#007CAB]">
-                        <li className="text-xl">Võimalus osaleda turniiridel</li>
+                        <li className="text-xl">Võimalus osaleda CS2 või LoL turniiril</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>

src/components/Header.tsx

@@ -22,7 +22,7 @@ const Header = ({ isOpen, toggleSidebar }: { isOpen: boolean; toggleSidebar: ()
     const { setTheme } = useTheme();
 
     return (
-        <header className="px-8 py-2 md:px-12 flex items-center bg-[#EEE5E5] dark:bg-[#0E0F19] border-b-3 border-[#007CAB] dark:border-[#00A3E0] justify-between text-[#2A2C3F] dark:text-[#EEE5E5]">
+        <header className="px-8 py-2 md:px-12 flex items-center bg-[#EEE5E5] dark:bg-[#0E0F19] border-b-3 border-[#1F5673] justify-between text-[#2A2C3F] dark:text-[#EEE5E5]">
             <button onClick={toggleSidebar}>
                 {isOpen ? (
                     <MdClose className="h-12 w-12 text-[#2A2C3F] dark:text-[#EEE5E5]" />

src/components/Sidebar.tsx

@@ -26,14 +26,14 @@ const Sidebar = ({ isOpen, toggleSidebar }: { isOpen: boolean; toggleSidebar: ()
                 onClick={toggleSidebar} // Close sidebar when clicking outside
             ></div>
             <div
-                className={`text-5xl ${vipnagorgialla.className} font-bold italic uppercase fixed flex items-center flex-col gap-8 pt-16 top-0 left-0 h-[99vh] mt-16 -skew-x-5 border-r-3 border-[#007CAB] dark:border-[#00A3E0] w-screen sm:w-128 bg-[#EEE5E5] dark:bg-[#0E0F19] text-[#2A2C3F] dark:text-[#EEE5E5] transition-transform transform z-20`}
-                style={{ transform: isOpen ? 'translateX(-10%) skewX(calc(5deg * -1)' : 'translateX(-150%) skewX(calc(5deg * -1)' }}
+                className={`text-3xl md:text-5xl ${vipnagorgialla.className} font-bold italic uppercase fixed flex items-start xs:pl-25 pl-20 sm:pl-20 md:pl-24 flex-col gap-8 pt-16 top-0 left-0 h-[99vh] mt-16 -skew-x-5 border-r-3 border-[#1F5673]  w-screen sm:w-96 md:w-128 bg-[#EEE5E5] dark:bg-[#0E0F19] text-[#2A2C3F] dark:text-[#EEE5E5] transition-transform transform z-20`}
+                style={{ transform: isOpen ? 'translateX(-13%) skewX(calc(5deg * -1)' : 'translateX(-150%) skewX(calc(5deg * -1)' }}
             >
-                <Link href="/" prefetch={true} onClick={toggleSidebar}>Avaleht</Link>
-                <Link href="/expo" prefetch={true} onClick={toggleSidebar}>Messiala</Link>
-                <Link href="/tickets" prefetch={true} onClick={toggleSidebar}>Piletid</Link>
-                <Link href="/timetable" prefetch={true} onClick={toggleSidebar}>Ajakava</Link>
-                <Link href="/tourney" prefetch={true} onClick={toggleSidebar}>Turniirid</Link>
+                <Link href="/" className="hover:text-[#00A3E0] transition duration-150">Avaleht</Link>
+                <Link href="/messiala" className="hover:text-[#00A3E0] transition duration-150">Messiala</Link>
+                <Link href="/piletid" className="hover:text-[#00A3E0] transition duration-150">Piletid</Link>
+                <Link href="/ajakava" className="hover:text-[#00A3E0] transition duration-150">Ajakava</Link>
+                <Link href="/turniirid" className="hover:text-[#00A3E0] transition duration-150">Turniirid</Link>
             </div>
         </>
     );