alex/agb
1
0
Fork 0
mirror of https://github.com/italicsjenga/agb.git synced 2024-12-23 08:11:33 +11:00
Code Issues Packages Projects Releases Wiki Activity

extract content block kind

Browse source
This commit is contained in:
Corwin 2024-04-30 02:16:56 +01:00
parent 3587c599ac
commit 9c00be8d6a
No known key found for this signature in database
3 changed files with 16 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
website/agb/src/app/page.tsx
View file

@ -12,14 +12,7 @@ import { useMemo, useRef, useState } from "react";
import { GbaKey } from "../components/mgba/bindings"; import { GbaKey } from "../components/mgba/bindings";
import { useClientValue } from "../hooks/useClientValue.hook"; import { useClientValue } from "../hooks/useClientValue.hook";
import { MgbaHandle } from "../components/mgba/mgba"; import { MgbaHandle } from "../components/mgba/mgba";
import { ExternalLink } from "@/components/externalLink"; import { ExternalLink, ExternalLinkBlock } from "@/components/externalLink";
const HelpLinks = styled.div`
display: flex;
flex-wrap: wrap;
gap: 16px;
justify-content: space-around;
`;
const GameDisplay = styled.div` const GameDisplay = styled.div`
height: min(calc(100vw / 1.5), min(90vh, 480px)); height: min(calc(100vw / 1.5), min(90vh, 480px));
@ -133,7 +126,7 @@ export default function Home() {
<MgbaWithControllerSides /> <MgbaWithControllerSides />
</ContentBlock> </ContentBlock>
<ContentBlock color="#256256"> <ContentBlock color="#256256">
<HelpLinks> <ExternalLinkBlock>
<ExternalLink href="https://github.com/agbrs/agb"> <ExternalLink href="https://github.com/agbrs/agb">
GitHub GitHub
</ExternalLink> </ExternalLink>
@ -142,7 +135,7 @@ export default function Home() {
Docs Docs
</ExternalLink> </ExternalLink>
<ExternalLink href="./showcase">Showcase</ExternalLink> <ExternalLink href="./showcase">Showcase</ExternalLink>
</HelpLinks> </ExternalLinkBlock>
</ContentBlock> </ContentBlock>
</> </>
); );

4
website/agb/src/app/showcase/[game]/page.tsx
View file

@ -1,7 +1,7 @@
import { slugify } from "@/sluggify"; import { slugify } from "@/sluggify";
import { Games, ShowcaseGame } from "../games"; import { Games, ShowcaseGame } from "../games";
import { ContentBlock } from "@/components/contentBlock"; import { ContentBlock } from "@/components/contentBlock";
import { ExternalLink } from "@/components/externalLink"; import { ExternalLink, ExternalLinkBlock } from "@/components/externalLink";
import Link from "next/link"; import Link from "next/link";
import { import {
BackToShowcaseWrapper, BackToShowcaseWrapper,
@ -70,9 +70,11 @@ function Display({ game }: { game: ShowcaseGame }) {
</DescriptionAndScreenshots> </DescriptionAndScreenshots>
</ContentBlock> </ContentBlock>
<ContentBlock color="#256256"> <ContentBlock color="#256256">
<ExternalLinkBlock>
{game.itch && ( {game.itch && (
<ExternalLink href={game.itch.href}>View on itch.io</ExternalLink> <ExternalLink href={game.itch.href}>View on itch.io</ExternalLink>
)} )}
</ExternalLinkBlock>
</ContentBlock> </ContentBlock>
</> </>
); );

7
website/agb/src/components/externalLink.tsx
View file

@ -14,3 +14,10 @@ export const ExternalLink = styled(Link)`
border: solid black 2px; border: solid black 2px;
} }
`; `;
export const ExternalLinkBlock = styled.div`
display: flex;
flex-wrap: wrap;
gap: 16px;
justify-content: space-around;
`;