Compare commits
2 commits
269ab8c99f
...
27dbd26459
| Author | SHA1 | Date | |
|---|---|---|---|
| 27dbd26459 | |||
| e32c22dc10 |
3 changed files with 22 additions and 9 deletions
|
|
@ -4,13 +4,7 @@
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta name="theme-color" content="#000000" />
|
<meta name="theme-color" content="#000000" />
|
||||||
<meta
|
<title>Personal Website</title>
|
||||||
name="description"
|
|
||||||
content="Web site created using create-tsrouter-app"
|
|
||||||
/>
|
|
||||||
<link rel="apple-touch-icon" href="/logo192.png" />
|
|
||||||
<link rel="manifest" href="/manifest.json" />
|
|
||||||
<title>Create TanStack App - academic</title>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|
|
||||||
|
|
@ -9,6 +9,24 @@ interface Props {
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function Card({ title, content, id, downloads }: Props) {
|
export default function Card({ title, content, id, downloads }: Props) {
|
||||||
|
function download(path: URL, fileName = 'file') {
|
||||||
|
fetch(path)
|
||||||
|
.then((response) => response.blob())
|
||||||
|
.then((blob) => {
|
||||||
|
const url = window.URL.createObjectURL(new Blob([blob]))
|
||||||
|
|
||||||
|
const link = document.createElement('a')
|
||||||
|
link.href = url
|
||||||
|
link.download = fileName
|
||||||
|
|
||||||
|
document.body.appendChild(link)
|
||||||
|
|
||||||
|
link.click()
|
||||||
|
|
||||||
|
link.parentNode?.removeChild(link)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="bg-[#161718] w-lg p-5 flex flex-col gap-5 rounded-xl self-center">
|
<div className="bg-[#161718] w-lg p-5 flex flex-col gap-5 rounded-xl self-center">
|
||||||
<h1 className="text-white text-2xl font-bold" id={id?.toString()}>
|
<h1 className="text-white text-2xl font-bold" id={id?.toString()}>
|
||||||
|
|
@ -24,10 +42,11 @@ export default function Card({ title, content, id, downloads }: Props) {
|
||||||
{downloads.map((e, i) => (
|
{downloads.map((e, i) => (
|
||||||
<li>
|
<li>
|
||||||
<a
|
<a
|
||||||
href={e.link}
|
href={e.link.toString()}
|
||||||
key={i}
|
key={i}
|
||||||
download={e.filename}
|
download={e.filename}
|
||||||
className="text-sky-600 underline"
|
className="text-sky-600 underline"
|
||||||
|
onClick={() => download(e.link, e.filename)}
|
||||||
>
|
>
|
||||||
{e.title}
|
{e.title}
|
||||||
</a>
|
</a>
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
export type CardDownloadType = {
|
export type CardDownloadType = {
|
||||||
title: string
|
title: string
|
||||||
filename: string
|
filename: string
|
||||||
link: string
|
link: URL
|
||||||
}
|
}
|
||||||
|
|
||||||
export type CardType = {
|
export type CardType = {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue