diff --git a/src/app/components/Lobby.tsx b/src/app/components/Lobby.tsx
index 774c81a..f4f4a19 100644
--- a/src/app/components/Lobby.tsx
+++ b/src/app/components/Lobby.tsx
@@ -66,8 +66,8 @@ export default function Lobby ( { player }: { player: string } )
.map( ( player, i ) =>
{
const playerClass =
- "player flex flex-row justify-between items-center my-2 min-w-56 w-full max-w-[400px] bg-opacity-50 rounded-xl shadow-md " +
- ( teamId === 100 ? "bg-sky-800" : "bg-red-800" );
+ "player flex flex-row justify-between items-center my-2 min-w-56 w-full max-w-[400px] rounded-xl shadow-md " +
+ ( teamId === 100 ? "bg-sky-800-50" : "bg-red-800-50" );
return (
diff --git a/src/app/globals.css b/src/app/globals.css
index 1cad67e..0c1f945 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -19,12 +19,14 @@ body {
}
@theme {
- --color-red-600: #e7000b;
- --color-red-800: #9f0712;
- --color-sky-600: #0084d1;
- --color-sky-800: #00598a;
- --color-gray-200: #e5e7eb;
- --color-gray-300: #d1d5dc;
+ --color-red-600: rgba(231, 0, 11, 1);
+ --color-red-800: rgba(159, 7, 18, 1);
+ --color-red-800-50: rgba(159, 7, 18, 0.5);
+ --color-sky-600: rgba(0, 132, 209, 1);
+ --color-sky-800: rgba(0, 89, 138, 1);
+ --color-sky-800-50: rgba(0, 89, 138, 0.5);
+ --color-gray-200: rgba(229, 231, 235, 1);
+ --color-gray-300: rgba(209, 213, 220, 1);
}
@keyframes slideInOut {
@@ -46,11 +48,11 @@ body {
}
.ring-4-red-600 {
- box-shadow: 0 0 0 4px #e7000b;
+ box-shadow: 0 0 0 4px rgba(231, 0, 11, 1);
}
.ring-4-sky-600 {
- box-shadow: 0 0 0 4px #0084d1;
+ box-shadow: 0 0 0 4px rgba(0, 132, 209, 1);
}
.scaler-200 {
diff --git a/src/app/lib/utils.ts b/src/app/lib/utils.ts
index da37d06..ee62736 100644
--- a/src/app/lib/utils.ts
+++ b/src/app/lib/utils.ts
@@ -102,7 +102,7 @@ export async function fetchRankedStats ( summonerId: string )
};
}
-export async function fetchMatches ( puuid: string )
+export async function fetchSixMatches ( puuid: string )
{
const idsRes = await fetch(
`https://${ REGION_GROUP }.api.riotgames.com/lol/match/v5/matches/by-puuid/${ puuid }/ids?queue=420&count=6`,
@@ -135,13 +135,46 @@ export async function fetchMatches ( puuid: string )
return matches;
}
+export async function fetchMatches ( puuid: string )
+{
+ const idsRes = await fetch(
+ `https://${ REGION_GROUP }.api.riotgames.com/lol/match/v5/matches/by-puuid/${ puuid }/ids?queue=420`,
+ { headers }
+ );
+ if ( !idsRes.ok ) throw new Error( "Match list fetch failed" );
+
+ const matchIds = await idsRes.json();
+
+ const matches = await Promise.all(
+ matchIds.map( async ( matchId: string ) =>
+ {
+ const res = await fetch(
+ `https://${ REGION_GROUP }.api.riotgames.com/lol/match/v5/matches/${ matchId }`,
+ { headers }
+ );
+ const match = await res.json();
+ const participant = match.info.participants.find( ( p: any ) => p.puuid === puuid );
+ return {
+ matchId,
+ kills: participant.kills,
+ deaths: participant.deaths,
+ assists: participant.assists,
+ championImg: getChampionSquare( participant.championId ),
+ win: participant.win,
+ isOld: isOlderThanHoursAgo( match.info.gameCreation, 12 ),
+ };
+ } )
+ );
+
+ return matches;
+}
export async function getRankedData ( name: string, tag: string )
{
const account = await fetchAccount( name, tag );
const summoner = await fetchSummoner( account.puuid );
const [ matches, rankedStats ] = await Promise.all( [
- fetchMatches( account.puuid ),
+ fetchSixMatches( account.puuid ),
fetchRankedStats( summoner.id ),
] );
diff --git a/src/app/page.tsx b/src/app/page.tsx
index e8398fd..e529b9e 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -4,10 +4,10 @@ export default function Page ()
return (
<>