mirror of https://github.com/Lapikud/tipilan
parent
018c7c53e5
commit
deb07df397
9 changed files with 378 additions and 328 deletions
@ -1,55 +1,56 @@ |
|||||||
// app/kodukord/page.tsx (App Router)
|
// app/kodukord/page.tsx (App Router)
|
||||||
import fs from "node:fs"; |
import ReactMarkdown, { Components } from "react-markdown"; |
||||||
import path from "node:path"; |
import { vipnagorgialla } from "@/components/Vipnagorgialla"; |
||||||
import ReactMarkdown from "react-markdown"; |
|
||||||
import remarkGfm from "remark-gfm"; |
|
||||||
import {vipnagorgialla} from "@/components/Vipnagorgialla"; |
|
||||||
import SectionDivider from "@/components/SectionDivider"; |
import SectionDivider from "@/components/SectionDivider"; |
||||||
|
|
||||||
export const runtime = "nodejs"; // ensure fs is available (not Edge)
|
export default async function Page() { |
||||||
export const dynamic = "force-static"; // read at build time
|
const file = Bun.file("src/data/kodukord.md"); |
||||||
|
const content = await file.text(); |
||||||
|
|
||||||
export default function Page() { |
return ( |
||||||
const filePath = path.join(process.cwd(), "src/data", "kodukord.md"); |
<div> |
||||||
const content = fs.readFileSync(filePath, "utf8"); |
<div className="flex flex-col min-h-[90vh] m-6 mt-16 md:m-16"> |
||||||
|
{/* Page title (separate from markdown headings) */} |
||||||
|
<h1 |
||||||
|
className={`text-4xl md:text-5xl lg:text-6xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] dark:text-[#EEE5E5] mt-8 md:mt-16 mb-4 uppercase`} |
||||||
|
> |
||||||
|
Kodukord |
||||||
|
</h1> |
||||||
|
|
||||||
return ( |
<div className="prose prose-lg dark:prose-invert max-w-none"> |
||||||
<div> |
<ReactMarkdown |
||||||
<div className="flex flex-col min-h-[90vh] m-6 mt-16 md:m-16"> |
components={ |
||||||
{/* Page title (separate from markdown headings) */} |
{ |
||||||
<h1 |
h1: (props) => ( |
||||||
className={`text-4xl md:text-5xl lg:text-6xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] dark:text-[#EEE5E5] mt-8 md:mt-16 mb-4 uppercase`} |
<h1 className="text-3xl md:text-4xl font-bold my-4"> |
||||||
> |
{props.children} |
||||||
Kodukord |
</h1> |
||||||
</h1> |
), |
||||||
|
h2: (props) => ( |
||||||
<div className="prose prose-lg dark:prose-invert max-w-none"> |
<h2 className="text-2xl md:text-3xl font-semibold my-3"> |
||||||
<ReactMarkdown |
{props.children} |
||||||
remarkPlugins={[remarkGfm]} |
</h2> |
||||||
components={{ |
), |
||||||
h1: ({node, ...props}) => ( |
ol: (props) => ( |
||||||
<h1 className="text-3xl md:text-4xl font-bold my-4" {...props} /> |
<ol className="list-decimal ml-6 md:text-xl"> |
||||||
), |
{props.children} |
||||||
h2: ({node, ...props}) => ( |
</ol> |
||||||
<h2 className="text-2xl md:text-3xl font-semibold my-3" {...props} /> |
), |
||||||
), |
ul: (props) => ( |
||||||
ol: ({node, ...props}) => ( |
<ul className="list-disc ml-6 md:text-xl"> |
||||||
<ol className="list-decimal ml-6 md:text-xl" {...props} /> |
{props.children} |
||||||
), |
</ul> |
||||||
ul: ({node, ...props}) => ( |
), |
||||||
<ul className="list-disc ml-6 md:text-xl" {...props} /> |
p: (props) => <p className="md:text-xl">{props.children}</p>, |
||||||
), |
} as Components |
||||||
p: ({node, ...props}) => ( |
} |
||||||
<p className="md:text-xl" {...props} /> |
> |
||||||
), |
{content} |
||||||
}} |
</ReactMarkdown> |
||||||
> |
|
||||||
{content} |
|
||||||
</ReactMarkdown> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
|
|
||||||
<SectionDivider/> |
|
||||||
</div> |
</div> |
||||||
); |
</div> |
||||||
|
|
||||||
|
<SectionDivider /> |
||||||
|
</div> |
||||||
|
); |
||||||
} |
} |
||||||
|
|||||||
@ -1,49 +1,103 @@ |
|||||||
import {vipnagorgialla} from "@/components/Vipnagorgialla"; |
import { notFound } from "next/navigation"; |
||||||
import path from "node:path"; |
import ReactMarkdown, { Components } from "react-markdown"; |
||||||
import fs from "node:fs/promises"; |
import { vipnagorgialla } from "@/components/Vipnagorgialla"; |
||||||
import ReactMarkdown from "react-markdown"; |
|
||||||
import SectionDivider from "@/components/SectionDivider"; |
import SectionDivider from "@/components/SectionDivider"; |
||||||
|
|
||||||
type Props = { |
// Map of valid slugs to their corresponding file paths and titles
|
||||||
params: Promise<{ slug: string }>; |
const rulesMap = { |
||||||
}; |
lol: { |
||||||
|
filePath: "src/data/rules/lol.md", |
||||||
export default async function RulePage({params}: Props) { |
title: "LOL Reeglid", |
||||||
const {slug} = await params; |
}, |
||||||
|
cs2: { |
||||||
const filePath = path.join(process.cwd(), "src/data/rules", `${slug}.md`); |
filePath: "src/data/rules/cs2.md", |
||||||
let file: string; |
title: "CS2 Reeglid", |
||||||
|
}, |
||||||
try { |
} as const; |
||||||
file = await fs.readFile(filePath, "utf8"); |
|
||||||
} catch { |
type RuleSlug = keyof typeof rulesMap; |
||||||
file = `# ${slug.toUpperCase()} REEGLID\n\nSisu hetkel puudub.`; |
|
||||||
} |
interface PageProps { |
||||||
|
params: Promise<{ slug: string }>; |
||||||
const data = {title: undefined as string | undefined}; |
} |
||||||
|
|
||||||
return ( |
async function getRuleContent(slug: string) { |
||||||
<> |
if (!Object.keys(rulesMap).includes(slug)) { |
||||||
<div className="mb-16"> |
return null; |
||||||
<h1 |
} |
||||||
className={`not-prose ${vipnagorgialla.className} font-bold italic uppercase text-[64px] leading-[96px] tracking-[-0.02em] text-[#2A2C3F] dark:text-[#EEE5E5] mx-auto mt-16 mb-6 px-8`} |
|
||||||
> |
const ruleConfig = rulesMap[slug as RuleSlug]; |
||||||
{data.title || `${slug.toUpperCase()} REEGLID`} |
|
||||||
</h1> |
try { |
||||||
|
const file = Bun.file(ruleConfig.filePath); |
||||||
<div |
const content = await file.text(); |
||||||
className={`mx-auto px-8 font-worksans
|
return { |
||||||
[&_ol]:ml-6 |
content, |
||||||
[&_ol_ol]:ml-10 |
title: ruleConfig.title, |
||||||
[&_ol_ol_ol]:ml-14 |
}; |
||||||
[&_h2]:font-bold |
} catch (error) { |
||||||
`}
|
console.error(`Error reading rule file for slug ${slug}:`, error); |
||||||
> |
return null; |
||||||
<ReactMarkdown>{file}</ReactMarkdown> |
} |
||||||
</div> |
} |
||||||
</div> |
|
||||||
|
export default async function RulePage({ params }: PageProps) { |
||||||
<SectionDivider/> |
const { slug } = await params; |
||||||
</> |
const ruleData = await getRuleContent(slug); |
||||||
); |
|
||||||
|
if (!ruleData) { |
||||||
|
notFound(); |
||||||
|
} |
||||||
|
|
||||||
|
const headingStyle = `text-5xl sm:text-6xl ${vipnagorgialla.className} font-bold uppercase italic text-[#2A2C3F] dark:text-[#EEE5E5]`; |
||||||
|
|
||||||
|
return ( |
||||||
|
<div> |
||||||
|
<div className="flex flex-col min-h-[90vh] m-6 mt-16 md:m-16"> |
||||||
|
<h1 className={`${headingStyle} mt-8 md:mt-16 mb-4`}> |
||||||
|
{ruleData.title} |
||||||
|
</h1> |
||||||
|
|
||||||
|
<div className="prose prose-lg dark:prose-invert max-w-none"> |
||||||
|
<ReactMarkdown |
||||||
|
components={ |
||||||
|
{ |
||||||
|
h1: (props) => ( |
||||||
|
<h1 className="text-3xl md:text-4xl font-bold my-4"> |
||||||
|
{props.children} |
||||||
|
</h1> |
||||||
|
), |
||||||
|
h2: (props) => ( |
||||||
|
<h2 className="text-2xl md:text-3xl font-semibold my-3"> |
||||||
|
{props.children} |
||||||
|
</h2> |
||||||
|
), |
||||||
|
ol: (props) => ( |
||||||
|
<ol className="list-none ml-6 md:text-xl"> |
||||||
|
{props.children} |
||||||
|
</ol> |
||||||
|
), |
||||||
|
ul: (props) => ( |
||||||
|
<ul className="list-disc ml-6 md:text-xl"> |
||||||
|
{props.children} |
||||||
|
</ul> |
||||||
|
), |
||||||
|
p: (props) => <p className="md:text-xl">{props.children}</p>, |
||||||
|
} as Components |
||||||
|
} |
||||||
|
> |
||||||
|
{ruleData.content} |
||||||
|
</ReactMarkdown> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<SectionDivider /> |
||||||
|
</div> |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
export async function generateStaticParams() { |
||||||
|
return Object.keys(rulesMap).map((slug) => ({ |
||||||
|
slug, |
||||||
|
})); |
||||||
} |
} |
||||||
|
|||||||
@ -1,64 +1,52 @@ |
|||||||
import {vipnagorgialla} from "@/components/Vipnagorgialla"; |
import { vipnagorgialla } from "@/components/Vipnagorgialla"; |
||||||
import Link from "next/link"; |
import Link from "next/link"; |
||||||
import SectionDivider from "@/components/SectionDivider"; |
import SectionDivider from "@/components/SectionDivider"; |
||||||
|
|
||||||
export default function RulesMenu() { |
export default function RulesMenu() { |
||||||
const headingStyle = `text-5xl sm:text-6xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] dark:text-[#EEE5E5]`; |
const headingStyle = `text-4xl md:text-5xl lg:text-6xl ${vipnagorgialla.className} font-bold italic text-[#2A2C3F] dark:text-[#EEE5E5] uppercase`; |
||||||
|
|
||||||
const boxStyle = `-skew-x-2 md:-skew-x-5 text-white md:px-12 hover:scale-103 transition-all duration-150 w-full md:w-xl lg:w-[400px]`; |
|
||||||
|
|
||||||
const boxTextStyle = `text-3xl ${vipnagorgialla.className} font-bold uppercase text-[#EEE5E5] pb-2`; |
|
||||||
|
|
||||||
// const SectionDivider = () => <div className="border-b-[3px] border-[#1F5673] w-full"/>;
|
const boxStyle = `-skew-x-2 md:-skew-x-5 text-white md:px-12 hover:scale-103 transition-all duration-150 w-full md:w-xl lg:w-[400px]`; |
||||||
|
|
||||||
return ( |
const boxTextStyle = `text-3xl ${vipnagorgialla.className} font-bold uppercase text-[#EEE5E5] pb-2`; |
||||||
<div> |
|
||||||
<div className="flex flex-col md:m-16"> |
|
||||||
<h1 className={`${headingStyle} mt-8 md:mt-16`}> |
|
||||||
REEGLID |
|
||||||
</h1> |
|
||||||
|
|
||||||
<div className='flex flex-wrap flex-row lg:mt-16 justify-center lg:items-start gap-12 flex-grow mb-8'> |
// const SectionDivider = () => <div className="border-b-[3px] border-[#1F5673] w-full"/>;
|
||||||
<Link href="/kodukord"> |
|
||||||
<div className={`${boxStyle} bg-[#007CAB] py-20`}> |
|
||||||
<h2 className={`${boxTextStyle}`}> |
|
||||||
Kodukord |
|
||||||
</h2> |
|
||||||
</div> |
|
||||||
</Link> |
|
||||||
|
|
||||||
<Link href="/reeglid/cs2"> |
return ( |
||||||
<div className={`${boxStyle} bg-[#1F5673] py-20`}> |
<div> |
||||||
<h2 className={`${boxTextStyle}`}> |
<div className="flex flex-col md:m-16"> |
||||||
CS2 reeglid |
<h1 className={`${headingStyle} ml-3 mt-24 md:ml-0 md:mt-16 mb-4 px-4`}> |
||||||
</h2> |
REEGLID |
||||||
</div> |
</h1> |
||||||
</Link> |
|
||||||
|
|
||||||
|
<div className="flex flex-wrap flex-row lg:mt-16 justify-center lg:items-start gap-12 flex-grow mb-8"> |
||||||
|
<Link href="/kodukord"> |
||||||
|
<div className={`${boxStyle} bg-[#007CAB] py-20 px-8`}> |
||||||
|
<h2 className={`${boxTextStyle}`}>Kodukord</h2> |
||||||
|
</div> |
||||||
|
</Link> |
||||||
|
|
||||||
<Link href="reeglid/lol"> |
<Link href="/reeglid/cs2"> |
||||||
<div className={`${boxStyle} bg-[#007CAB] py-20`}> |
<div className={`${boxStyle} bg-[#1F5673] py-20 px-8`}> |
||||||
<h2 className={`${boxTextStyle}`}> |
<h2 className={`${boxTextStyle}`}>CS2 reeglid</h2> |
||||||
LoL reeglid |
</div> |
||||||
</h2> |
</Link> |
||||||
</div> |
|
||||||
</Link> |
|
||||||
|
|
||||||
{/* Minitourn. link coming soon*/} |
<Link href="reeglid/lol"> |
||||||
{/*<Link href="">*/}
|
<div className={`${boxStyle} bg-[#007CAB] py-20 px-8`}> |
||||||
<div |
<h2 className={`${boxTextStyle}`}>LoL reeglid</h2> |
||||||
className={`${boxStyle} bg-[#1F5673] py-16`}> |
|
||||||
<h2 className={`${boxTextStyle}`}> |
|
||||||
Miniturniiride reeglid |
|
||||||
</h2> |
|
||||||
</div> |
|
||||||
{/*</Link>*/} |
|
||||||
|
|
||||||
</div> |
|
||||||
</div> |
</div> |
||||||
|
</Link> |
||||||
<SectionDivider /> |
|
||||||
|
{/* Minitourn. link coming soon*/} |
||||||
|
{/*<Link href="">*/} |
||||||
|
<div className={`${boxStyle} bg-[#1F5673] py-16 px-8`}> |
||||||
|
<h2 className={`${boxTextStyle}`}>Miniturniiride reeglid</h2> |
||||||
|
</div> |
||||||
|
{/*</Link>*/} |
||||||
</div> |
</div> |
||||||
); |
</div> |
||||||
} |
|
||||||
|
<SectionDivider /> |
||||||
|
</div> |
||||||
|
); |
||||||
|
} |
||||||
|
|||||||
@ -0,0 +1,5 @@ |
|||||||
|
## Tulekul |
||||||
|
|
||||||
|
CS2 turniiri reeglid on hetkel ettevalmistamisel ja avaldatakse peagi. |
||||||
|
|
||||||
|
Jälgige meie discordi! |
||||||
Loading…
Reference in new issue