Taevas/taevas.xyz
Taevas/taevas.xyz
1
0
Fork 0
Code Issues Pull requests Projects Activity

Minor adjustments

Browse source
This commit is contained in:
Taevas 2023-05-12 14:05:58 +02:00
parent fee3766c2b
commit 4f76b65fd4
4 changed files with 46 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

3
netlify/functions/shared/api.ts
View file

@ -4,7 +4,8 @@ export async function api<T>(url: string): Promise<T> {
return fetch(url) return fetch(url)
.then(response => { .then(response => {
if (!response.ok) { if (!response.ok) {
throw new Error(response.statusText) console.error(response.status, response.statusText)
throw new Error("Request failed :(")
} }
return response.json() as Promise<T> return response.json() as Promise<T>
}) })

26
src/App.css
View file

@ -16,6 +16,10 @@ body {
color: #fff; color: #fff;
} }
p {
line-height: 1rem;
}
.info_container { .info_container {
display: inline-block; display: inline-block;
position: absolute; position: absolute;
@ -24,7 +28,7 @@ body {
} }
.info_container > * { .info_container > * {
border: 3px solid white; border: 3px solid #fff;
margin: 20px; margin: 20px;
width: 300px; width: 300px;
} }
@ -40,7 +44,7 @@ body {
.info_description { .info_description {
padding-top: 10px; padding-top: 10px;
border-right: 3px solid white; border-right: 3px solid #fff;
font-weight: bold; font-weight: bold;
font-size: 24px; font-size: 24px;
letter-spacing: -5px; letter-spacing: -5px;
@ -55,3 +59,21 @@ body {
width: 220px !important; width: 220px !important;
margin: 0; margin: 0;
} }
.button_link {
line-height: 40px;
font-size: 18px;
font-weight: bold;
width: 150px;
background-color: #020355;
border: 3px solid #fff;
color: #fff;
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 16px;
}
.button_link:hover {
background-color: #004;
}

17
src/components/Lastfm.tsx
View file

@ -30,15 +30,16 @@ export default function Lastfm() {
link="https://www.last.fm/user/TTTaevas" link="https://www.last.fm/user/TTTaevas"
description="Music" description="Music"
elements={[ elements={[
<a href={lastfm.url} target="_blank" className="flex"> <div className="flex mx-auto">
<img alt="album thumbnail" src={lastfm.image} className="my-auto mx-auto h-2/5 w-2/5"></img> <img alt="album thumbnail" src={lastfm.image} className="my-auto h-2/5 w-2/5"></img>
<div className="my-auto mx-auto w-min"> <div className="my-auto ml-4 w-fit text-left">
<p className="leading-4 mb-2"><strong>{lastfm.artist}</strong></p> <p className="mb-2"><strong>{lastfm.artist}</strong></p>
<p className="leading-4 mt-2"><strong>{lastfm.name}</strong></p> <p className="mt-2"><strong>{lastfm.name}</strong></p>
</div> </div>
</a>, </div>,
<p><strong>{lastfm.album}</strong></p>, <p className="mt-2"><strong>{lastfm.album}</strong></p>,
<p>{lastfm.listening ? "(Currently listening!)" : "(Last listened)"}</p> <p className="mt-4">{lastfm.listening ? "(Currently listening!)" : "(Last listened)"}</p>,
<a className="button_link" href={lastfm.url} target="_blank">Music Details</a>
]} ]}
/> />
) )

18
src/components/Speedruncom.tsx
View file

@ -25,8 +25,7 @@ export default function Speedruncom() {
return <></> return <></>
} }
let game = speedruncom.game let details = speedruncom.details.map((d) => <p>{d}</p>)
speedruncom.details.forEach((d) => game += ` - ${d}`)
return ( return (
<Info <Info
@ -34,11 +33,16 @@ export default function Speedruncom() {
link="https://www.speedrun.com/Taevas/" link="https://www.speedrun.com/Taevas/"
description="Speedrun" description="Speedrun"
elements={[ elements={[
<a href={speedruncom.link} target="_blank" className="p-0"> <div className="flex">
<img alt="game thumbnail" src={speedruncom.thumbnail} className="h-32 mx-auto mb-2"></img> <img alt="game thumbnail" src={speedruncom.thumbnail} className="h-32 my-auto mb-2"></img>
<p className="leading-5"><strong>#{speedruncom.place}</strong> on <strong>{game}</strong></p> <div className="my-auto ml-2">
</a>, <p className="mb-2">Placed <strong>#{speedruncom.place}</strong> on:</p>
<p className="mt-2"><strong>{speedruncom.date}</strong></p> <p><strong>{speedruncom.game}</strong></p>
{details}
</div>
</div>,
<p className="mt-2"><strong>{speedruncom.date}</strong></p>,
<a className="button_link" href={speedruncom.link} target="_blank">Run Details</a>
]} ]}
/> />
) )