Fascinated/scoresaber-reloaded-v2
1
2
Fork 0
Code Issues 1 Pull Requests 10 Actions Activity

update pp-blue and more accessibility stuff
All checks were successful
deploy / deploy (push) Successful in 53s
Details

Browse Source
This commit is contained in:
Lee 2023-10-27 23:16:31 +01:00
parent 2f333e26b8
commit 91a88d8f28
4 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Avatar.tsx
View File

@ -22,6 +22,7 @@ export default function Avatar({
src={url} src={url}
width={size} width={size}
height={size} height={size}
priority
/> />
</> </>
); );

8
src/components/Pagination.tsx
View File

@ -31,7 +31,7 @@ export default function Pagination(props: PaginationProps) {
<button <button
className="px-3 py-1" className="px-3 py-1"
onClick={() => onPageChange(currentPage - 1)} onClick={() => onPageChange(currentPage - 1)}
aria-label="Previous Page" aria-label={`Page ${currentPage - 1} (previous page)`}
> >
<ArrowUturnLeftIcon width={20} height={20} /> <ArrowUturnLeftIcon width={20} height={20} />
</button> </button>
@ -44,7 +44,7 @@ export default function Pagination(props: PaginationProps) {
<button <button
className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80" className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80"
onClick={() => onPageChange(1)} onClick={() => onPageChange(1)}
aria-label="First Page" aria-label="Page 1 (first page)"
> >
1 1
</button> </button>
@ -81,7 +81,7 @@ export default function Pagination(props: PaginationProps) {
<button <button
className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80" className="rounded-md bg-neutral-700 px-3 py-1 hover:opacity-80"
onClick={() => onPageChange(totalPages)} onClick={() => onPageChange(totalPages)}
aria-label="Last Page" aria-label={`Page ${totalPages} (last page)`}
> >
{totalPages} {totalPages}
</button> </button>
@ -94,7 +94,7 @@ export default function Pagination(props: PaginationProps) {
<button <button
className="px-3 py-1" className="px-3 py-1"
onClick={() => onPageChange(currentPage + 1)} onClick={() => onPageChange(currentPage + 1)}
aria-label="Next Page" aria-label={`Page ${currentPage + 1} (next page)`}
> >
<ArrowUturnRightIcon width={20} height={20} /> <ArrowUturnRightIcon width={20} height={20} />
</button> </button>

9
src/components/player/PlayerInfo.tsx
View File

@ -192,13 +192,14 @@ export default function PlayerInfo({ playerData }: PlayerInfoProps) {
countryCode={playerData.country} countryCode={playerData.country}
svg svg
className="!h-7 !w-7" className="!h-7 !w-7"
alt="Country Flag"
/> />
<p>#{formatNumber(playerData.countryRank)}</p> <p>#{formatNumber(playerData.countryRank)}</p>
</a> </a>
</div> </div>
{/* PP */} {/* PP */}
<div className="text-pp-blue flex items-center"> <div className="flex items-center text-pp-blue">
<p>{formatNumber(playerData.pp)}pp</p> <p>{formatNumber(playerData.pp)}pp</p>
</div> </div>
</div> </div>
@ -237,7 +238,7 @@ export default function PlayerInfo({ playerData }: PlayerInfoProps) {
<> <>
<Label <Label
title="Top PP" title="Top PP"
className="bg-[#8992e8]" className="bg-pp-blue"
hoverValue="Highest pp play" hoverValue="Highest pp play"
value={`${formatNumber( value={`${formatNumber(
getHighestPpPlay(playerId)?.toFixed(2), getHighestPpPlay(playerId)?.toFixed(2),
@ -245,7 +246,7 @@ export default function PlayerInfo({ playerData }: PlayerInfoProps) {
/> />
<Label <Label
title="Avg PP" title="Avg PP"
className="bg-[#8992e8]" className="bg-pp-blue"
hoverValue="Average amount of pp per play (best 20 scores)" hoverValue="Average amount of pp per play (best 20 scores)"
value={`${formatNumber( value={`${formatNumber(
getAveragePp(playerId)?.toFixed(2), getAveragePp(playerId)?.toFixed(2),
@ -253,7 +254,7 @@ export default function PlayerInfo({ playerData }: PlayerInfoProps) {
/> />
<Label <Label
title="+ 1pp" title="+ 1pp"
className="bg-[#8992e8]" className="bg-pp-blue"
hoverValue="Amount of raw pp required to increase your global pp by 1pp" hoverValue="Amount of raw pp required to increase your global pp by 1pp"
value={`${formatNumber( value={`${formatNumber(
calcPpBoundary(playerId, 1)?.toFixed(2), calcPpBoundary(playerId, 1)?.toFixed(2),

3
tailwind.config.ts
View File

@ -15,6 +15,9 @@ const config: Config = {
"gradient-conic": "gradient-conic":
"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))", "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
}, },
backgroundColor: {
"pp-blue": "#5763c9",
},
textColor: { textColor: {
"pp-blue": "#9fa8f3", "pp-blue": "#9fa8f3",
}, },