lapikud/tipilan
3
0
Fork 0
mirror of https://github.com/Lapikud/tipilan.git synced 2026-03-23 21:34:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Modify tournament page to fit figma styling

Browse Source
This commit is contained in:
Randel Mandre
2025-08-19 06:21:24 +03:00
parent deb07df397
commit edb88be0f0
1 changed files with 148 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
src/app/turniirid/page.tsx
View File

@@ -1,7 +1,6 @@
import { vipnagorgialla } from "@/components/Vipnagorgialla"; import { vipnagorgialla } from "@/components/Vipnagorgialla";
import Link from "next/link"; import Link from "next/link";
import Image from "next/image"; import Image from "next/image";
import SectionDivider from "@/components/SectionDivider";
export default function Tourney() { export default function Tourney() {
const headingStyle = `text-3xl md:text-5xl lg:text-5xl ${vipnagorgialla.className} font-bold uppercase text-[#2A2C3F] dark:text-[#EEE5E5] -skew-x-2 md:-skew-x-5`; const headingStyle = `text-3xl md:text-5xl lg:text-5xl ${vipnagorgialla.className} font-bold uppercase text-[#2A2C3F] dark:text-[#EEE5E5] -skew-x-2 md:-skew-x-5`;
@@ -21,24 +20,29 @@ export default function Tourney() {
{/* infot lähiajal.*/} {/* infot lähiajal.*/}
{/*</p>*/} {/*</p>*/}
<div className="flex flex-col gap-8 md:gap-16"> <div className="flex flex-col">
{/* CS2 turniir */} {/* CS2 turniir */}
<div className="hover:bg-[#007CAB] py-8 md:py-16 transition group">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-16 items-center mx-8 md:mx-16 lg:mx-32 xl:mx-48"> <div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-16 items-center mx-8 md:mx-16 lg:mx-32 xl:mx-48">
<div className="-skew-x-2 md:-skew-x-5"> <div className="-skew-x-2 md:-skew-x-5">
<h2 className={`${headingStyle}`}>CS2 turniir</h2> <h2 className={`${headingStyle}`}>CS2 turniir</h2>
<p className={"text-2xl mb-4 text-neutral-500"}> <p
className={
"text-2xl mb-4 text-neutral-500 group-hover:text-black"
}
>
Toimumisaeg veel selgumisel Toimumisaeg veel selgumisel
</p> </p>
<p className="text-balance"> <p className="text-balance">
TipiLANil toimub Eesti ühe suurima auhinnafondiga CS2 turniire TipiLANil toimub Eesti ühe suurima auhinnafondiga CS2 turniire
juba sel sügisel. Haara kaasa sõbrad ja saa osa adrenaliinirohkest juba sel sügisel. Haara kaasa sõbrad ja saa osa
kogemusest! adrenaliinirohkest kogemusest!
</p> </p>
<br /> <br />
<p className="text-balance"> <p className="text-balance">
Auhinnafond on suuruses 5250€, mis jaotatakse TOP3 meeskonna vahel Auhinnafond on suuruses 5250€, mis jaotatakse TOP3 meeskonna
ära. Iga tiimiliige saab vastavalt saavutatud kohale auhinnaks kas vahel ära. Iga tiimiliige saab vastavalt saavutatud kohale
600€, 300€ või 150€. auhinnaks kas 600€, 300€ või 150€.
</p> </p>
<br /> <br />
@@ -52,7 +56,7 @@ export default function Tourney() {
</Link> </Link>
<a href="https://fienta.com/et/tipilan" target="_blank"> <a href="https://fienta.com/et/tipilan" target="_blank">
<button <button
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic text-[#ECE5E5]`} className={`px-4 py-2 bg-[#007CAB] group-hover:bg-black cursor-pointer ${vipnagorgialla.className} font-bold italic text-[#ECE5E5]`}
> >
OSTA PILET OSTA PILET
</button> </button>
@@ -71,10 +75,10 @@ export default function Tourney() {
</div> </div>
</div> </div>
</div> </div>
</div>
<SectionDivider />
{/* LoL turniir */} {/* LoL turniir */}
<div className="hover:bg-[#007CAB] py-8 md:py-16 border-t-[3px] border-[#1F5673] transition group">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-16 items-center mx-8 md:mx-16 lg:mx-32 xl:mx-48"> <div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-16 items-center mx-8 md:mx-16 lg:mx-32 xl:mx-48">
<div className="hidden md:block"> <div className="hidden md:block">
<div> <div>
@@ -89,19 +93,23 @@ export default function Tourney() {
</div> </div>
<div className="flex-auto text-right -skew-x-2 md:-skew-x-5"> <div className="flex-auto text-right -skew-x-2 md:-skew-x-5">
<h2 className={`${headingStyle}`}>LoL turniir</h2> <h2 className={`${headingStyle}`}>LoL turniir</h2>
<p className={"text-2xl mb-4 text-neutral-500"}> <p
className={
"text-2xl mb-4 text-neutral-500 group-hover:text-black"
}
>
Toimumisaeg veel selgumisel Toimumisaeg veel selgumisel
</p> </p>
<p className="text-balance"> <p className="text-balance">
TipiLANil toimub Eesti ühe suurima auhinnafondiga LoL turniire TipiLANil toimub Eesti ühe suurima auhinnafondiga LoL turniire
juba sel sügisel. Haara kaasa sõbrad ja saa osa adrenaliinirohkest juba sel sügisel. Haara kaasa sõbrad ja saa osa
kogemusest! adrenaliinirohkest kogemusest!
</p> </p>
<br /> <br />
<p className="text-balance"> <p className="text-balance">
Auhinnafond on suuruses 3500€, mis jaotatakse TOP3 meeskonna vahel Auhinnafond on suuruses 3500€, mis jaotatakse TOP3 meeskonna
ära. Iga tiimiliige saab vastavalt saavutatud kohale auhinnaks kas vahel ära. Iga tiimiliige saab vastavalt saavutatud kohale
400€, 200€ või 100€. auhinnaks kas 400€, 200€ või 100€.
</p> </p>
<br /> <br />
<div className="flex flex-row flex-wrap gap-4 md:gap-8 justify-end"> <div className="flex flex-row flex-wrap gap-4 md:gap-8 justify-end">
@@ -114,7 +122,7 @@ export default function Tourney() {
</Link> </Link>
<a href="https://fienta.com/et/tipilan" target="_blank"> <a href="https://fienta.com/et/tipilan" target="_blank">
<button <button
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic text-[#ECE5E5]`} className={`px-4 py-2 bg-[#007CAB] group-hover:bg-black cursor-pointer ${vipnagorgialla.className} font-bold italic text-[#ECE5E5]`}
> >
OSTA PILET OSTA PILET
</button> </button>
@@ -122,14 +130,18 @@ export default function Tourney() {
</div> </div>
</div> </div>
</div> </div>
</div>
<SectionDivider />
{/* Mini-turniirid */} {/* Mini-turniirid */}
<div className="hover:bg-[#007CAB] py-8 md:py-16 border-t-[3px] border-[#1F5673] transition group">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-16 items-center mx-8 md:mx-16 lg:mx-32 xl:mx-48"> <div className="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-16 items-center mx-8 md:mx-16 lg:mx-32 xl:mx-48">
<div className="-skew-x-2 md:-skew-x-5"> <div className="-skew-x-2 md:-skew-x-5">
<h2 className={`${headingStyle}`}>Mini&shy;turniirid</h2> <h2 className={`${headingStyle}`}>Mini&shy;turniirid</h2>
<p className={"text-2xl mb-4 text-neutral-500"}> <p
className={
"text-2xl mb-4 text-neutral-500 group-hover:text-black"
}
>
Toimumisaeg veel selgumisel Toimumisaeg veel selgumisel
</p> </p>
<p className="text-balance"> <p className="text-balance">
@@ -154,7 +166,7 @@ export default function Tourney() {
</Link> </Link>
<a href="https://fienta.com/et/tipilan" target="_blank"> <a href="https://fienta.com/et/tipilan" target="_blank">
<button <button
className={`px-4 py-2 bg-[#007CAB] cursor-pointer ${vipnagorgialla.className} font-bold italic text-[#ECE5E5]`} className={`px-4 py-2 bg-[#007CAB] group-hover:bg-black cursor-pointer ${vipnagorgialla.className} font-bold italic text-[#ECE5E5]`}
> >
OSTA PILET OSTA PILET
</button> </button>
@@ -173,8 +185,7 @@ export default function Tourney() {
</div> </div>
</div> </div>
</div> </div>
</div>
<SectionDivider />
</div> </div>
</div> </div>
); );