From e6c4f49c5dc5fa899bf563bee117105fab30bdb1 Mon Sep 17 00:00:00 2001 From: a-jason-liu21 Date: Mon, 4 Jul 2022 16:19:20 +1000 Subject: [PATCH 1/8] added leaderboard page with test data --- frontend/src/App.module.css | 29 ++++++++++ .../components/leaderboard/UserProfile.tsx | 25 +++++++++ frontend/src/pages/Leaderboard.tsx | 56 ++++++++++++++++--- 3 files changed, 103 insertions(+), 7 deletions(-) create mode 100644 frontend/src/components/leaderboard/UserProfile.tsx diff --git a/frontend/src/App.module.css b/frontend/src/App.module.css index 2cc1179..8a9121e 100644 --- a/frontend/src/App.module.css +++ b/frontend/src/App.module.css @@ -6,6 +6,7 @@ body { left: 0; width: 100%; height: 100%; + min-width: 60em; } /* --------------------------------------------------------- HELPER STYLES ---------------------------------------------------------*/ @@ -76,4 +77,32 @@ body { .aboutPage { padding: 20px; +} + +/* --------------------------------------------------------- LEADERBOARD PAGE STYLES ---------------------------------------------------*/ + +.leaderboardPage { + padding-left: 20px; +} + +.userProfile { + font-family: monospace; +} + +.profileText { + white-space: pre; + padding-right: 8px; +} + +.userImg { + padding-right: 4px; +} + +.userLinkText { + color: #009900; + text-decoration: none; +} + +.userNoLinkText { + padding-left: 24px; } \ No newline at end of file diff --git a/frontend/src/components/leaderboard/UserProfile.tsx b/frontend/src/components/leaderboard/UserProfile.tsx new file mode 100644 index 0000000..b7ba983 --- /dev/null +++ b/frontend/src/components/leaderboard/UserProfile.tsx @@ -0,0 +1,25 @@ +import React, { useEffect, useState } from "react"; +import styles from "../../App.module.css"; +import { UserDetails } from "../../pages/Leaderboard"; + +const UserProfile = (props: UserDetails) => { + return ( +
+ {(props.position.toString() + ")").padStart(4)} + {props.userScore.toString().padStart(4)} + {(props.userLink != "") + ? + + + + {props.userName} + + : + {props.userName} + + } +
+ ) +}; + +export default UserProfile; diff --git a/frontend/src/pages/Leaderboard.tsx b/frontend/src/pages/Leaderboard.tsx index d9c814f..4a4848c 100644 --- a/frontend/src/pages/Leaderboard.tsx +++ b/frontend/src/pages/Leaderboard.tsx @@ -1,11 +1,42 @@ import React, { useEffect, useState } from "react"; import { Button, Container } from "react-bootstrap"; import { useNavigate } from "react-router-dom"; +import styles from "../App.module.css"; +import UserProfile from "../components/leaderboard/UserProfile" import { BACKEND_URI } from "src/config"; +export interface UserDetails { + position: number; + userName: string; + userScore: number; + userLink: string; +} + const Leaderboard: React.FC<{}> = () => { - const [times, setTimes] = useState(0); + + const defaultUsers: UserDetails[] = [ + { + position: 1, + userName: "csesoc", + userScore: 9999, + userLink: "https://github.com/csesoc" + }, + { + position: 10, + userName: "no_github_link", + userScore: 999, + userLink: "" + }, + { + position: 100, + userName: "a-jason-liu21", + userScore: 99, + userLink: "https://github.com/a-jason-liu21" + } + ] + + const [users, setUsers] = useState(defaultUsers); useEffect(() => { const verifyToken = async () => { @@ -16,12 +47,23 @@ const Leaderboard: React.FC<{}> = () => { }, []); return ( - <> - -

You have clicked this button {times} times.

- -
- +
+
+ This is the overall leaderboard for the CSESoc Unnamed Puzzle Competition 2021, + which displays the users with the highest cumulative points achieved during the contest. +
+
+ +
+ Points awarded for completing problems - the first to solve a problem receives 100 points, followed by 99 points for + the second solver, then 98 and so on down to 1 point for the 100th solver. +
+
+ + {users.map((user: UserDetails) => { + return + })} +
) }; From f44f1c1b9be9e719a5f34b4296555bec2ee66f18 Mon Sep 17 00:00:00 2001 From: a-jason-liu21 Date: Wed, 13 Jul 2022 11:36:32 +1000 Subject: [PATCH 2/8] added daily stats --- frontend/src/App.module.css | 21 ++++++++++++++-- .../components/leaderboard/UserProfile.tsx | 2 +- frontend/src/pages/Leaderboard.tsx | 24 ++++++++++++++++--- 3 files changed, 41 insertions(+), 6 deletions(-) diff --git a/frontend/src/App.module.css b/frontend/src/App.module.css index 8a9121e..bc2fd1f 100644 --- a/frontend/src/App.module.css +++ b/frontend/src/App.module.css @@ -83,6 +83,7 @@ body { .leaderboardPage { padding-left: 20px; + white-space: pre-wrap; } .userProfile { @@ -90,7 +91,6 @@ body { } .profileText { - white-space: pre; padding-right: 8px; } @@ -98,11 +98,28 @@ body { padding-right: 4px; } -.userLinkText { +.link { color: #009900; text-decoration: none; } +.dayLink { + color: #009900; + text-decoration: none; + cursor: pointer; + padding-left: 4px; +} + +.daySelected { + color: white; + font-weight: 700; + padding-left: 4px; +} + .userNoLinkText { padding-left: 24px; +} + +.leaderBoardDays { + padding-left: 4px; } \ No newline at end of file diff --git a/frontend/src/components/leaderboard/UserProfile.tsx b/frontend/src/components/leaderboard/UserProfile.tsx index b7ba983..5c52142 100644 --- a/frontend/src/components/leaderboard/UserProfile.tsx +++ b/frontend/src/components/leaderboard/UserProfile.tsx @@ -8,7 +8,7 @@ const UserProfile = (props: UserDetails) => { {(props.position.toString() + ")").padStart(4)} {props.userScore.toString().padStart(4)} {(props.userLink != "") - ? + ? diff --git a/frontend/src/pages/Leaderboard.tsx b/frontend/src/pages/Leaderboard.tsx index 4a4848c..47e5afe 100644 --- a/frontend/src/pages/Leaderboard.tsx +++ b/frontend/src/pages/Leaderboard.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useState } from "react"; import { Button, Container } from "react-bootstrap"; -import { useNavigate } from "react-router-dom"; +import { Navigate, useNavigate } from "react-router-dom"; import styles from "../App.module.css"; import UserProfile from "../components/leaderboard/UserProfile" @@ -36,7 +36,10 @@ const Leaderboard: React.FC<{}> = () => { } ] + const DAYS = 7; + const OVERALL = 0; const [users, setUsers] = useState(defaultUsers); + const [day, setDay] = useState(OVERALL); useEffect(() => { const verifyToken = async () => { @@ -46,11 +49,15 @@ const Leaderboard: React.FC<{}> = () => { verifyToken(); }, []); + useEffect(() => { + console.log("Doing backend query for day " + day + "!"); + }, [day]); + return (
- This is the overall leaderboard for the CSESoc Unnamed Puzzle Competition 2021, - which displays the users with the highest cumulative points achieved during the contest. + This is the {(day === OVERALL) ? "overall leaderboard" : ("leaderboard for day " + day)} of the CSESoc Unnamed Puzzle Competition 2021, + which displays the users with the {(day === OVERALL) ? "highest cumulative points achieved during the contest" : "earliest submissions during the day"}.

@@ -60,6 +67,17 @@ const Leaderboard: React.FC<{}> = () => {

+
+ To see the leaderboard for a particular day, choose a day here: + {Array.from({length: DAYS},(x, i) => setDay(i + 1)}>{i + 1})} +
+ + {day !== OVERALL && +
+ To see the overall leaderboard, click setDay(0)}>here. +
} +
+ {users.map((user: UserDetails) => { return })} From dd5e0cb725be9e5a52e8acdd87be015f9f7f724e Mon Sep 17 00:00:00 2001 From: a-jason-liu21 Date: Wed, 13 Jul 2022 11:41:39 +1000 Subject: [PATCH 3/8] undid min width css --- frontend/src/App.module.css | 1 - 1 file changed, 1 deletion(-) diff --git a/frontend/src/App.module.css b/frontend/src/App.module.css index bc2fd1f..55762ab 100644 --- a/frontend/src/App.module.css +++ b/frontend/src/App.module.css @@ -6,7 +6,6 @@ body { left: 0; width: 100%; height: 100%; - min-width: 60em; } /* --------------------------------------------------------- HELPER STYLES ---------------------------------------------------------*/ From 57fd5d4677b9a6c7dc7625da59fded1a97b505c4 Mon Sep 17 00:00:00 2001 From: a-jason-liu21 Date: Wed, 10 Aug 2022 00:28:00 +1000 Subject: [PATCH 4/8] worked on calendar page --- frontend/package-lock.json | 199 +- frontend/src/App.module.css | 53 +- frontend/src/App.tsx | 2 + frontend/src/pages/Calendar.tsx | 93 +- frontend/src/pages/Leaderboard.tsx | 2 - frontend/src/pages/Problem.tsx | 34 + .../src/pages/img/calendarImageColoured.png | Bin 0 -> 1413893 bytes frontend/src/pages/img/calendarImageMono.png | Bin 0 -> 590467 bytes frontend/src/pages/img/starColoured.png | Bin 0 -> 1878 bytes frontend/src/pages/img/starMono.png | Bin 0 -> 1879 bytes frontend/yarn.lock | 18305 ++++++++-------- 11 files changed, 9641 insertions(+), 9047 deletions(-) create mode 100644 frontend/src/pages/Problem.tsx create mode 100644 frontend/src/pages/img/calendarImageColoured.png create mode 100644 frontend/src/pages/img/calendarImageMono.png create mode 100644 frontend/src/pages/img/starColoured.png create mode 100644 frontend/src/pages/img/starMono.png diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 657e4e6..aa38ce0 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -15,12 +15,14 @@ "@zxcvbn-ts/language-common": "2.0.1", "@zxcvbn-ts/language-en": "2.0.1", "bootstrap": "5.1.3", + "nodemon": "^2.0.16", "react": "17.0.2", "react-bootstrap": "2.4.0", "react-dom": "17.0.2", "react-router-dom": "6.3.0", "react-scripts": "5.0.1", - "styled-components": "5.3.5" + "styled-components": "5.3.5", + "typescript": "^4.7.2" } }, "node_modules/@ampproject/remapping": { @@ -4104,6 +4106,11 @@ "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz", "integrity": "sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==" }, + "node_modules/abbrev": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", + "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==" + }, "node_modules/accepts": { "version": "1.3.8", "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz", @@ -8388,6 +8395,11 @@ "node": ">= 4" } }, + "node_modules/ignore-by-default": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/ignore-by-default/-/ignore-by-default-1.0.1.tgz", + "integrity": "sha512-Ius2VYcGNk7T90CppJqcIkS5ooHUZyIQK+ClZfMfMNFEF9VSE73Fq+906u/CWu92x4gzZMWOwfFYckPObzdEbA==" + }, "node_modules/immer": { "version": "9.0.14", "resolved": "https://registry.npmjs.org/immer/-/immer-9.0.14.tgz", @@ -11460,6 +11472,64 @@ "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.5.tgz", "integrity": "sha512-U9h1NLROZTq9uE1SNffn6WuPDg8icmi3ns4rEl/oTfIle4iLjTliCzgTsbaIFMq/Xn078/lfY/BL0GWZ+psK4Q==" }, + "node_modules/nodemon": { + "version": "2.0.19", + "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.19.tgz", + "integrity": "sha512-4pv1f2bMDj0Eeg/MhGqxrtveeQ5/G/UVe9iO6uTZzjnRluSA4PVWf8CW99LUPwGB3eNIA7zUFoP77YuI7hOc0A==", + "hasInstallScript": true, + "dependencies": { + "chokidar": "^3.5.2", + "debug": "^3.2.7", + "ignore-by-default": "^1.0.1", + "minimatch": "^3.0.4", + "pstree.remy": "^1.1.8", + "semver": "^5.7.1", + "simple-update-notifier": "^1.0.7", + "supports-color": "^5.5.0", + "touch": "^3.1.0", + "undefsafe": "^2.0.5" + }, + "bin": { + "nodemon": "bin/nodemon.js" + }, + "engines": { + "node": ">=8.10.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/nodemon" + } + }, + "node_modules/nodemon/node_modules/debug": { + "version": "3.2.7", + "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz", + "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==", + "dependencies": { + "ms": "^2.1.1" + } + }, + "node_modules/nodemon/node_modules/semver": { + "version": "5.7.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", + "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==", + "bin": { + "semver": "bin/semver" + } + }, + "node_modules/nopt": { + "version": "1.0.10", + "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz", + "integrity": "sha512-NWmpvLSqUrgrAC9HCuxEvb+PSloHpqVu+FqcO4eeF2h5qYRhA7ev6KvelyQAKtegUbC6RypJnlEOhd8vloNKYg==", + "dependencies": { + "abbrev": "1" + }, + "bin": { + "nopt": "bin/nopt.js" + }, + "engines": { + "node": "*" + } + }, "node_modules/normalize-path": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", @@ -13269,6 +13339,11 @@ "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz", "integrity": "sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ==" }, + "node_modules/pstree.remy": { + "version": "1.1.8", + "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.8.tgz", + "integrity": "sha512-77DZwxQmxKnu3aR542U+X8FypNzbfJ+C5XQDk3uWjWxn6151aIMGthWYRXTqT1E5oJvg+ljaa2OJi+VfvCOQ8w==" + }, "node_modules/punycode": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz", @@ -14425,6 +14500,25 @@ "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz", "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==" }, + "node_modules/simple-update-notifier": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/simple-update-notifier/-/simple-update-notifier-1.0.7.tgz", + "integrity": "sha512-BBKgR84BJQJm6WjWFMHgLVuo61FBDSj1z/xSFUIozqO6wO7ii0JxCqlIud7Enr/+LhlbNI0whErq96P2qHNWew==", + "dependencies": { + "semver": "~7.0.0" + }, + "engines": { + "node": ">=8.10.0" + } + }, + "node_modules/simple-update-notifier/node_modules/semver": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.0.0.tgz", + "integrity": "sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A==", + "bin": { + "semver": "bin/semver.js" + } + }, "node_modules/sisteransi": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz", @@ -15166,6 +15260,17 @@ "node": ">=0.6" } }, + "node_modules/touch": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/touch/-/touch-3.1.0.tgz", + "integrity": "sha512-WBx8Uy5TLtOSRtIq+M03/sKDrXCLHxwDcquSP2c43Le03/9serjQBIztjRz6FkJez9D/hleyAXTBGLwwZUw9lA==", + "dependencies": { + "nopt": "~1.0.10" + }, + "bin": { + "nodetouch": "bin/nodetouch.js" + } + }, "node_modules/tough-cookie": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.0.0.tgz", @@ -15311,7 +15416,6 @@ "version": "4.7.3", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.3.tgz", "integrity": "sha512-WOkT3XYvrpXx4vMMqlD+8R8R37fZkjyLGlxavMc4iB8lrl8L0DeTcHbYgw/v0N/z9wAFsgBhcsF0ruoySS22mA==", - "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -15348,6 +15452,11 @@ "react": ">=15.0.0" } }, + "node_modules/undefsafe": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.5.tgz", + "integrity": "sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA==" + }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", @@ -19284,6 +19393,11 @@ "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz", "integrity": "sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==" }, + "abbrev": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", + "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==" + }, "accepts": { "version": "1.3.8", "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz", @@ -22401,6 +22515,11 @@ "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz", "integrity": "sha512-CmxgYGiEPCLhfLnpPp1MoRmifwEIOgjcHXxOBjv7mY96c+eWScsOP9c112ZyLdWHi0FxHjI+4uVhKYp/gcdRmQ==" }, + "ignore-by-default": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/ignore-by-default/-/ignore-by-default-1.0.1.tgz", + "integrity": "sha512-Ius2VYcGNk7T90CppJqcIkS5ooHUZyIQK+ClZfMfMNFEF9VSE73Fq+906u/CWu92x4gzZMWOwfFYckPObzdEbA==" + }, "immer": { "version": "9.0.14", "resolved": "https://registry.npmjs.org/immer/-/immer-9.0.14.tgz", @@ -24631,6 +24750,46 @@ "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.5.tgz", "integrity": "sha512-U9h1NLROZTq9uE1SNffn6WuPDg8icmi3ns4rEl/oTfIle4iLjTliCzgTsbaIFMq/Xn078/lfY/BL0GWZ+psK4Q==" }, + "nodemon": { + "version": "2.0.19", + "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.19.tgz", + "integrity": "sha512-4pv1f2bMDj0Eeg/MhGqxrtveeQ5/G/UVe9iO6uTZzjnRluSA4PVWf8CW99LUPwGB3eNIA7zUFoP77YuI7hOc0A==", + "requires": { + "chokidar": "^3.5.2", + "debug": "^3.2.7", + "ignore-by-default": "^1.0.1", + "minimatch": "^3.0.4", + "pstree.remy": "^1.1.8", + "semver": "^5.7.1", + "simple-update-notifier": "^1.0.7", + "supports-color": "^5.5.0", + "touch": "^3.1.0", + "undefsafe": "^2.0.5" + }, + "dependencies": { + "debug": { + "version": "3.2.7", + "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz", + "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==", + "requires": { + "ms": "^2.1.1" + } + }, + "semver": { + "version": "5.7.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", + "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==" + } + } + }, + "nopt": { + "version": "1.0.10", + "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz", + "integrity": "sha512-NWmpvLSqUrgrAC9HCuxEvb+PSloHpqVu+FqcO4eeF2h5qYRhA7ev6KvelyQAKtegUbC6RypJnlEOhd8vloNKYg==", + "requires": { + "abbrev": "1" + } + }, "normalize-path": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", @@ -25779,6 +25938,11 @@ "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz", "integrity": "sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ==" }, + "pstree.remy": { + "version": "1.1.8", + "resolved": "https://registry.npmjs.org/pstree.remy/-/pstree.remy-1.1.8.tgz", + "integrity": "sha512-77DZwxQmxKnu3aR542U+X8FypNzbfJ+C5XQDk3uWjWxn6151aIMGthWYRXTqT1E5oJvg+ljaa2OJi+VfvCOQ8w==" + }, "punycode": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz", @@ -26621,6 +26785,21 @@ "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz", "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==" }, + "simple-update-notifier": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/simple-update-notifier/-/simple-update-notifier-1.0.7.tgz", + "integrity": "sha512-BBKgR84BJQJm6WjWFMHgLVuo61FBDSj1z/xSFUIozqO6wO7ii0JxCqlIud7Enr/+LhlbNI0whErq96P2qHNWew==", + "requires": { + "semver": "~7.0.0" + }, + "dependencies": { + "semver": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.0.0.tgz", + "integrity": "sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A==" + } + } + }, "sisteransi": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz", @@ -27166,6 +27345,14 @@ "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz", "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==" }, + "touch": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/touch/-/touch-3.1.0.tgz", + "integrity": "sha512-WBx8Uy5TLtOSRtIq+M03/sKDrXCLHxwDcquSP2c43Le03/9serjQBIztjRz6FkJez9D/hleyAXTBGLwwZUw9lA==", + "requires": { + "nopt": "~1.0.10" + } + }, "tough-cookie": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.0.0.tgz", @@ -27280,8 +27467,7 @@ "typescript": { "version": "4.7.3", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.3.tgz", - "integrity": "sha512-WOkT3XYvrpXx4vMMqlD+8R8R37fZkjyLGlxavMc4iB8lrl8L0DeTcHbYgw/v0N/z9wAFsgBhcsF0ruoySS22mA==", - "peer": true + "integrity": "sha512-WOkT3XYvrpXx4vMMqlD+8R8R37fZkjyLGlxavMc4iB8lrl8L0DeTcHbYgw/v0N/z9wAFsgBhcsF0ruoySS22mA==" }, "unbox-primitive": { "version": "1.0.2", @@ -27305,6 +27491,11 @@ "react-lifecycles-compat": "^3.0.4" } }, + "undefsafe": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/undefsafe/-/undefsafe-2.0.5.tgz", + "integrity": "sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA==" + }, "unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", diff --git a/frontend/src/App.module.css b/frontend/src/App.module.css index 2ca59f2..a797dd6 100644 --- a/frontend/src/App.module.css +++ b/frontend/src/App.module.css @@ -1,4 +1,3 @@ -<<<<<<< HEAD body { font-size: 20px; color: #bdbcc1; @@ -85,6 +84,58 @@ body { padding: 20px; } +.calendarPage { + display: flex; + flex-direction: row; + padding: 20px; +} + +.calendarRight { + padding: 8px; + display: flex; + flex-direction: column; + flex: 2; +} + +.calendarImgContainer { + position: relative; + width: 80%; +} + +.calendarLeft { + padding: 8px; + flex: 1; +} + +.calendarImgBack { + width: 100%; + height: auto; +} + +.calendarButton { + position: absolute; + border-radius: 50%; + cursor: pointer; +} + +.calendarPopover { + color: black; + width: 10%; +} + +.calendarPopoverBody { + display: flex; + flex-direction: row; + justify-content: center; + padding: 5%; +} + +.calendarStar { + width: 35%; + height: auto; + padding: 4px; +} + /* --------------------------------------------------------- LEADERBOARD PAGE STYLES ---------------------------------------------------*/ .leaderboardPage { diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 0d73714..b27bb57 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -10,6 +10,7 @@ import About from './pages/About'; import Leaderboard from './pages/Leaderboard'; import Calendar from './pages/Calendar'; import Stats from './pages/Stats'; +import Problem from './pages/Problem'; import Header from './components/Header'; import Footer from './components/Footer'; @@ -26,6 +27,7 @@ const App: React.FC<{}> = () => { } /> } /> } /> + } />