Skip to content

Commit 1ea3d8d

Browse files
DerGooglerDerGoogler
committed
add downloads page
1 parent 894883b commit 1ea3d8d

File tree

3 files changed

+200
-5
lines changed

3 files changed

+200
-5
lines changed

‎docs/.vitepress/config/en.ts‎

Lines changed: 35 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -45,11 +45,41 @@ export default defineConfig({
4545

4646
function nav() {
4747
return [
48-
{ text: "Guide", link: "/guide" },
49-
{ text: "Repositories", link: "/repository" },
50-
{ text: "Blacklist", link: "/blacklist" },
51-
{ text: "Changelog", link: `/changelog/${changelog[0].versionCode}` },
52-
{ text: "Legal", link: "/legal/privacy" },
48+
{
49+
text: "Guide",
50+
link: "/guide",
51+
activeMatch: "/guide/",
52+
},
53+
{
54+
text: "Repositories",
55+
link: "/repository",
56+
activeMatch: "/repository/",
57+
},
58+
{
59+
text: "More",
60+
items: [
61+
{
62+
text: "Downloads",
63+
link: "/downloads",
64+
activeMatch: "/downloads/",
65+
},
66+
{
67+
text: "Blacklist",
68+
link: "/blacklist",
69+
activeMatch: "/blacklist/",
70+
},
71+
{
72+
text: "Changelog",
73+
link: `/changelog/${changelog[0].versionCode}`,
74+
activeMatch: "/changelog/",
75+
},
76+
],
77+
},
78+
{
79+
text: "Legal",
80+
link: "/legal/privacy",
81+
activeMatch: "/legal/",
82+
},
5383
];
5484
}
5585

‎docs/data/downloads.data.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export default {
2+
async load() {
3+
return (await fetch("https://api.github.com/repos/MMRLApp/MMRL/releases")).json();
4+
},
5+
};

‎docs/en/downloads.md‎

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
---
2+
editLink: false
3+
prev: false
4+
next: false
5+
---
6+
7+
# MMRL Downloads
8+
9+
<script setup>
10+
import { data } from '../data/downloads.data.ts'
11+
import { toFormattedFileSize } from "../helper/toFormattedFileSize";
12+
import { VPLink } from "vitepress/theme";
13+
import { useData } from "vitepress";
14+
15+
const { lang } = useData();
16+
17+
const getLastUpdated = (timestamp) => {
18+
if (!timestamp) {
19+
return "Invalid date";
20+
}
21+
22+
return Intl.DateTimeFormat(lang, {
23+
year: "numeric",
24+
day: "2-digit",
25+
month: "short",
26+
hour12: true,
27+
}).format(new Date(timestamp));
28+
};
29+
</script>
30+
31+
<div :class="$style.items" v-for="release in data">
32+
<VPLink :class="$style.item" decoration="none" :href="release.assets[0].browser_download_url" target="_blank">
33+
<div :class="$style.feature">
34+
<article :class="$style.box">
35+
<h2 :class="$style.title" :id="release.id">{{ release.tag_name }}</h2>
36+
<ul :class="$style.moduleMetaContainer">
37+
<li :class="$style.moduleMeta" v-if="release.assets[0].size">
38+
<svg :class="$style.moduleMetaIcon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-git-branch"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 18m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M7 6m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M17 6m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" /><path d="M7 8l0 8" /><path d="M9 18h6a2 2 0 0 0 2 -2v-5" /><path d="M14 14l3 -3l3 3" /></svg>
39+
{{ release.target_commitish }}
40+
</li>
41+
<li :class="$style.moduleMeta" v-if="release.assets[0].size">
42+
<svg :class="$style.moduleMetaIcon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-download"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-2" /><path d="M7 11l5 5l5 -5" /><path d="M12 4l0 12" /></svg>
43+
{{ release.assets[0].download_count }}
44+
</li>
45+
<li :class="$style.moduleMeta" v-if="release.assets[0].size">
46+
<svg :class="$style.moduleMetaIcon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M6 20.735A2 2 0 0 1 5 19V5a2 2 0 0 1 2-2h7l5 5v11a2 2 0 0 1-2 2h-1" /><path d="M11 17a2 2 0 0 1 2 2v2a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-2a2 2 0 0 1 2-2m0-12h-1m3 2h-1m-1 2h-1m3 2h-1m-1 2h-1m3 2h-1" /></g></svg>
47+
{{ toFormattedFileSize(release.assets[0].size) }}
48+
</li>
49+
<li :class="$style.moduleMeta" v-if="release.published_at">
50+
<svg :class="$style.moduleMetaIcon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0-18 0" /><path d="M12 7v5l3 3" /></g></svg>
51+
{{ getLastUpdated(release.published_at) }}
52+
</li>
53+
<li :class="$style.moduleMeta" v-if="release.assets[0].size">
54+
<img :style="{borderRadius:'100%'}" :class="$style.moduleMetaIcon" :src="release.assets[0].uploader.avatar_url" />
55+
<VPLink decoration="none" :style="{marginRight: '6px'}" :href="release.assets[0].uploader.html_url" target="_blank">{{ release.assets[0].uploader.login }}</VPLink> uploaded this
56+
</li>
57+
</ul>
58+
</article>
59+
</div>
60+
</VPLink>
61+
</div>
62+
63+
<style scoped>
64+
a {
65+
text-decoration: none !important;
66+
}
67+
</style>
68+
69+
<style module>
70+
.item {
71+
padding: 8px;
72+
width: 100%;
73+
}
74+
75+
.items {
76+
display: flex;
77+
flex-wrap: wrap;
78+
}
79+
80+
.feature {
81+
user-select: none;
82+
cursor: pointer;
83+
text-decoration: none !important;
84+
display: block;
85+
border: 1px solid var(--vp-c-bg-soft);
86+
border-radius: 12px;
87+
height: 100%;
88+
background-color: var(--vp-c-bg-soft);
89+
transition: border-color 0.25s, background-color 0.25s;
90+
}
91+
92+
.feature:hover {
93+
border-color: var(--vp-badge-tip-text);
94+
}
95+
96+
.box {
97+
display: flex;
98+
flex-direction: column;
99+
padding: 24px;
100+
height: 100%;
101+
}
102+
103+
.title {
104+
margin: unset !important;
105+
padding-top: unset !important;
106+
border-top: unset !important;
107+
color: initial !important;
108+
line-height: 24px !important;
109+
font-size: 16px !important;
110+
font-weight: 600 !important;
111+
}
112+
113+
.author {
114+
flex-grow: 1;
115+
line-height: 24px;
116+
font-size: 13px;
117+
font-weight: 500;
118+
color: var(--vp-badge-tip-text);
119+
}
120+
121+
.details {
122+
flex-grow: 1;
123+
padding-top: 8px;
124+
line-height: 24px;
125+
font-size: 14px;
126+
font-weight: 500;
127+
color: var(--vp-c-text-2);
128+
}
129+
130+
.moduleCover {
131+
border-radius: 12px 12px 0px 0px;
132+
width: 100%;
133+
height: 100%;
134+
aspect-ratio: 2.048;
135+
object-fit: cover;
136+
}
137+
138+
.moduleMeta {
139+
align-items: center;
140+
align-self: end;
141+
display: flex;
142+
line-height: 20px;
143+
word-break: break-word;
144+
}
145+
146+
.moduleMetaIcon {
147+
flex-shrink: 0;
148+
width: 20px;
149+
line-height: 20px;
150+
margin-right: 4px;
151+
height: 20px;
152+
}
153+
154+
.moduleMetaContainer {
155+
color: var(--vp-c-text-3);
156+
margin: 0px !important;
157+
padding: 0px !important;
158+
padding-top: 20px !important;
159+
}
160+
</style>

0 commit comments

Comments
 (0)