Updated the platform colors to the new ones

This commit is contained in:
Tiago Ribeiro
2023-07-22 07:18:28 +01:00
parent 16ea0b497e
commit 6ade34d243
22 changed files with 102 additions and 95 deletions

View File

@@ -162,8 +162,8 @@ export default function History({user}: {user: User}) {
key={timestamp}
className={clsx(
"flex flex-col gap-4 border border-mti-gray-platinum p-4 cursor-pointer rounded-xl transition ease-in-out duration-300",
correct / total >= 0.7 && "hover:border-mti-green",
correct / total >= 0.3 && correct / total < 0.7 && "hover:border-mti-blue",
correct / total >= 0.7 && "hover:border-mti-purple",
correct / total >= 0.3 && correct / total < 0.7 && "hover:border-mti-red",
correct / total < 0.3 && "hover:border-mti-orange",
)}
onClick={selectExam}
@@ -172,8 +172,8 @@ export default function History({user}: {user: User}) {
<span className="font-medium">{formatTimestamp(timestamp)}</span>
<span
className={clsx(
correct / total >= 0.7 && "text-mti-green",
correct / total >= 0.3 && correct / total < 0.7 && "text-mti-blue",
correct / total >= 0.7 && "text-mti-purple",
correct / total >= 0.3 && correct / total < 0.7 && "text-mti-red",
correct / total < 0.3 && "text-mti-orange",
)}>
Level{" "}
@@ -236,27 +236,27 @@ export default function History({user}: {user: User}) {
<div className="flex gap-4">
<button
className={clsx(
"bg-mti-green-ultralight text-mti-green px-4 py-2 rounded-full hover:text-white hover:bg-mti-green-light",
"bg-mti-purple-ultralight text-mti-purple px-4 py-2 rounded-full hover:text-white hover:bg-mti-purple-light",
"transition duration-300 ease-in-out",
filter === "months" && "!bg-mti-green-light !text-white",
filter === "months" && "!bg-mti-purple-light !text-white",
)}
onClick={() => toggleFilter("months")}>
Last month
</button>
<button
className={clsx(
"bg-mti-green-ultralight text-mti-green px-4 py-2 rounded-full hover:text-white hover:bg-mti-green-light",
"bg-mti-purple-ultralight text-mti-purple px-4 py-2 rounded-full hover:text-white hover:bg-mti-purple-light",
"transition duration-300 ease-in-out",
filter === "weeks" && "!bg-mti-green-light !text-white",
filter === "weeks" && "!bg-mti-purple-light !text-white",
)}
onClick={() => toggleFilter("weeks")}>
Last week
</button>
<button
className={clsx(
"bg-mti-green-ultralight text-mti-green px-4 py-2 rounded-full hover:text-white hover:bg-mti-green-light",
"bg-mti-purple-ultralight text-mti-purple px-4 py-2 rounded-full hover:text-white hover:bg-mti-purple-light",
"transition duration-300 ease-in-out",
filter === "days" && "!bg-mti-green-light !text-white",
filter === "days" && "!bg-mti-purple-light !text-white",
)}
onClick={() => toggleFilter("days")}>
Last day