From 21f5d9e48c383af50b12ef4f2786d84a1881c822 Mon Sep 17 00:00:00 2001 From: sickboy Date: Thu, 9 Jul 2026 18:58:42 +0000 Subject: [PATCH 1/7] docs: add prompt tasks for new features --- prompt.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 prompt.md diff --git a/prompt.md b/prompt.md new file mode 100644 index 0000000..8a53799 --- /dev/null +++ b/prompt.md @@ -0,0 +1,13 @@ +Write the code in current style +Try to keep the essence of design and other things same + +- Add a dark theme + - theme should be just dark, at the top there will be a switch image button which instantly changes from light to dark + - would be in the same level as switch languages + - this will be saved in the local settings +- Add a feature to go to a random problem, it will respect the currect selected rating and keywords, in other words it will choose problem from the ones currently being shown in table + - The button would be before the reset button +- Change font. Current seems too light, keep it formal and nothing fancy +- Add color coding to the rating, + - Assume min rating is 1000, max is 4000 +- There are some very big files like ratings.txt, data.json, don't tuch them much, only see the strucutre by few reading say few hundred chars, you are smart enough From b669e472828401709809093dd0fbe16dad25d3a4 Mon Sep 17 00:00:00 2001 From: sickboy Date: Thu, 9 Jul 2026 18:58:54 +0000 Subject: [PATCH 2/7] style: update global fonts and add dark mode CSS vars --- src/App.vue | 12 +++++++++++- src/main.ts | 1 + 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/src/App.vue b/src/App.vue index 05035b2..cf04784 100644 --- a/src/App.vue +++ b/src/App.vue @@ -7,4 +7,14 @@ export default { name: "app", }; - + diff --git a/src/main.ts b/src/main.ts index beb86c8..9a8af54 100644 --- a/src/main.ts +++ b/src/main.ts @@ -4,6 +4,7 @@ import router from "./router"; import store from "./store"; import elementPlus from "element-plus"; import "element-plus/dist/index.css"; +import "element-plus/theme-chalk/dark/css-vars.css"; import { createI18n } from "vue-i18n"; import messages from "./locale"; import * as ElementPlusIconsVue from "@element-plus/icons-vue"; From c0a18633ea3a9461413bfec9843fdac1fa6bbe63 Mon Sep 17 00:00:00 2001 From: sickboy Date: Thu, 9 Jul 2026 18:59:06 +0000 Subject: [PATCH 3/7] feat: add dark mode toggle, random problem selector, and rating colors --- src/views/ProblemRating.vue | 55 ++++++++++++++++++++++++++++++++++++- 1 file changed, 54 insertions(+), 1 deletion(-) diff --git a/src/views/ProblemRating.vue b/src/views/ProblemRating.vue index 1111659..ae6a73d 100644 --- a/src/views/ProblemRating.vue +++ b/src/views/ProblemRating.vue @@ -2,6 +2,10 @@
+ + + + {{ $t("lang") }} @@ -57,6 +61,9 @@ @keyup.enter="query" /> + + Random + {{ $t("reset") }} @@ -105,7 +112,14 @@ @@ -154,6 +168,21 @@ interface SortInfo { let i18n = useI18n(); let locale = i18n.locale; + +const isDark = ref(localStorage.getItem("isDark") === "true"); +function toggleDark() { + isDark.value = !isDark.value; + localStorage.setItem("isDark", String(isDark.value)); + if (isDark.value) { + document.documentElement.classList.add("dark"); + } else { + document.documentElement.classList.remove("dark"); + } +} +if (isDark.value) { + document.documentElement.classList.add("dark"); +} + let left = ref(null); let right = ref(null); let sortInfo = reactive({ @@ -273,6 +302,30 @@ function reset() { sortInfo.prop = "ID"; query(); } + +function goRandom() { + if (filterProblemSet.length === 0) { + ElMessage.warning("No problems available"); + return; + } + const randomIndex = Math.floor(Math.random() * filterProblemSet.length); + const problem = filterProblemSet[randomIndex]; + const targetUrl = + locale.value === "zh" ? problem.ProblemHrefZH : problem.ProblemHrefEN; + if (targetUrl) { + window.open(targetUrl, "_blank"); + } +} + +function getRatingColor(rating: number) { + if (rating < 1200) return "#a0a0a0"; + if (rating < 1400) return "#43a047"; + if (rating < 1600) return "#26c6da"; + if (rating < 1900) return "#5c6bc0"; + if (rating < 2100) return "#ab47bc"; + if (rating < 2400) return "#ffb300"; + return "#e53935"; +}