mirror of
https://github.com/farion1231/cc-switch.git
synced 2026-10-26 01:34:51 +08:00
fix(quota): emphasize low quota without the warning orange
In light mode the warning text color is nearly the same orange as clickable text under the default orange accent, and the quota column itself is a refresh button, so an orange "Fable 5%" read as a link. Low quota now uses the primary text color at medium weight; used-up and failed states stay red, and expanded bars keep the amber fill.
This commit is contained in:
1 parent
dc6fe3ff33
commit
dd224d567b
3 files changed
+12
-5
No files matched your search
@@ -10,10 +10,14 @@ import {
|
||||
type QuotaTone,
|
||||
} from "./quotaRules";
|
||||
|
||||
/**
|
||||
* 快用完只加深加粗、不用橙色:浅色模式的警告文字和可点击文字(主题橙)几乎同色,
|
||||
* 额度列本身又能点,橙色会被读成「这里可以点」。展开的额度条仍用琥珀色填充
|
||||
*/
|
||||
export const TONE_TEXT: Record<QuotaTone, string> = {
|
||||
normal: "text-fg-2",
|
||||
muted: "text-fg-3",
|
||||
warning: "font-medium text-warning-text",
|
||||
warning: "font-medium text-fg-1",
|
||||
danger: "font-medium text-danger-text",
|
||||
};
|
||||
|
||||
|
||||
@@ -3,8 +3,8 @@ import type { QuotaTier } from "@/types/subscription";
|
||||
|
||||
/**
|
||||
* 额度的文字和颜色(v7 QuotaSpec):一律写「剩余」,平时灰色;任一档剩余不到 10%(余额不到
|
||||
* 总额 10%)橙色;用完 / 过期 / 没查到红色。卡片最多两行:档数更多时,第一行固定写窗口
|
||||
* 最短的那档,其余并成一行(见 cardRows)。
|
||||
* 总额 10%)加深加粗(不用橙色,见 TONE_TEXT);用完 / 过期 / 没查到红色。卡片最多两行:
|
||||
* 档数更多时,第一行固定写窗口最短的那档,其余并成一行(见 cardRows)。
|
||||
*/
|
||||
export type QuotaTone = "normal" | "warning" | "danger" | "muted";
|
||||
|
||||
|
||||
@@ -84,12 +84,15 @@ describe("Claude Fable subscription quota", () => {
|
||||
resetsAt: "2026-09-12T00:00:00Z",
|
||||
},
|
||||
]);
|
||||
// 第一行固定是 5 小时,哪怕它剩得最多;其余两档并成一行,快用完的那段单独橙色
|
||||
// 第一行固定是 5 小时,哪怕它剩得最多;其余两档并成一行,快用完的那段单独加深
|
||||
const lines = screen.getByRole("button").children;
|
||||
expect(lines[0]).toHaveTextContent("5 小时剩余 88%");
|
||||
expect(lines[1]).toHaveTextContent("每周 75% · Fable 5%");
|
||||
expect(screen.getByText("每周 75%")).toHaveClass("text-fg-2");
|
||||
expect(screen.getByText("Fable 5%")).toHaveClass("text-warning-text");
|
||||
expect(screen.getByText("Fable 5%")).toHaveClass(
|
||||
"font-medium",
|
||||
"text-fg-1",
|
||||
);
|
||||
// 重置时间在悬停说明里
|
||||
expect(screen.getByRole("button").getAttribute("title")).toContain(
|
||||
"Fable · 2d12h后重置",
|
||||
|
||||
Reference in new issue
Block a user