Fascinated/scoresaber-reloadedv3
Archived
1
1
Fork 0
Code Issues 1 Pull Requests 2 Actions Packages Activity

update score badge tooltips
Some checks failed
Deploy Website / docker (ubuntu-latest) (push) Failing after 1m2s
Details

Browse Source
This commit is contained in:
Lee 2024-10-20 13:49:14 +01:00
parent 511f56af91
commit d806907604
2 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
projects/website/src/components/score/badges/full-combo.tsx
View File

@ -8,9 +8,10 @@ export default function FullComboBadge({ score }: ScoreBadgeProps) {
return (
<Tooltip
display={
<div className="flex flex-col justify-center items-center">
<div className="flex flex-col">
{!score.fullCombo ? (
<>
<p className="font-semibold">Misses</p>
<p>Missed Notes: {formatNumberWithCommas(score.missedNotes)}</p>
<p>Bad Cuts: {formatNumberWithCommas(score.badCuts)}</p>
</>

7
projects/website/src/components/score/score-stats.tsx
View File

@ -27,6 +27,8 @@ const badges: ScoreBadge[] = [
<Tooltip
display={
<div>
<p className="font-semibold">Performance Points</p>
<p>Raw: {formatPp(pp)}pp</p>
<p>
Weighted: {formatPp(weightedPp)}pp ({(100 * weight).toFixed(2)}%)
</p>
@ -48,7 +50,7 @@ const badges: ScoreBadge[] = [
create: (score: ScoreSaberScore, leaderboard: ScoreSaberLeaderboard) => {
const acc = (score.score / leaderboard.maxScore) * 100;
const scoreBadge = getScoreBadgeFromAccuracy(acc);
let accDetails = `Accuracy ${scoreBadge.name != "-" ? scoreBadge.name : ""}`;
let accDetails = `${scoreBadge.name != "-" ? scoreBadge.name : ""}`;
if (scoreBadge.max == null) {
accDetails += ` (> ${scoreBadge.min}%)`;
} else if (scoreBadge.min == null) {
@ -65,8 +67,8 @@ const badges: ScoreBadge[] = [
display={
<div className="flex flex-col gap-2">
<div>
<p className="font-semibold">Accuracy</p>
<p>{accDetails}</p>
{failed && <p className="text-red-500">Failed</p>}
</div>
{modCount > 0 && (
@ -75,6 +77,7 @@ const badges: ScoreBadge[] = [
<ScoreModifiers type="full" score={score} />
</div>
)}
{failed && <p className="text-red-500">Failed</p>}
</div>
}
>