Better CSS for releases page (inspired on GitHub). Github fetched releases now show more info.

This commit is contained in:
天クマ 2025-10-30 20:35:39 -03:00
commit f39ab4539c
11 changed files with 166 additions and 33 deletions

View file

@ -12,7 +12,12 @@ const buildTime = new Date(Date.now()).toISOString();
export default function (eleventyConfig) {
eleventyConfig.addNunjucksAsyncFilter("githubReleases", async function(owner, repo, callback) {
const token = process.env.GITHUB_ACCESS_TOKEN;
if (!owner || !repo) return callback(null, []);
if (!owner || !repo) return callback(null, [ name = "This project is not configured properly." ]);
if (!token || !isProd) return callback(null, [{
name: "This instance cannot fetch releases from GitHub, you can check them manually here.",
html_url: `https://github.com/${owner}/${repo}/releases`
}]);
const url = `https://api.github.com/repos/${owner}/${repo}/releases`;
@ -26,6 +31,7 @@ export default function (eleventyConfig) {
});
if (!res.ok) return callback(null, [ name = "Error fetching releases for GitHub project." ]);
const data = await res.json();
console.log(data)
callback(null, data);
} catch (err) {
console.error(err);
@ -33,6 +39,10 @@ export default function (eleventyConfig) {
}
});
eleventyConfig.addFilter("collectionFind", (collection = [], url = "") => {
return collection.find(item => item.url = url);
});
eleventyConfig.setInputDirectory("src");
eleventyConfig.setOutputDirectory("public");
eleventyConfig.addPassthroughCopy("src/projects/**/*.png");

View file

@ -15,7 +15,8 @@
"build": "npm run build:eleventy",
"build:sass:prod": "sass src/static/scss:public/static/css --style compressed",
"build:eleventy:prod": "ELEVENTY_ENV=production eleventy",
"build:prod": "npm run build:eleventy:prod"
"build:prod": "npm run build:eleventy:prod",
"serve:prod": "ELEVENTY_ENV=production eleventy --serve"
},
"repository": {
"type": "git",

14
src/_data/news.json Normal file
View file

@ -0,0 +1,14 @@
{
"entries": [
{
"date": "2025-10-30",
"title": "Releases support",
"text": "Now developers can list their software version and automatically list their GitHub releases in their project page!"
},
{
"date": "2025-10-27",
"title": "Website redesign!",
"text": "Yaaay! neoBeta got a stylish redesign."
}
]
}

5
src/_includes/news.njk Normal file
View file

@ -0,0 +1,5 @@
<h2>Latest updates</h2>
{% for news in news.entries %}
<p>{{ news.date }} {{ news.title }}:</p>
<p style="opacity: .8;">{{ news.text | safe }}</p>
{% endfor %}

View file

@ -6,24 +6,62 @@ pagination:
permalink: "{{ project.url }}releases.html"
layout: base.njk
---
<h1>Releases for {{ project.data.name }}</h1>
{% if project.data.releaseType %}
<p id="projectInfoReleases">
{% if project.data.releaseType == "github" %}
{% set releases = project.data.githubRepoOwner | githubReleases(project.data.githubRepoName) %}
Releases fetched from GitHub at {{ buildTime }}:<br>
{% for release in releases %}
<p><a href="{{ release.html_url }}">{{ release.name }}</a></p>
{% endfor %}
{% endif %}
{% if project.data.releaseType == "local" %}
<p class="rainbowText">{{ project.data.releases | length }} releases.</p>
{% for label, addr in project.data.releases %}
<p><a href="{{ addr | url }}">{{ label }}</a></p>
{% endfor %}
{% endif %}
{% if project.data.dependencies %}
<p>This project depends on:
{% for dep in project.data.dependencies %}
{% set depl = collections.projects | collectionFind("/projects/" + dep + "/") %}
<a href="{% if depl %}{{ depl.url | url }}{% else %}{% endif %}">{{ dep }}.</a>
{% endfor %}
</p>
{% endif %}
{% if project.data.releaseType %}
{% if project.data.releaseType == "github" %}
{% set releases = project.data.githubRepoOwner | githubReleases(project.data.githubRepoName) %}
<p class="rainbowText">{{ releases | length }} releases fetched from GitHub at {{ buildTime }}.</p>
<div style="display: flex; flex-direction: column; gap: 1em;">
{% for release in releases %}
<div>
<h2>{{ release.name }}</h2>
<p>{{ release.tag_name }} for {{ project.data.gameLoaders or "unknown loader" }} {{ project.data.gameVersions or "unknow version" }}</p>
<div style="padding: .6em; background-color: var(--accent-background); border-radius: 4px;">
<div class="oneLineClamp">
<p><a href="{{release.html_url}}">Download on GitHub.</a><p>
</div>
<div class="oneLineClamp">
<p><a href="{{ release.tarball_url }}">Source code tarball <span class="dimText">{{ release.tarball_url }}</span></a></p>
</div>
<div class="oneLineClamp">
<p><a href="{{ release.zipball_url }}">Source code zipball <span class="dimText">{{ release.zipball_url }}</span></a></p>
</div>
</div>
</div>
{% endfor %}
</div>
{% endif %}
{% if project.data.releaseType == "local" %}
<p class="rainbowText">{{ project.data.releases | length }} releases.</p>
<div style="display: flex; flex-direction: column; gap: 1em;">
{% for release in project.data.releases %}
<div>
<h2>{{ release.name }}</h2>
<p>Version {{ release.version }} for {{ release.gameLoaders or project.data.gameLoaders }} {{ release.gameVersions or project.data.gameVersions }}</p>
{% if release.downloads %}
<div style="padding: .6em; background-color: var(--accent-background); border-radius: 4px;">
{% for label, addr in release.downloads %}
<div class="oneLineClamp">
<p><a href="{{ addr | url }}">{{ label }} <span class="dimText">{{ addr | url }}</span></a></p>
</div>
{% endfor %}
</div>
{% endif %}
</div>
{% endfor %}
</div>
{% endif %}
{% else %}
<p>Could not find any release for this project...</p>
<p>Could not find any release for this project...</p>
{% endif %}

View file

@ -72,6 +72,7 @@ code {
display: inline-block;
max-width: 100%;
overflow-x: auto;
font-size: .8em;
}
input, select {
@ -93,6 +94,10 @@ hr {
margin-bottom: 1em;
}
h1, h2, h3, h4, h5, h6 {
text-shadow: 2px 6px 5px rgba(0,0,0,0.2), 0px -4px 10px rgba(0,0,0,0.3);
}
#linksBox {
padding: 2em;
display: flex;
@ -184,6 +189,16 @@ hr {
-webkit-box-orient: vertical
}
.oneLineClamp {
overflow: hidden;
width: 100%;
display: -webkit-box;
height: 1em;
line-clamp: 1;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical
}
.featuredProjectSubtitle {
padding-bottom: 0px;
}
@ -235,6 +250,7 @@ h1, h2, h3 {
color: transparent;
animation: rainbow_animation 6s ease-in-out infinite;
background-size: 400% 100%;
text-shadow: none;
}
@keyframes rainbow_animation {

View file

@ -1,9 +1,7 @@
---
name: "tenkuma"
subtitle: "A bear doing things on the internet."
downloadLink: "https://modrinth.com/plugin/tenkumalib/versions"
logoName: "logo"
logoExtension: "png"
logo: "logo.png"
images: ["tenkuma-silverfish.jpg", "tenkuma-mrnando-enderdragon.jpg"]
---

View file

@ -18,11 +18,20 @@ neoBeta is an open-source content management system. There are various ways you
Please fill as many fields as possible.
- *images* - lists of image files names or URLs that will appear in the project page.
- *logo* - your logo file name or URL.
- *gameVersions* - taget Minecraft versions.
- *gameLoaders* - supported modloaders.
### Releases metadata
- *releasesType* - wheter your project uses `local` releases or `github`.
For local releases:
- *releases* - a list of relases labels and links.
- *name* - name of the release.
- *version* - version of the release.
- *gameVersions* - taget Minecraft versions (overrides default value).
- *gameLoaders* - supported modloaders (overrides default value).
- *downloads* - list of download links for this release.
For GitHub releases:
- *githubRepoOwner* - username of the repo owner.
- *githubReponame* - name of the repository.
@ -47,7 +56,17 @@ For GitHub releases:
"releaseType": "github or local",
"githubRepoOwner": "adrianvic",
"githubRepoName": "ghostsandstuff",
"releases": {
"test release": "https://example.com/"
}
}```
"gameLoaders": ["Craftbukkit"]
"releases": [
{
"name": "The first release.",
"version": "1.0.0",
"gameVersions": ["b1.7.3"],
"downloads": {
"GitHub": "https://example.com",
"Modrinth": "https://modrinth.com"
}
}
]
}
```

View file

@ -11,10 +11,9 @@ styles: ["home"]
<div id="featureAndUpdates">
<div>
<h2>Featured projects</h2>
{{ featured.projectShowcase(["ghostsandstuff", "aboukkit", "tenkumalib", "hangglidere", "devilwithin", "timekeeper", "tefreezer"], collections.projects) }}
{{ featured.projectShowcase(["ghostsandstuff", "devilwithin", "timekeeper", "tefreezer"], collections.projects) }}
</div>
<div id="homeUpdates">
<h2>Latest updates</h2>
<p>2025-10-27: Website redesign!<br>Yaaay! neoBeta got a stylish redesign.</p>
{% include "news.njk" %}
</div>
</div>

View file

@ -2,7 +2,38 @@
"name": "Aboukkit",
"subtitle": "A simple way to add custom commands with custom responses to your server.",
"author": "tenkuma",
"downloadLink": "https://modrinth.com/plugin/aboukkit/versions",
"links": {
"Modrinth": "https://modrinth.com/plugin/aboukkit/versions",
"GitHub": "https://github.com/adrianvic/aboukkit",
"Disroot Git": "https://git.disroot.org/adrianvictor/aboukkit"
},
"logo": "logo.png",
"tags": ["plugin"]
"tags": ["plugin"],
"releaseType": "local",
"dependencies": ["tenkumalib"],
"gameVersions": "b1.7.3",
"gameLoaders": "Bukkit",
"releases": [
{
"name": "Library update",
"version": "2.1",
"downloads": {
"Modrinth": "https://modrinth.com/plugin/aboukkit/version/2.1"
}
},
{
"name": "Color update",
"version": "2.0",
"downloads": {
"Modrinth": "https://modrinth.com/plugin/aboukkit/version/2.0"
}
},
{
"name": "Vanilla",
"version": "1.0",
"downloads": {
"Modrinth": "https://modrinth.com/plugin/aboukkit/version/1.0"
}
}
]
}

View file

@ -15,5 +15,7 @@
},
"releaseType": "github",
"githubRepoOwner": "adrianvic",
"githubRepoName": "ghostsandstuff"
"githubRepoName": "ghostsandstuff",
"gameVersions": ["b1.7.3"],
"gameLoaders": ["Bukkit"]
}