Changes

- Added 'curl' and 'wget' commands. TODO: Add feedback when user clicks on them to copy (probably need a not bajillion years outdated Inkscape with icons that aren't completely broken first though :/)
- Fixed some light theme issues
- Fixed some sizing issues on mobile
- Download button actually works now

src/app/[...file]/page.tsx

@@ -1,9 +1,11 @@
 import type { Metadata, ResolvingMetadata } from 'next';
 import Image from 'next/image';
 
+import DownloadTTY from './download_tty';
 import Content from './content';
 import * as style from './page.css';
-import download_image from './download.svg';
+import download_image_dark from './download_dark.svg';
+import download_image_light from './download_light.svg';
 
 type SearchParams = { [key: string]: string | string[] | undefined };
 
@@ -34,6 +36,12 @@ export default async function Page({
 }: Props) {
 	const path = get_path(params.file);
 	const root = `https://${get_root(searchParams)}/`;
+	const full = `${root}${path}`;
+
+	const download_ttys = [
+		`curl -O ${root}${path}`,
+		`wget ${root}${path}`,
+	];
 
 	return (
 		<div className={style.root}>
@@ -44,13 +52,23 @@ export default async function Page({
 						<p className={style.title}>{path}</p>
 					</div>
 					<button className={style.download_button}>
-						<Image
-							className={style.download_button_image}
-							src={download_image}
-							alt="Download Button"
-						/>
+						<a className={style.download_link} href={full} download>
+							<Image
+								className={style.download_button_image_dark}
+								src={download_image_dark}
+								alt="Download Button"
+							/>
+							<Image
+								className={style.download_button_image_light}
+								src={download_image_light}
+								alt="Download Button"
+							/>
+						</a>
 					</button>
 				</div>
+				<div className={style.download_tty_group}>
+					{download_ttys.map((text, index) => <DownloadTTY key={index} text={text} />)}
+				</div>
 				<Content src={`${root}${path}`} />
 			</div>
 		</div>