lapikud
/
tipilan
mirror of https://github.com/Lapikud/tipilan
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Modify tournament page to fit figma styling

Browse Source
pull/47/head
v4ltages 4 months ago
parent deb07df397
commit edb88be0f0
No known key found for this signature in database
GPG Key ID: DC7BC38E0DC642B
1 changed files with 148 additions and 137 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 59
      src/app/turniirid/page.tsx

59
src/app/turniirid/page.tsx
Unescape 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>
); );

Write Preview
Loading…
Cancel
Save