opensource/certimate
3
0
Fork 0
mirror of https://github.com/certimate-go/certimate.git synced 2026-09-24 23:10:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): modify theme color

Browse Source
This commit is contained in:
Fu Diwei
2025-07-21 09:26:34 +08:00
parent b34ddf3e56
commit 27c8f6e7df
14 changed files with 21 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/App.tsx
+2 -10
View File
@@ -58,29 +58,21 @@ const RootApp = () => {
...antdTheme,
token: {
/* @see global.css, YOU MUST MODIFY BOTH DEFINITIONS AT THE SAME TIME! */
colorBgBase: browserTheme === "dark" ? "#17191c" : "#ffffff",
colorTextBase: browserTheme === "dark" ? "#fafaf9" : "#141414",
colorPrimary: browserTheme === "dark" ? "#f97316" : "#ea580c",
colorLink: browserTheme === "dark" ? "#f97316" : "#ea580c",
colorInfo: browserTheme === "dark" ? "#478be6" : "#0969da",
colorSuccess: browserTheme === "dark" ? "#57ab5a" : "#1a7f37",
colorWarning: browserTheme === "dark" ? "#daaa3f" : "#eac54f",
colorError: browserTheme === "dark" ? "#e5534b" : "#d1242f",
colorBgContainer: "var(--color-container)",
},
components: {
Layout: {
...antdTheme?.components?.Layout,
bodyBg: "transparent",
headerBg: "var(--color-container)",
siderBg: "transparent",
},
Table: {
...antdTheme?.components?.Table,
bodySortBg: "var(--color-container)",
headerBg: "var(--color-container)",
headerSortActiveBg: "var(--color-container)",
headerSortHoverBg: "var(--color-container-hover)",
rowHoverBg: "var(--color-container-hover)",
},
},
}}
>
ui/src/components/provider/ACMEDns01ProviderSelect.tsx
+1 -1
View File
@@ -36,7 +36,7 @@ const ACMEDns01ProviderSelect = ({ filter, ...props }: ACMEDns01ProviderSelectPr
const renderOption = (key: string) => {
const provider = acmeDns01ProvidersMap.get(key);
return (
<div className="flex items-center gap-2 overflow-hidden truncate">
<div className="flex items-center gap-2 truncate overflow-hidden">
<Avatar shape="square" src={provider?.icon} size="small" />
<Typography.Text ellipsis>{t(provider?.name ?? "")}</Typography.Text>
</div>
ui/src/components/provider/AccessProviderSelect.tsx
+1 -1
View File
@@ -53,7 +53,7 @@ const AccessProviderSelect = ({ filter, showOptionTags, ...props }: AccessProvid
const provider = accessProvidersMap.get(key) ?? ({ type: "", name: "", icon: "", usages: [] } as unknown as AccessProvider);
return (
<div className="flex max-w-full items-center justify-between gap-4 overflow-hidden">
<div className="flex items-center gap-2 overflow-hidden truncate">
<div className="flex items-center gap-2 truncate overflow-hidden">
<Avatar shape="square" src={provider.icon} size="small" />
<Typography.Text type={provider.builtin ? "secondary" : undefined} ellipsis>
{t(provider.name)}
ui/src/components/provider/CAProviderSelect.tsx
+2 -2
View File
@@ -45,7 +45,7 @@ const CAProviderSelect = ({ filter, ...props }: CAProviderSelectProps) => {
const renderOption = (key: string) => {
if (key === "") {
return (
<div className="flex items-center gap-2 overflow-hidden truncate">
<div className="flex items-center gap-2 truncate overflow-hidden">
<Typography.Text className="italic" ellipsis italic>
{t("provider.default_ca_provider.label")}
</Typography.Text>
@@ -55,7 +55,7 @@ const CAProviderSelect = ({ filter, ...props }: CAProviderSelectProps) => {
const provider = caProvidersMap.get(key);
return (
<div className="flex items-center gap-2 overflow-hidden truncate">
<div className="flex items-center gap-2 truncate overflow-hidden">
<Avatar shape="square" src={provider?.icon} size="small" />
<Typography.Text ellipsis>{t(provider?.name ?? "")}</Typography.Text>
</div>
ui/src/components/provider/DeploymentProviderSelect.tsx
+1 -1
View File
@@ -36,7 +36,7 @@ const DeploymentProviderSelect = ({ filter, ...props }: DeploymentProviderSelect
const renderOption = (key: string) => {
const provider = deploymentProvidersMap.get(key);
return (
<div className="flex items-center gap-2 overflow-hidden truncate">
<div className="flex items-center gap-2 truncate overflow-hidden">
<Avatar shape="square" src={provider?.icon} size="small" />
<Typography.Text ellipsis>{t(provider?.name ?? "")}</Typography.Text>
</div>
ui/src/components/provider/NotificationProviderSelect.tsx
+1 -1
View File
@@ -36,7 +36,7 @@ const NotificationProviderSelect = ({ filter, ...props }: NotificationProviderSe
const renderOption = (key: string) => {
const provider = notificationProvidersMap.get(key);
return (
<div className="flex items-center gap-2 overflow-hidden truncate">
<div className="flex items-center gap-2 truncate overflow-hidden">
<Avatar shape="square" src={provider?.icon} size="small" />
<Typography.Text ellipsis>{t(provider?.name ?? "")}</Typography.Text>
</div>
ui/src/components/workflow/node/ApplyNode.tsx
+1 -1
View File
@@ -33,7 +33,7 @@ const ApplyNode = ({ node, disabled }: ApplyNodeProps) => {
}
const config = (node.config as WorkflowNodeConfigForApply) ?? {};
return <Typography.Text className="truncate">{config.domains || "　"}</Typography.Text>;
return <Typography.Text className="truncate">{config.domains || "\u00A0"}</Typography.Text>;
}, [node]);
const formRef = useRef<ApplyNodeConfigFormInstance>(null);
ui/src/components/workflow/node/NotifyNode.tsx
+1 -1
View File
@@ -42,7 +42,7 @@ const NotifyNode = ({ node, disabled }: NotifyNodeProps) => {
return (
<Flex className="size-full overflow-hidden" align="center" gap={8}>
<Avatar shape="square" src={provider?.icon} size="small" />
<Typography.Text className="flex-1 truncate">{t(provider?.name ?? "　")}</Typography.Text>
<Typography.Text className="flex-1 truncate">{t(provider?.name ?? "\u00A0")}</Typography.Text>
<Typography.Text className="truncate" type="secondary">
{config.subject ?? ""}
</Typography.Text>
ui/src/components/workflow/node/StartNode.tsx
+1 -1
View File
@@ -44,7 +44,7 @@ const StartNode = ({ node, disabled }: StartNodeProps) => {
? t("workflow.props.trigger.auto")
: config.trigger === WORKFLOW_TRIGGERS.MANUAL
? t("workflow.props.trigger.manual")
: "　"}
: "\u00A0"}
</Typography.Text>
<Typography.Text className="truncate" type="secondary">
{config.trigger === WORKFLOW_TRIGGERS.AUTO ? config.triggerCron : ""}
ui/src/global.css
-6
View File
@@ -11,8 +11,6 @@
@theme {
--color-background: var(---twColorBackground);
--color-foreground: var(---twColorForeground);
--color-container: var(---twColorContainer);
--color-container-hover: var(---twColorContainerHover);
--color-primary: var(---twColorPrimary);
--color-info: var(---twColorInfo);
--color-success: var(---twColorSuccess);
@@ -24,8 +22,6 @@
:root {
---twColorBackground: #ffffff;
---twColorForeground: #141414;
---twColorContainer: #f9fafb;
---twColorContainerHover: #e5e7eb;
---twColorPrimary: #f97316;
---twColorInfo: #478ce6;
---twColorSuccess: #59ab5c;
@@ -36,8 +32,6 @@
.dark {
---twColorBackground: #17191c;
---twColorForeground: #fafaf9;
---twColorContainer: #1e2124;
---twColorContainerHover: #32373e;
---twColorPrimary: #ea580c;
---twColorInfo: #0969da;
---twColorSuccess: #1a7f37;
ui/src/pages/accesses/AccessList.tsx
+2 -2
View File
@@ -54,9 +54,9 @@ const AccessList = () => {
<div className="flex max-w-full items-center gap-4 truncate overflow-hidden">
<Avatar shape="square" src={accessProvidersMap.get(record.provider)?.icon} size={28} />
<div className="flex max-w-full flex-col gap-1">
<Typography.Text ellipsis>{record.name}</Typography.Text>
<Typography.Text ellipsis>{record.name || "\u00A0"}</Typography.Text>
<Typography.Text ellipsis type="secondary">
{t(accessProvidersMap.get(record.provider)?.name ?? "")}
{t(accessProvidersMap.get(record.provider)?.name ?? "") || "\u00A0"}
</Typography.Text>
</div>
</div>
ui/src/pages/certificates/CertificateList.tsx
+2 -2
View File
@@ -90,8 +90,8 @@ const CertificateList = () => {
title: t("certificate.props.brand"),
render: (_, record) => (
<div className="flex max-w-full flex-col gap-1">
<Typography.Text>{record.issuerOrg}</Typography.Text>
<Typography.Text>{record.keyAlgorithm}</Typography.Text>
<Typography.Text>{record.issuerOrg || "\u00A0"}</Typography.Text>
<Typography.Text>{record.keyAlgorithm || "\u00A0"}</Typography.Text>
</div>
),
},
ui/src/pages/workflows/WorkflowDetail.tsx
+3 -2
View File
@@ -199,8 +199,8 @@ const WorkflowDetail = () => {
<div className="mx-auto max-w-320">
<div className="flex justify-between gap-2">
<div>
<h1>{workflow.name || "　"}</h1>
<p className="mb-0 text-base text-gray-500">{workflow.description || "　"}</p>
<h1>{workflow.name || "\u00A0"}</h1>
<p className="mb-0 text-base text-gray-500">{workflow.description || "\u00A0"}</p>
</div>
<Flex gap="small">
{initialized
@@ -238,6 +238,7 @@ const WorkflowDetail = () => {
</div>
<Tabs
className="-mb-4"
activeKey={tabValue}
defaultActiveKey="orchestration"
items={[
ui/src/pages/workflows/WorkflowList.tsx
+3 -3
View File
@@ -44,9 +44,9 @@ const WorkflowList = () => {
ellipsis: true,
render: (_, record) => (
<div className="flex max-w-full flex-col gap-1">
<Typography.Text ellipsis>{record.name}</Typography.Text>
<Typography.Text ellipsis>{record.name || "\u00A0"}</Typography.Text>
<Typography.Text ellipsis type="secondary">
{record.description || "　"}
{record.description || "\u00A0"}
</Typography.Text>
</div>
),
@@ -65,7 +65,7 @@ const WorkflowList = () => {
return (
<div className="flex max-w-full flex-col gap-1">
<Typography.Text>{t("workflow.props.trigger.auto")}</Typography.Text>
<Typography.Text type="secondary">{record.triggerCron ?? ""}</Typography.Text>
<Typography.Text type="secondary">{record.triggerCron || "\u00A0"}</Typography.Text>
</div>
);
}