diff --git a/website/src/components/RankItem.tsx b/website/src/components/RankItem.tsx new file mode 100644 index 00000000..3ba9da70 --- /dev/null +++ b/website/src/components/RankItem.tsx @@ -0,0 +1,12 @@ +const RankItem = ({ username, score }) => { + return ( +
+
1
+
@username
+
20.5
+
gold
+
+ ); +}; + +export default RankItem; diff --git a/website/src/pages/leaderboard/score-leaderboard.tsx b/website/src/pages/leaderboard/score-leaderboard.tsx new file mode 100644 index 00000000..f33cb968 --- /dev/null +++ b/website/src/pages/leaderboard/score-leaderboard.tsx @@ -0,0 +1,54 @@ +import RankItem from "@/components/RankItem"; +import { BarsArrowUpIcon, BarsArrowDownIcon } from "@heroicons/react/24/solid"; +import Image from "next/image"; +import { HiBarsArrowUp, HiBarsArrowDown } from "react-icons/hi2"; + +const LeaderBoard = () => { + const PlaceHolderProps = { username: "test_user", score: 10 }; + return ( +
+
+
+
+
LeaderBoard
+
+
+
+
+

Rank

+
+
+ +
+
+
+
+

User

+
+
+ +
+
+
+
+

Score

+
+
+ +
+
+
+
+

Medal

+
+
+
+ {/* leaderboard items */} + +
+
+
+ ); +}; + +export default LeaderBoard;