gabehf/Koito
1
0
Fork 0
mirror of https://github.com/gabehf/Koito.git synced 2026-04-22 12:01:52 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

add header, adjust ui

Browse source
This commit is contained in:
Gabe Farrell 2025-12-31 17:53:00 -05:00
parent 442221327d
commit 9b7e68487d
4 changed files with 9 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/app/components/rewind/Rewind.tsx
View file

@ -38,7 +38,7 @@ export default function Rewind(props: Props) {
includeTime={props.includeTime}
/>
<div className="grid grid-cols-3 gap-5">
<div className="grid grid-cols-3 gap-y-5">
<RewindStatText
figure={`${props.stats.minutes_listened}`}
text="Minutes listened"

2
client/app/components/rewind/RewindStatText.tsx
View file

@ -6,7 +6,7 @@ interface Props {
export default function RewindStatText(props: Props) {
return (
<div className="flex items-baseline gap-1.5">
<div className="w-20 text-end shrink-0">
<div className="w-23 text-end shrink-0">
<span
className="
relative inline-block

2
client/app/components/rewind/RewindTopItem.tsx
View file

@ -20,7 +20,7 @@ export function RewindTopItem<
return (
<div className="flex gap-5">
<div className="rewind-top-item-image">
<img className="w-50 h-50" src={imageSrc} />
<img className="max-w-48 max-h-48" src={imageSrc} />
</div>
<div className="flex flex-col gap-1">

7
client/app/routes/RewindPage.tsx
View file

@ -12,5 +12,10 @@ export default function RewindPage() {
useEffect(() => {
getRewindStats({ year: 2025 }).then((r) => setStats(r));
}, []);
return <>{stats !== undefined && <Rewind stats={stats} />}</>;
return (
<div className="flex flex-col items-start">
<h2 className="mt-12">Your 2025 Rewind</h2>
{stats !== undefined && <Rewind stats={stats} />}
</div>
);
}