SteamWar/Website
10
1
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases Wiki Activity

style: Improve code formatting and readability across multiple components
All checks were successful
SteamWarCI Build successful
Details

Browse Source
This commit is contained in:
Chaoscaot
2025-05-07 14:33:48 +02:00
parent b3598e1ee1
commit 6377799e1b
7 changed files with 169 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/layouts/NavbarLayout.astro
View File

@@ -1,31 +1,33 @@
---
import {Image} from "astro:assets";
import { Image } from "astro:assets";
import Basic from "./Basic.astro";
import "../styles/button.css";
import localLogo from "../images/logo.png";
import {YoutubeSolid, DiscordSolid, FileCodeSolid} from "flowbite-svelte-icons";
import {t} from "astro-i18n";
import {l} from "../util/util";
import { YoutubeSolid, DiscordSolid, FileCodeSolid } from "flowbite-svelte-icons";
import { t } from "astro-i18n";
import { l } from "../util/util";
import Navbar from "@components/Navbar.svelte";
import ServerStatus from "../components/ServerStatus.svelte";
const {title, description} = Astro.props;
const { title, description, transparentFooter = true } = Astro.props;
---
<Basic title={title} description={description}>
<slot name="head" slot="head"/>
<Basic title={title} description={description} autoDarkMode={false}>
<slot name="head" slot="head" />
<Fragment>
<div class="min-h-screen flex flex-col">
<Navbar client:idle>
<Image src={localLogo} alt={t("navbar.logo.alt")} width="44" height="44" quality="max"
class="mr-2 p-1 bg-black rounded-full" slot="logo"/>
<Image src={localLogo} alt={t("navbar.logo.alt")} width="44" height="44" quality="max" class="mr-2 p-1 bg-black rounded-full" slot="logo" />
</Navbar>
<main class="flex-1" data-pagefind-body>
<slot/>
<slot />
</main>
<footer class="bg-gray-900 w-full min-h-80 mt-4 pb-2 rounded-t-2xl flex flex-col dark:bg-neutral-900">
<footer
class={`min-h-80 mt-4 pb-2 rounded-t-2xl flex flex-col ${transparentFooter ? "backdrop-blur-3xl" : "bg-neutral-900"}`}
style="width: min(100%, 75em); margin-left: auto; margin-right: auto;"
>
<div class="flex-1 flex justify-evenly items-center md:items-start mt-4 md:flex-row flex-col gap-y-4">
<div class="footer-card">
<h1>Serverstatus</h1>
@@ -45,14 +47,17 @@ const {title, description} = Astro.props;
<div class="footer-card">
<h1>Social Media</h1>
<a class="flex" href="/youtube">
<YoutubeSolid class="mr-2"/>
YouTube</a>
<YoutubeSolid class="mr-2" />
YouTube</a
>
<a class="flex" href="/discord">
<DiscordSolid class="mr-2"/>
Discord</a>
<DiscordSolid class="mr-2" />
Discord</a
>
<a class="flex" href="https://git.steamwar.de">
<FileCodeSolid class="mr-2"/>
Gitea</a>
<FileCodeSolid class="mr-2" />
Gitea</a
>
</div>
</div>
<span class="text-sm text-white text-center mt-1">© SteamWar.de - Made with ❤️ by Chaoscaot</span>
@@ -77,4 +82,4 @@ const {title, description} = Astro.props;
.match {
width: min(100vw, 70em);
}
</style>
</style>

12
src/layouts/PageLayout.astro
View File

@@ -2,16 +2,16 @@
import NavbarLayout from "./NavbarLayout.astro";
import BackgroundImage from "../components/BackgroundImage.astro";
const {title, description} = Astro.props;
const { title, description } = Astro.props;
---
<NavbarLayout title={title} description={description}>
<slot name="head" slot="head"/>
<slot name="head" slot="head" />
<div class="h-screen w-screen fixed -z-10">
<BackgroundImage />
</div>
<div class="mx-auto bg-gray-100 p-8 rounded-b-md shadow-md pt-14 relative
dark:text-white dark:bg-neutral-900" style="width: min(100%, 75em);">
<slot/>
<div class="mx-auto p-8 rounded-b-md border-x-gray-100 shadow-md pt-14 relative
text-white backdrop-blur-3xl" style="width: min(100%, 75em);">
<slot />
</div>
</NavbarLayout>
</NavbarLayout>