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

fix vs for mobile
All checks were successful
Deploy Website / docker (ubuntu-latest) (push) Successful in 2m21s
Details

Browse Source
This commit is contained in:
Lee 2024-10-28 16:33:21 +00:00
parent 0ec1fc9d41
commit c1f33578d7
2 changed files with 42 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
projects/website/src/components/score/score-rank-info.tsx
View File

@ -5,7 +5,7 @@ import { getPageFromRank } from "@ssr/common/utils/utils";
import { ScoreSaberScore } from "@ssr/common/model/score/impl/scoresaber-score"; import { ScoreSaberScore } from "@ssr/common/model/score/impl/scoresaber-score";
import ScoreSaberLeaderboard from "@ssr/common/model/leaderboard/impl/scoresaber-leaderboard"; import ScoreSaberLeaderboard from "@ssr/common/model/leaderboard/impl/scoresaber-leaderboard";
import { ScoreTimeSet } from "@/components/score/score-time-set"; import { ScoreTimeSet } from "@/components/score/score-time-set";
import { timeAgo } from "@ssr/common/utils/time-utils"; import { ScoreTimeSetVs } from "@/components/score/score-time-set-vs";
type Props = { type Props = {
score: ScoreSaberScore; score: ScoreSaberScore;
@ -23,13 +23,10 @@ export default function ScoreRankInfo({ score, leaderboard }: Props) {
</p> </p>
</Link> </Link>
</div> </div>
<ScoreTimeSet score={score} /> <div className="flex items-center gap-2 lg:flex-col lg:gap-0">
{score.previousScore?.timestamp && ( <ScoreTimeSet score={score} />
<div className="text-xs text-gray-400 flex flex-row gap-2 items-center"> <ScoreTimeSetVs score={score} />
<p>vs</p> </div>
<p>{timeAgo(new Date(score.previousScore.timestamp))}</p>
</div>
)}
</div> </div>
); );
} }

37
projects/website/src/components/score/score-time-set-vs.tsx Normal file
View File

@ -0,0 +1,37 @@
import { format } from "@formkit/tempo";
import { timeAgo } from "@ssr/common/utils/time-utils";
import Tooltip from "@/components/tooltip";
import { ScoreSaberScore } from "@ssr/common/model/score/impl/scoresaber-score";
type ScoreTimeSetProps = {
/**
* The score that was set.
*/
score: ScoreSaberScore;
};
export function ScoreTimeSetVs({ score }: ScoreTimeSetProps) {
if (!score.previousScore) {
return undefined;
}
return (
<Tooltip
display={
<p>
{format({
date: new Date(score.timestamp),
format: "DD MMMM YYYY HH:mm a",
})}
</p>
}
>
<div>
<div className="text-xs text-gray-400 flex flex-row gap-2 items-center">
<p>vs</p>
<p>{timeAgo(new Date(score.previousScore.timestamp))}</p>
</div>
</div>
</Tooltip>
);
}