Lixfel anmerkungen #2
This commit is contained in:
@@ -1,18 +1,36 @@
|
||||
---
|
||||
import dayjs from "dayjs";
|
||||
import NavbarLayout from "@layouts/NavbarLayout.astro";
|
||||
import {getCollection} from "astro:content";
|
||||
import {astroI18n} from "astro-i18n";
|
||||
|
||||
import {Image} from "astro:assets";
|
||||
import Card from "@components/Card.svelte";
|
||||
import localBau from "@images/2023-10-08_20.43.43.png";
|
||||
import {CaretRight, Archive, Rocket, Bell} from "@astropub/icons";
|
||||
import {CaretRight, Pause, Rocket, Code, Crosshair1} from "@astropub/icons";
|
||||
import {t} from "astro-i18n";
|
||||
import {l} from "@utils/util";
|
||||
import PlayerCount from "@components/PlayerCount.svelte";
|
||||
import "../../public/fonts/barlow-condensed/barlow-condensed.css";
|
||||
import {Player} from "../components/types/data";
|
||||
import PostComponent from "../components/PostComponent.astro";
|
||||
|
||||
const teamMember: { [key: string]: Player[]} = await fetch("http://127.0.0.1:1337/data/team")
|
||||
.then(value => value.json());
|
||||
|
||||
const posts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.locale);
|
||||
|
||||
const germanPosts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.fallbackLocale);
|
||||
|
||||
germanPosts.forEach(value => {
|
||||
if (posts.find(post => post.data.key === value.data.key)) {
|
||||
return;
|
||||
} else {
|
||||
posts.push(value);
|
||||
}
|
||||
});
|
||||
|
||||
const latestPost = posts.sort((a, b) => dayjs(b.data.created).unix() - dayjs(a.data.created).unix()).at(0);
|
||||
---
|
||||
|
||||
<NavbarLayout title={t("home.page")} description="SteamWar.de Homepage">
|
||||
@@ -106,32 +124,40 @@ const teamMember: { [key: string]: Player[]} = await fetch("http://127.0.0.1:133
|
||||
customElements.define("drop-in", DropIn);
|
||||
</script>
|
||||
</drop-in>
|
||||
<div class="absolute left-1/2 bottom-6 -translate-x-1/2">
|
||||
<PostComponent post={latestPost} slim={true} />
|
||||
</div>
|
||||
</div>
|
||||
<section class="w-full flex flex-col items-center justify-center shadow-2xl rounded-b-2xl pb-8">
|
||||
<div class="py-10 flex flex-col lg:flex-row">
|
||||
<Card client:idle>
|
||||
<Archive heigth="64" width="64"/>
|
||||
<h1>{t("home.benefits.historic.title")}</h1>
|
||||
<p class="mt-4">{t("home.benefits.historic.description.1")}</p>
|
||||
<p class="mt-4">{t("home.benefits.historic.description.2")}</p>
|
||||
<Crosshair1 heigth="64" width="64"/>
|
||||
<h1>{t("home.benefits.fights.title")}</h1>
|
||||
<p class="mt-4">{t("home.benefits.fights.description.1")}</p>
|
||||
<p class="mt-4">{t("home.benefits.fights.description.2")}</p>
|
||||
</Card>
|
||||
<Card client:idle>
|
||||
<Rocket heigth="64" width="64"/>
|
||||
<h1>{t("home.benefits.server.title")}</h1>
|
||||
<p class="mt-4">{t("home.benefits.server.description")}</p>
|
||||
<h1>{t("home.benefits.bau.title")}</h1>
|
||||
<p class="mt-4">{t("home.benefits.bau.description")}</p>
|
||||
</Card>
|
||||
<Card client:idle>
|
||||
<Bell heigth="64" width="64"/>
|
||||
<h1>{t("home.benefits.events.title")}</h1>
|
||||
<p class="mt-4">{t("home.benefits.events.description.1")}</p>
|
||||
<p class="mt-4">{t("home.benefits.events.description.2")}</p>
|
||||
<Pause heigth="64" width="64"/>
|
||||
<h1>{t("home.benefits.minigames.title")}</h1>
|
||||
<p class="mt-4">{t("home.benefits.minigames.description.1")}</p>
|
||||
<p class="mt-4">{t("home.benefits.minigames.description.2")}</p>
|
||||
</Card>
|
||||
<Card client:idle>
|
||||
<Code heigth="64" width="64"/>
|
||||
<h1>{t("home.benefits.open.title")}</h1>
|
||||
<p class="mt-4">{t("home.benefits.open.description")}</p>
|
||||
</Card>
|
||||
</div>
|
||||
</section>
|
||||
<section class="w-full py-12">
|
||||
{Object.entries(teamMember).map(([prefix, players]) => (
|
||||
<div class="flex items-center flex-col">
|
||||
<h2 class="dark:text-white text-4xl font-bold">{t("home.prefix." + prefix)}</h2>
|
||||
<h2 class="dark:text-white text-4xl font-bold">{t("home.prefix." + prefix.replace("PREFIX_", "").toLowerCase())}</h2>
|
||||
<div class="flex my-4 md:flex-row flex-col flex-wrap justify-center">
|
||||
{players.map(v => (
|
||||
<Card extraClasses="py-24 px-12" client:idle>
|
||||
|
||||
47
src/pages/publics/[mode].astro
Normal file
47
src/pages/publics/[mode].astro
Normal file
@@ -0,0 +1,47 @@
|
||||
---
|
||||
import {createGetStaticPaths} from "astro-i18n";
|
||||
import PageLayout from "../../layouts/PageLayout.astro";
|
||||
import {getCollection} from "astro:content";
|
||||
import {l} from "../../util/util";
|
||||
import { Image } from "astro:assets";
|
||||
import Card from "@components/Card.svelte";
|
||||
import XRayPreview from "@components/publics/XRayPreview.svelte";
|
||||
import {t} from "astro-i18n";
|
||||
|
||||
const { mode } = Astro.props;
|
||||
|
||||
export const getStaticPaths = createGetStaticPaths(async () => {
|
||||
const gamemodes = await getCollection("modes");
|
||||
|
||||
return gamemodes.map((entry) => ({
|
||||
props: {
|
||||
mode: entry,
|
||||
},
|
||||
params: {
|
||||
mode: entry.id,
|
||||
},
|
||||
}));
|
||||
});
|
||||
|
||||
const publics = await getCollection("publics", entry => entry.data.gamemode.id == mode.id);
|
||||
---
|
||||
|
||||
<PageLayout title="Publics">
|
||||
<h1 class="text-4xl font-bold">{t(`${mode.data.translationKey}.title`)}</h1>
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
{publics.map((pub) => (
|
||||
<a href={l("/publics/" + pub.id)}>
|
||||
<Card extraClasses="w-full m-0" hoverEffect={false}>
|
||||
<div class="flex justify-center">
|
||||
<XRayPreview client:load>
|
||||
<Image style="width: 500px" slot="normal" src={pub.data.image} alt={pub.data.name} transition:name={pub.data.id + "-img"} />
|
||||
{pub.data.xray && <Image slot="xray" class="bg-zinc-50 dark:bg-zinc-900" src={pub.data.xray} alt={pub.data.name} />}
|
||||
</XRayPreview>
|
||||
</div>
|
||||
<h2 class="font-bold text-3xl" transition:name={pub.data.id + "-title"}>{pub.data.name}</h2>
|
||||
<h3 transition:name={pub.data.id + "-desc"}>{pub.data.description}</h3>
|
||||
</Card>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</PageLayout>
|
||||
@@ -1,34 +0,0 @@
|
||||
---
|
||||
import PageLayout from "../../layouts/PageLayout.astro";
|
||||
import {getCollection} from "astro:content";
|
||||
import {l} from "../../util/util";
|
||||
import { Image } from "astro:assets";
|
||||
import Card from "@components/Card.svelte";
|
||||
import XRayPreview from "@components/publics/XRayPreview.svelte";
|
||||
import {t} from "astro-i18n";
|
||||
|
||||
const gamemodes = await getCollection("modes");
|
||||
const publics = await getCollection("publics");
|
||||
---
|
||||
|
||||
<PageLayout title="Publics">
|
||||
{gamemodes.filter(value => publics.map(value1 => value1.data.gamemode.id).includes(value.id)).map((gamemode) => (
|
||||
<h1 class="text-4xl font-bold">{t(`${gamemode.data.translationKey}.title`)}</h1>
|
||||
<div class="grid grid-cols-2 gap-2">
|
||||
{publics.filter(value => value.data.gamemode.id == gamemode.id).map((pub) => (
|
||||
<a href={l("/publics/" + pub.id)}>
|
||||
<Card extraClasses="w-full m-0" hoverEffect={false}>
|
||||
<div class="flex justify-center">
|
||||
<XRayPreview client:load>
|
||||
<Image style="width: 500px" slot="normal" src={pub.data.image} alt={pub.data.name} transition:name={pub.data.id + "-img"} />
|
||||
{pub.data.xray && <Image slot="xray" class="bg-zinc-50 dark:bg-zinc-900" src={pub.data.xray} alt={pub.data.name} />}
|
||||
</XRayPreview>
|
||||
</div>
|
||||
<h2 class="font-bold text-3xl" transition:name={pub.data.id + "-title"}>{pub.data.name}</h2>
|
||||
<h3 transition:name={pub.data.id + "-desc"}>{pub.data.description}</h3>
|
||||
</Card>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
</PageLayout>
|
||||
@@ -31,6 +31,7 @@ const modes = await getCollection("modes", entry => entry.data.main);
|
||||
<div>{t("rules." + value.data.translationKey + ".description")}</div>
|
||||
<div class="mt-2 flex flex-col">
|
||||
<a href={l(`/rules/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("rules.rules")}</a>
|
||||
<a href={l(`/publics/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("rules.publics")}</a>
|
||||
<a href={l(`/announcements/tags/${value.id}`)}
|
||||
class="text-yellow-300 hover:underline w-fit">{t("rules.announcements")}</a>
|
||||
{value.data.ranked
|
||||
|
||||
Reference in New Issue
Block a user