michael/michaelrausch-24
1
0
Fork 0
mirror of https://github.com/michaelrausch/michaelrausch-24.git synced 2024-12-03 10:33:08 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added lab page

Browse Source
This commit is contained in:
Michael 2024-11-01 00:52:40 +13:00
parent 9d6fafd101
commit fb19e55139
4 changed files with 47 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/ArrowCard.astro
View File

@ -1,5 +1,6 @@
---
import type { CollectionEntry } from "astro:content";
import LinkCard from "./LinkCard.astro";
type Props = {
entry: CollectionEntry<"blog"> | CollectionEntry<"projects">;
@ -8,20 +9,6 @@ type Props = {
const { entry } = Astro.props;
---
<a href={`/${entry.collection}/${entry.slug}`} class="relative group flex flex-nowrap py-3 px-4 pr-10 rounded-lg border border-black/15 dark:border-white/20 hover:bg-black/5 dark:hover:bg-white/5 hover:text-black dark:hover:text-white transition-colors duration-300 ease-in-out">
<div class="flex flex-col flex-1 truncate">
<div class="font-semibold">
{entry.data.title}
</div>
<div class="text-sm">
{entry.data.description}
</div>
</div>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
class="absolute top-1/2 right-2 -translate-y-1/2 size-5 stroke-2 fill-none stroke-current">
<line x1="5" y1="12" x2="19" y2="12" class="translate-x-3 group-hover:translate-x-0 scale-x-0 group-hover:scale-x-100 transition-transform duration-300 ease-in-out" />
<polyline points="12 5 19 12 12 19" class="-translate-x-1 group-hover:translate-x-0 transition-transform duration-300 ease-in-out" />
</svg>
</a>
<LinkCard href={`/${entry.collection}/${entry.slug}`} heading={entry.data.title} subheading={entry.data.description}>
</LinkCard>

6
src/components/Header.astro
View File

@ -28,6 +28,12 @@ import { SITE } from "@consts";
<Link href="/projects">
projects
</Link>
<span>
{`/`}
</span>
<Link href="/lab">
lab
</Link>
</nav>
</div>
</Container>

28
src/components/LinkCard.astro Normal file
View File

@ -0,0 +1,28 @@
---
type Props = {
heading: string;
subheading: string;
href: string;
target?: string;
}
const { heading, subheading, href, target="" } = Astro.props;
---
<a href={href} target={target} class="relative group flex flex-nowrap py-3 px-4 pr-10 rounded-lg border border-black/15 dark:border-white/20 hover:bg-black/5 dark:hover:bg-white/5 hover:text-black dark:hover:text-white transition-colors duration-300 ease-in-out">
<div class="flex flex-col flex-1 truncate">
<div class="font-semibold">
{heading}
</div>
<div class="text-sm">
{subheading}
</div>
</div>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
class="absolute top-1/2 right-2 -translate-y-1/2 size-5 stroke-2 fill-none stroke-current">
<line x1="5" y1="12" x2="19" y2="12" class="translate-x-3 group-hover:translate-x-0 scale-x-0 group-hover:scale-x-100 transition-transform duration-300 ease-in-out" />
<polyline points="12 5 19 12 12 19" class="-translate-x-1 group-hover:translate-x-0 transition-transform duration-300 ease-in-out" />
</svg>
</a>

52
src/pages/lab.astro
View File

@ -2,56 +2,22 @@
import Container from "@components/Container.astro";
import PageLayout from "@layouts/PageLayout.astro";
import { HOME } from "@consts";
import LinkCard from "@components/LinkCard.astro";
---
<PageLayout title={HOME.TITLE} description={HOME.DESCRIPTION}>
<Container>
<h4 class="animate font-semibold text-black dark:text-white text-4xl font-serif">
<h4 class="animate font-semibold text-black dark:text-white text-4xl font-serif pb-10">
Lab
</h4>
<div class="space-y-16">
<section>
<div class="animate flex flex-col gap-4">
<LinkCard target="_blank" href="https://jellyfin.rausch.nz" heading="Jellyfin" subheading="Can only be accessed on the internal network or via Unifi Identity VPN"></LinkCard>
<LinkCard target="_blank" href="https://home.rausch.nz" heading="Home Assistant" subheading=""></LinkCard>
<LinkCard target="_blank" href="https://git.rausch.nz/michael" heading="Gitea" subheading=""></LinkCard>
<LinkCard target="_blank" href="https://vault.rausch.nz" heading="VaultWarden" subheading=""></LinkCard>
<LinkCard target="_blank" href="https://portainer.internal:9443" heading="Portainer" subheading="Internal Only"></LinkCard>
<LinkCard target="_blank" href="http://status.internal:3001" heading="Uptime-kuma" subheading="Internal Only"></LinkCard>
</section>
<section class="animate space-y-6">
<div class="flex flex-wrap items-center justify-between">
<h5 class="font-semibold text-black dark:text-white">
Jellyfin
</h5>
<a target="_blank" href="https://jellyfin.rausch.nz">https://jellyfin.rausch.nz</a>
</div>
<p class="text-sm">Jellyfin can only be accessed on the internal network or via Unifi Identity VPN</p>
</section>
<section class="animate space-y-6">
<div class="flex flex-wrap items-center justify-between">
<h5 class="font-semibold text-black dark:text-white">
Home Assistant
</h5>
<a target="_blank" href="https://home.rausch.nz">https://home.rausch.nz</a>
</div>
</section>
<section class="animate space-y-6">
<div class="flex flex-wrap items-center justify-between">
<h5 class="font-semibold text-black dark:text-white">
Gitea
</h5>
<a target="_blank" href="https://git.rausch.nz">https://git.rausch.nz</a>
</div>
</section>
<section class="animate space-y-6">
<div class="flex flex-wrap items-center justify-between">
<h5 class="font-semibold text-black dark:text-white">
Vaultwarden
</h5>
<a target="_blank" href="https://vault.rausch.nz">https://vault.rausch.nz</a>
</div>
</section>
</div>
</Container>
</PageLayout>