andre/olympics-calendar
1
0
Fork 0
mirror of https://github.com/fabrice404/olympics-calendar.git synced 2026-02-14 04:09:05 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

add nocs to live events page
Some checks failed
Build / Build (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Fabrice LAMANT
2026-02-05 16:59:50 +01:00
parent d01d063b17
commit 740604b280
2 changed files with 25 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
ui/app/flag.tsx
View File

@ -1,4 +1,4 @@
export default function Flag({ iso3, name }: { iso3: string; name: string }) {
export default function Flag({ iso3, name, size }: { iso3: string; name: string, size?: "sm" }) {
const iso3to2: { [key: string]: string } = {
AFG: "AF",
@ -259,9 +259,10 @@ export default function Flag({ iso3, name }: { iso3: string; name: string }) {
const iso2 = (iso3to2[iso3.toUpperCase()] || "").toLowerCase();
const className = size === "sm" ? 'inline-block h-3 mr-1' : 'inline-block h-5 mr-1 border-1 border-gray-300';
return <img
alt={name}
className="inline-block mr-1 h-5 border-1 border-gray-300"
className={className}
src={`https://gstatic.olympics.com/s3/noc/oly/3x2/${iso3.toUpperCase()}.png`}
title={name}
/>

25
ui/app/page.tsx
View File

@ -283,20 +283,39 @@ export default function Home() {
);
}
let nocs = <></>;
if (event.nocs.length > 0 && event.competitors.length !== 2) {
nocs = (
<div>
{
event.nocs.toSorted((a, b) => a.localeCompare(b)).map((nocKey) => {
const noc = data.nocs.find(noc => noc.key === nocKey);
if (!noc) return null;
return (
<Flag key={nocKey} iso3={noc.key} name={translate(noc.name)} size="sm" />
);
})
}
</div>
);
}
return (
<div key={event.key}>
{dayHeader}
<div className="p-2 m-2 my-4 bg-white rounded-md md:w-3/4 md:mx-auto">
<div className={`fg-${getColor(i)} ${suseMono.className} text-right font-bold align-top inline-block tabular-nums pr-2`}>
<div className="flex p-2 m-2 my-4 bg-white rounded-md md:w-3/4 md:mx-auto">
<div className={`flex-none fg-${getColor(i)} ${suseMono.className} text-right font-bold align-top inline-block tabular-nums pr-2`}>
<span className="text-xl">{startHours}:{startMinutes}</span>
<div className="text-xs">{endHours}:{endMinutes}</div>
</div>
<div className="align-top inline-block text-black pl-2 border-l border-slate-900/10">
<div className="shrink align-top inline-block text-black pl-2 border-l border-slate-900/10">
<div className="font-bold">
{translate(data.sports.find(sport => sport.key === event.sport)?.name || {})}
</div>
<div className={`inline-block font-bold text-sm ${titleColor}`}>{translate(event.name)}</div>
{competitors}
{nocs}
</div>
</div>
</div>