Skip to content

Commit 31328ce

Browse files
APickledWalrusAPickledWalrus
committed
Add release card(s) to homepage
1 parent ff1a253 commit 31328ce

5 files changed

Lines changed: 179 additions & 46 deletions

File tree

‎src/components/GitHubReleaseCard.astro‎

Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
---
2+
import { getEntry, render } from 'astro:content';
3+
import {Card, Icon} from '@astrojs/starlight/components';
4+
5+
interface Props {
6+
id: string;
7+
title: string;
8+
}
9+
10+
const { title, id }: Props = Astro.props;
11+
12+
const release = await getEntry('githubReleaseBodies', id)!;
13+
const { Content } = await render(release);
14+
---
15+
16+
<div class=`release-card ${release.data.prerelease ? 'prerelease' : ''}`>
17+
<Card title={title} icon={release.data.prerelease ? 'warning' : 'star'}>
18+
<Content />
19+
<div class="links">
20+
<a class="download" href={release.data.download_url} target="_blank">
21+
<Icon name="external"/> Download
22+
</a>
23+
<a href={release.data.url} target="_blank">
24+
<Icon name="external"/> Changelog
25+
</a>
26+
</div>
27+
</Card>
28+
</div>
29+
30+
<style>
31+
.links {
32+
display: flex;
33+
align-items: end;
34+
gap: 1rem;
35+
margin-top: auto;
36+
min-height: 2lh;
37+
}
38+
.links a {
39+
display: flex;
40+
flex-direction: row;
41+
gap: 0.25rem;
42+
align-items: center;
43+
44+
height: fit-content;
45+
padding: 0.5rem;
46+
margin: 0;
47+
border: 1px solid;
48+
border-radius: 0.75rem;
49+
50+
color: var(--sl-color-text-accent);
51+
text-decoration: none;
52+
transition: transform 0.1s cubic-bezier(0.45, 0, 0.55, 1);
53+
}
54+
.links a:hover {
55+
background-color: var(--sl-color-accent-low);
56+
transform: scale(105%);
57+
}
58+
.download {
59+
color: var(--sl-color-green) !important;
60+
}
61+
.download:hover {
62+
background-color: var(--sl-color-green-low) !important;
63+
}
64+
</style>
65+
66+
<style is:global>
67+
.release-card {
68+
--sl-text-body: 1.05rem;
69+
}
70+
.release-card .title {
71+
font-size: var(--sl-text-h2);
72+
}
73+
.release-card .icon {
74+
--sl-card-border: var(--sl-color-green);
75+
--sl-card-bg: var(--sl-color-green-low);
76+
}
77+
.release-card.prerelease .icon {
78+
--sl-card-border: var(--sl-color-red);
79+
--sl-card-bg: var(--sl-color-red-low);
80+
}
81+
.release-card .body {
82+
display: flex;
83+
flex-direction: column;
84+
height: 100%;
85+
}
86+
.card-grid:has(.release-card) article {
87+
height: 100%;
88+
}
89+
.card-grid:has(.release-card:only-child) {
90+
grid-template-columns: 1fr;
91+
}
92+
</style>

‎src/components/IndexLinkCard.astro‎

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,20 +6,22 @@ import { Icon } from '@astrojs/starlight/components';
66
import type { StarlightIcon } from '@astrojs/starlight/types';
77
88
interface Props {
9-
icon?: StarlightIcon;
10-
title: string;
11-
variant: "primary" | "secondary";
9+
title: string,
10+
href: string,
11+
icon?: StarlightIcon,
1212
}
1313
14-
const { icon, title, variant, ...attributes } = Astro.props;
14+
const { icon, title, href } = Astro.props;
1515
---
1616

17-
<a class:list={["index-card-link", "sl-flex", variant]} {...attributes}>
18-
<p class="title sl-flex">
19-
{icon && <Icon name={icon} class="icon" size="1.333em" />}
20-
<span set:html={title} />
21-
</p>
22-
<div class="body"><slot /></div>
17+
<a class:list={["index-card-link", "sl-flex", "secondary"]} href={href}>
18+
<p class="title sl-flex">
19+
{icon && <Icon name={icon} class="icon" size="1.333em" />}
20+
<span set:html={title} />
21+
</p>
22+
<div class="body">
23+
<slot />
24+
</div>
2325
</a>
2426

2527
<style>

‎src/content.config.ts‎

Lines changed: 47 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { defineCollection } from 'astro:content';
2-
import { glob } from 'astro/loaders';
1+
import {defineCollection, getCollection} from 'astro:content';
2+
import {glob, type Loader} from 'astro/loaders';
33
import { docsLoader } from '@astrojs/starlight/loaders';
44
import { docsSchema } from '@astrojs/starlight/schema';
55
import { autoSidebarLoader } from 'starlight-auto-sidebar/loader'
@@ -39,9 +39,50 @@ export const collections = {
3939
throw new Error("Failed to fetch versions... aborting");
4040
}
4141
return response.json();
42-
}).then(json => json.map((release: any) => ({
43-
...release,
44-
id: release.id.toString(),
45-
})))
42+
}).then(json => {
43+
let order = 0;
44+
return json.map((release: any) => ({
45+
...release,
46+
id: release.id.toString(),
47+
order: order++,
48+
}));
49+
})
50+
}),
51+
githubReleaseBodies: defineCollection({
52+
loader: function releaseLoader() {
53+
return {
54+
name: 'githubReleaseBodies',
55+
async load({ renderMarkdown, store }) {
56+
store.clear();
57+
58+
const skriptReleases = (await getCollection("skriptReleasesJson"));
59+
const entries = {
60+
'Skript/latest': skriptReleases
61+
.find(entry => entry.data.order == 0)!
62+
.data,
63+
'Skript/latestStable': skriptReleases
64+
.sort((a, b) => a.data.order - b.data.order)!
65+
.find(entry => !entry.data.prerelease)!
66+
.data,
67+
}
68+
69+
for (const [id, data] of Object.entries(entries)) {
70+
let body = data.body;
71+
// TODO this is very questionable
72+
body = '##' + body.substring(0, body.indexOf('Happy Skripting!') + 16);
73+
store.set({
74+
id: id,
75+
data: {
76+
tag_name: data.tag_name,
77+
prerelease: data.prerelease,
78+
url: data.html_url,
79+
download_url: data.assets[0].browser_download_url,
80+
},
81+
rendered: await renderMarkdown(body),
82+
});
83+
}
84+
},
85+
} satisfies Loader;
86+
}()
4687
}),
4788
};

‎src/content/docs/index.mdx‎

Lines changed: 22 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -21,51 +21,43 @@ import IndexLinkCard from "../../../src/components/IndexLinkCard.astro";
2121
<IndexLinkCard
2222
title="Getting Started"
2323
href="scripting"
24-
icon="open-book">
24+
icon="open-book"
25+
>
2526
Learn about using Skript to customize your server
2627
</IndexLinkCard>
2728
<IndexLinkCard
2829
title="Syntaxes"
2930
href="syntaxes"
30-
icon="document">
31+
icon="document"
32+
>
3133
Browse a list of all available syntaxes in Skript
3234
</IndexLinkCard>
3335
<IndexLinkCard
3436
title="API"
3537
href="api"
36-
icon="puzzle">
38+
icon="puzzle"
39+
>
3740
Read tutorials for interacting with Skript's API
3841
</IndexLinkCard>
3942
</IndexCardGrid>
4043

41-
<div style="font-size: 1.15em;">
42-
Skript is a scripting plugin for Paper.
43-
The syntax of Skript is close to English, but it is still not magic.
44-
While you might succeed with experimentation for simple tasks, for anything more complex you will need some guidance.
44+
<div style="font-size: 1.15rem; margin-bottom: 4rem;">
45+
<p>
46+
Skript is a scripting plugin for Paper.
47+
The syntax of Skript is close to English, but it is still not magic.
48+
While you might succeed with experimentation for simple tasks, for anything more complex you will need some guidance.
4549

46-
This is Skript's documentation. You will find all supported features of the plugin here, along with some useful examples.
50+
This is Skript's documentation. You will find all supported features of the plugin here, along with some useful examples.
51+
</p>
4752
</div>
4853

49-
```applescript
50-
command /sethome:
51-
permission: skript.home # Permission required for this command
52-
description: Set your home # Description of this command
53-
executable by: players # Console won't be able to run this command
54-
trigger: # The actual trigger/code that will run when someone do /sethome
55-
# Set a unique variable to sender's location
56-
set {home::%uuid of player%} to location of player
57-
# Send a message to the sender
58-
message "Set your home to <grey>%location of player%<reset>"
54+
import {CardGrid} from "@astrojs/starlight/components";
55+
import GitHubReleaseCard from "../../components/GitHubReleaseCard.astro";
56+
import {getEntry} from "astro:content";
5957

60-
command /home:
61-
permission: skript.home
62-
description: Teleport yourself to your home
63-
trigger:
64-
# Check if that variable we used in /sethome has been set (in other words, if player ever ran /sethome)
65-
if {home::%uuid of player%} is not set:
66-
message "You have not set your home yet!"
67-
stop trigger # stop the code here, lines below won't run
68-
# Teleport the player to their home
69-
teleport player to {home::%uuid of player%}
70-
send "&aYou have been teleported."
71-
```
58+
<CardGrid>
59+
<GitHubReleaseCard id='Skript/latestStable' title="Latest Stable Release"/>
60+
{((await getEntry('githubReleaseBodies', 'Skript/latest')).data.prerelease) && (
61+
<GitHubReleaseCard id='Skript/latest' title="Latest Release"/>
62+
)}
63+
</CardGrid>

‎src/styles/custom.css‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,10 +99,16 @@ code[dir="auto"] {
9999
/* align hero with link cards */
100100
display: grid;
101101
grid-template-columns: 1fr 1fr 1fr;
102+
grid-template-areas: 'stack';
102103
gap: 1.5rem;
103104
}
104105
.hero .stack {
106+
grid-area: stack;
105107
grid-column: span 2;
108+
text-align: left;
109+
* {
110+
align-items: start;
111+
}
106112
}
107113
.hero img {
108114
pointer-events: none;

0 commit comments

Comments
 (0)