refactor(website): use button component in downloads

This commit is contained in:
Elian Doran 2025-09-27 15:57:01 +03:00
parent b00cd032a3
commit adf29b4e6e
No known key found for this signature in database
2 changed files with 12 additions and 6 deletions

View File

@ -14,12 +14,9 @@
.download-options a.recommended { .download-options a.recommended {
display: block; display: block;
background: var(--accent-color); background: var(--accent-color);
padding: 0.5em 1em;
border-radius: calc(infinity * 1px);
color: var(--brand-foreground-color); color: var(--brand-foreground-color);
border-radius: calc(infinity * 1px);
margin: 1em 0; margin: 1em 0;
text-decoration: none;
text-align: center;
} }
.download-options .other-options { .download-options .other-options {

View File

@ -4,6 +4,7 @@ import Section from "../../components/Section";
import { App, Architecture, buildDownloadUrl, downloadMatrix, DownloadMatrixEntry, getArchitecture, Platform } from "../../download-helper"; import { App, Architecture, buildDownloadUrl, downloadMatrix, DownloadMatrixEntry, getArchitecture, Platform } from "../../download-helper";
import "./download.css"; import "./download.css";
import { usePageTitle } from "../../hooks"; import { usePageTitle } from "../../hooks";
import Button, { Link } from "../../components/Button";
export default function DownloadPage() { export default function DownloadPage() {
const [ currentArch, setCurrentArch ] = useState(getArchitecture()); const [ currentArch, setCurrentArch ] = useState(getArchitecture());
@ -54,11 +55,19 @@ export function DownloadCard({ app, arch, entry: [ platform, entry ] }: { app: A
{unwrapText(entry.description)} {unwrapText(entry.description)}
<div class="download-options"> <div class="download-options">
<a className="recommended" href={buildDownloadUrl(app, platform as Platform, recommendedDownload[0], arch)}>{recommendedDownload[1].name}</a> <Button
className="recommended"
href={buildDownloadUrl(app, platform as Platform, recommendedDownload[0], arch)}
text={recommendedDownload[1].name}
/>
<div class="other-options"> <div class="other-options">
{restDownloads.map(download => ( {restDownloads.map(download => (
<a href={buildDownloadUrl(app, platform as Platform, download[0], arch)}>{download[1].name}</a> <Link
href={buildDownloadUrl(app, platform as Platform, download[0], arch)}
>
{download[1].name}
</Link>
))} ))}
</div> </div>
</div> </div>