mirror of
https://github.com/Lapikud/tipilan.git
synced 2026-03-23 13:24:21 +00:00
fix turniirid page html and css, including fixing the page's responsiveness
This commit is contained in:
TFT
@@ -2,15 +2,14 @@ import { vipnagorgialla } from "@/components/Vipnagorgialla";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function Tourney() {
|
||||
const headingStyle = `text-5xl sm:text-6xl ${vipnagorgialla.className} font-bold italic uppercase text-[#2A2C3F] dark:text-[#EEE5E5]`;
|
||||
const headingStyle = `text-3xl md:text-5xl lg:text-5xl ${vipnagorgialla.className} font-bold italic uppercase text-[#2A2C3F] dark:text-[#EEE5E5] -skew-x-2 md:-skew-x-5`;
|
||||
|
||||
const SectionDivider = () => <div className="border-b-[3px] border-[#1F5673] w-full" />;
|
||||
const SectionDivider = () => <hr className="border-t-[3px] border-[#1F5673]" />;
|
||||
|
||||
return (
|
||||
<div className="flex flex-col min-h-[90vh] mt-16">
|
||||
<div className={"md:m-16"}>
|
||||
<h1
|
||||
className={`${headingStyle}`}
|
||||
className={`text-4xl md:text-5xl lg:text-6xl ${vipnagorgialla.className} font-bold italic uppercase text-[#2A2C3F] dark:text-[#EEE5E5] mt-8 md:mt-16 mb-4 m-6 md:m-16`}
|
||||
>
|
||||
Turniirid
|
||||
</h1>
|
||||
@@ -19,28 +18,28 @@ export default function Tourney() {
|
||||
{/* Kui tahate oma oskusi proovile panna, siis vaadake siia tagasi! Rohkem*/}
|
||||
{/* infot lähiajal.*/}
|
||||
{/*</p>*/}
|
||||
|
||||
<div className={"flex flex-row flex-wrap gap-8 md:gap-38"}>
|
||||
<div className={"-skew-x-2 md:-skew-x-5 pl-4 md:pl-28 md:w-180"}>
|
||||
<h2 className={`${headingStyle} mt-12`}>
|
||||
<div className="flex flex-col gap-8 md:gap-16">
|
||||
<div className={"flex flex-row gap-8 md:gap-16"}>
|
||||
<div className={"flex-auto ml-8 md:ml-28 -skew-x-2 md:-skew-x-5"}>
|
||||
<h2 className={`${headingStyle}`}>
|
||||
CS2 turniir
|
||||
</h2>
|
||||
<p className={"text-xs mb-4 text-neutral-500"}>
|
||||
<p className={"text-2xl mb-4 text-neutral-500"}>
|
||||
Toimumisaeg veel selgumisel
|
||||
</p>
|
||||
<p>
|
||||
<p className="text-balance">
|
||||
TipiLANil toimub Eesti ühe suurima auhinnafondiga CS2 turniire juba sel sügisel. Haara kaasa
|
||||
sõbrad ja
|
||||
saa osa adrenaliinirohkest kogemusest!
|
||||
</p>
|
||||
<br />
|
||||
<p>
|
||||
<p className="text-balance">
|
||||
Auhinnafond on suuruses 5250€, mis jaotatakse TOP3 meeskonna vahel ära. Iga tiimiliige saab
|
||||
vastavalt
|
||||
saavutatud kohale auhinnaks kas 600€, 300€ või 150€.
|
||||
</p>
|
||||
<br />
|
||||
<div className={"flex flex-row flex-wrap gap-8"}>
|
||||
<div className={"flex flex-row flex-wrap gap-4 md:gap-8"}>
|
||||
<Link href="/kodukord" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
@@ -48,98 +47,114 @@ export default function Tourney() {
|
||||
LOE REEGLEID
|
||||
</button>
|
||||
</Link>
|
||||
<Link href="https://fienta.com/et/tipilan" target="_blank">
|
||||
<a href="https://fienta.com/et/tipilan" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
OSTA PILET
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className={"mr-4 md:mr-40 md:w-180"}>
|
||||
<div className={"-skew-x-2 md:-skew-x-5"}>
|
||||
{/* Image needs to be the div that has the skew. Outside div needs to remain so that overflow wont occur*/}
|
||||
</div>
|
||||
</div>
|
||||
{/* Image placeholder */}
|
||||
</div>
|
||||
|
||||
<SectionDivider />
|
||||
|
||||
<div className={"flex flex-row gap-8 md:gap-16"}>
|
||||
<div className={"ml-4 md:ml-40 md:w-180"}>
|
||||
<div className={"-skew-x-2 md:-skew-x-5"}>
|
||||
{/* Image needs to be the div that has the skew. Outside div needs to remain so that overflow wont occur*/}
|
||||
</div>
|
||||
</div>
|
||||
<div className={"flex-auto mr-8 md:mr-42 text-right -skew-x-2 md:-skew-x-5"}>
|
||||
<h2 className={`${headingStyle}`}>
|
||||
LoL turniir
|
||||
</h2>
|
||||
<p className={"text-2xl mb-4 text-neutral-500"}>
|
||||
Toimumisaeg veel selgumisel
|
||||
</p>
|
||||
<p className="text-balance">
|
||||
TipiLANil toimub Eesti ühe suurima auhinnafondiga LoL turniire juba sel sügisel.
|
||||
Haara kaasa sõbrad ja saa osa adrenaliinirohkest kogemusest!
|
||||
</p>
|
||||
<br />
|
||||
<p className="text-balance">
|
||||
Auhinnafond on suuruses 3500€, mis jaotatakse TOP3 meeskonna vahel ära. Iga tiimiliige saab
|
||||
vastavalt saavutatud kohale auhinnaks kas 400€, 200€ või 100€.
|
||||
</p>
|
||||
<br />
|
||||
<div className="flex flex-row flex-wrap gap-4 md:gap-8 justify-end">
|
||||
<Link href="/kodukord" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
LOE REEGLEID
|
||||
</button>
|
||||
</Link>
|
||||
<a href="https://fienta.com/et/tipilan" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
OSTA PILET
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<SectionDivider />
|
||||
<SectionDivider />
|
||||
|
||||
<div className={"flex flex-row gap-8 md:gap-38 mt-8 mb-12"}>
|
||||
<div className={"pl-4 md:pl-40 md:w-180"}></div>
|
||||
{/* Image placeholder */}
|
||||
<div className={"-skew-x-2 md:-skew-x-5 flex-auto md:w-180 pr-4 md:pr-42 text-right"}>
|
||||
<h2 className={`${headingStyle}`}>
|
||||
LoL turniir
|
||||
</h2>
|
||||
<p className={"text-xs mb-4 text-neutral-500"}>
|
||||
Toimumisaeg veel selgumisel
|
||||
</p>
|
||||
<p>
|
||||
TipiLANil toimub Eesti ühe suurima auhinnafondiga LoL turniire juba sel sügisel.
|
||||
Haara kaasa sõbrad ja saa osa adrenaliinirohkest kogemusest!
|
||||
</p>
|
||||
<br />
|
||||
<p>
|
||||
Auhinnafond on suuruses 3500€, mis jaotatakse TOP3 meeskonna vahel ära. Iga tiimiliige saab
|
||||
vastavalt saavutatud kohale auhinnaks kas 400€, 200€ või 100€.
|
||||
</p>
|
||||
<br />
|
||||
<div className="flex flex-row flex-wrap gap-8 justify-end">
|
||||
<Link href="/kodukord" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
LOE REEGLEID
|
||||
</button>
|
||||
</Link>
|
||||
<Link href="https://fienta.com/et/tipilan" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
OSTA PILET
|
||||
</button>
|
||||
</Link>
|
||||
<div className={"flex flex-row gap-8 md:gap-16"}>
|
||||
<div className={"ml-8 md:ml-40 -skew-x-2 md:-skew-x-5"}>
|
||||
<h2 className={`${headingStyle}`}>
|
||||
Mini­turniirid
|
||||
</h2>
|
||||
<p className={"text-2xl mb-4 text-neutral-500"}>
|
||||
Toimumisaeg veel selgumisel
|
||||
</p>
|
||||
<p className="text-balance">
|
||||
TipiLANil toimub mitmeid erinevaid lõbusaid ja võistlushimu tekitavaid miniturniire.
|
||||
Miniturniirid toimuvad järgnevates mängudes: Tetris, SimRacing, Tekken. FIFA, Minecraft Bedwards,
|
||||
Buckshot Roulette, LostGamer.
|
||||
</p>
|
||||
<br />
|
||||
<p className="text-balance">
|
||||
Auhinnafond on kõigi turniiride peale 1250€ ja reeglina saab rahalise auhinna miniturniiri võitja.
|
||||
</p>
|
||||
<br />
|
||||
<div className={"flex flex-row flex-wrap gap-4 md:gap-8"}>
|
||||
<Link href="/kodukord" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
LOE REEGLEID
|
||||
</button>
|
||||
</Link>
|
||||
<a href="https://fienta.com/et/tipilan" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
OSTA PILET
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className={"mr-4 md:mr-40 md:w-180"}>
|
||||
<div className={"-skew-x-2 md:-skew-x-5"}>
|
||||
{/* Image needs to be the div that has the skew. Outside div needs to remain so that overflow wont occur*/}
|
||||
</div>
|
||||
</div>
|
||||
{/* Image placeholder */}
|
||||
</div>
|
||||
|
||||
<SectionDivider />
|
||||
</div>
|
||||
|
||||
<SectionDivider />
|
||||
|
||||
<div className={"-skew-x-2 md:-skew-x-5 pl-4 md:pl-40 md:w-180 mt-8 mb-12"}>
|
||||
<h2 className={`${headingStyle}`}>
|
||||
Miniturniirid
|
||||
</h2>
|
||||
<p className={"text-xs mb-4 text-neutral-500"}>
|
||||
Toimumisaeg veel selgumisel
|
||||
</p>
|
||||
<p>
|
||||
TipiLANil toimub mitmeid erinevaid lõbusaid ja võistlushimu tekitavaid miniturniire.
|
||||
Miniturniirid toimuvad järgnevates mängudes: Tetris, SimRacing, Tekken. FIFA, Minecraft Bedwards,
|
||||
Buckshot Roulette, LostGamer.
|
||||
</p>
|
||||
<br />
|
||||
<p>
|
||||
Auhinnafond on kõigi turniiride peale 1250€ ja reeglina saab rahalise auhinna miniturniiri võitja.
|
||||
</p>
|
||||
<br />
|
||||
<div className={"flex flex-row flex-wrap gap-8"}>
|
||||
<Link href="/kodukord" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#1F5673] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
LOE REEGLEID
|
||||
</button>
|
||||
</Link>
|
||||
<Link href="https://fienta.com/et/tipilan" target="_blank">
|
||||
<button
|
||||
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic`}
|
||||
>
|
||||
OSTA PILET
|
||||
</button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<SectionDivider />
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user