jiazhizhong/certimate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(ui): eslint-plugin-tailwindcss

Browse Source
This commit is contained in:
Fu Diwei
2025-01-03 20:35:11 +08:00
parent 8a16893082
commit 5ce5a08e41
29 changed files with 86 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ui/src/components/ModalForm.tsx
View File

@@ -106,7 +106,7 @@ const ModalForm = <T extends NonNullable<unknown> = NonNullable<unknown>>({
onOk={handleOkClick}
onCancel={handleCancelClick}
>
<div className="pt-4 pb-2">
<div className="pb-2 pt-4">
<Form className={className} style={style} form={formInst} {...mergedFormProps}>
{children}
</Form>

2
ui/src/components/MultipleInput.tsx
View File

@@ -247,7 +247,7 @@ const MultipleInputItem = forwardRef<MultipleInputItemInstance, MultipleInputIte
return (
<div className="flex flex-nowrap items-center space-x-2">
<div className="flex-grow">
<div className="grow">
<Input
{...props}
ref={inputRef}

2
ui/src/components/access/AccessEditModal.tsx
View File

@@ -100,7 +100,7 @@ const AccessEditModal = ({ data, loading, trigger, preset, onSubmit, ...props }:
onOk={handleClickOk}
onCancel={handleClickCancel}
>
<div className="pt-4 pb-2">
<div className="pb-2 pt-4">
<AccessEditForm ref={formRef} initialValues={data} preset={preset === "add" ? "add" : "edit"} />
</div>
</Modal>

4
ui/src/components/access/AccessSelect.tsx
View File

@@ -36,7 +36,7 @@ const AccessSelect = ({ filter, ...props }: AccessTypeSelectProps) => {
const access = accesses.find((e) => e.id === key);
if (!access) {
return (
<Space className="flex-grow max-w-full truncate" size={4}>
<Space className="max-w-full grow truncate" size={4}>
<Avatar size="small" />
<Typography.Text className="leading-loose" ellipsis>
{key}
@@ -47,7 +47,7 @@ const AccessSelect = ({ filter, ...props }: AccessTypeSelectProps) => {
const provider = accessProvidersMap.get(access.configType);
return (
<Space className="flex-grow max-w-full truncate" size={4}>
<Space className="max-w-full grow truncate" size={4}>
<Avatar src={provider?.icon} size="small" />
<Typography.Text className="leading-loose" ellipsis>
{access.name}

4
ui/src/components/certificate/CertificateDetail.tsx
View File

@@ -48,7 +48,7 @@ const CertificateDetail = ({ data, ...props }: CertificateDetailProps) => {
</Form.Item>
<Form.Item>
<div className="flex items-center justify-between w-full mb-2">
<div className="mb-2 flex w-full items-center justify-between">
<label>{t("certificate.props.certificate_chain")}</label>
<Tooltip title={t("common.button.copy")}>
<CopyToClipboard
@@ -65,7 +65,7 @@ const CertificateDetail = ({ data, ...props }: CertificateDetailProps) => {
</Form.Item>
<Form.Item>
<div className="flex items-center justify-between w-full mb-2">
<div className="mb-2 flex w-full items-center justify-between">
<label>{t("certificate.props.private_key")}</label>
<Tooltip title={t("common.button.copy")}>
<CopyToClipboard

4
ui/src/components/provider/AccessProviderSelect.tsx
View File

@@ -21,8 +21,8 @@ const AccessProviderSelect = (props: AccessProviderSelectProps) => {
const renderOption = (key: string) => {
const provider = accessProvidersMap.get(key);
return (
<div className="flex items-center justify-between gap-4 max-w-full overflow-hidden">
<Space className="flex-grow max-w-full truncate" size={4}>
<div className="flex max-w-full items-center justify-between gap-4 overflow-hidden">
<Space className="max-w-full grow truncate" size={4}>
<Avatar src={provider?.icon} size="small" />
<Typography.Text className="leading-loose" ellipsis>
{t(provider?.name ?? "")}

2
ui/src/components/provider/DeployProviderPicker.tsx
View File

@@ -50,7 +50,7 @@ const DeployProviderPicker = ({ className, style, onSelect }: DeployProviderPick
return (
<Col key={index} span={12}>
<Card
className="w-full h-16 shadow-sm overflow-hidden"
className="h-16 w-full overflow-hidden shadow-sm"
styles={{ body: { height: "100%", padding: "0.5rem 1rem" } }}
hoverable
onClick={() => {

2
ui/src/components/provider/DeployProviderSelect.tsx
View File

@@ -21,7 +21,7 @@ const DeployProviderSelect = (props: DeployProviderSelectProps) => {
const renderOption = (key: string) => {
const provider = deployProvidersMap.get(key);
return (
<Space className="flex-grow max-w-full truncate overflow-hidden" size={4}>
<Space className="max-w-full grow overflow-hidden truncate" size={4}>
<Avatar src={provider?.icon} size="small" />
<Typography.Text className="leading-loose" ellipsis>
{t(provider?.name ?? "")}

14
ui/src/components/workflow/WorkflowElement.tsx
View File

@@ -32,7 +32,7 @@ const WorkflowElement = ({ node }: NodeProps) => {
switch (node.type) {
case WorkflowNodeType.Start: {
return (
<div className="flex space-x-2 items-center justify-between">
<div className="flex items-center justify-between space-x-2">
<Typography.Text className="truncate">
{node.config?.executionMethod === "auto"
? t("workflow.props.trigger.auto")
@@ -64,7 +64,7 @@ const WorkflowElement = ({ node }: NodeProps) => {
case WorkflowNodeType.Notify: {
const channel = notifyChannelsMap.get(node.config?.channel as string);
return (
<div className="flex space-x-2 items-center justify-between">
<div className="flex items-center justify-between space-x-2">
<Typography.Text className="truncate">{t(channel?.name ?? "")}</Typography.Text>
<Typography.Text className="truncate" type="secondary">
{(node.config?.subject as string) ?? ""}
@@ -130,10 +130,10 @@ const WorkflowElement = ({ node }: NodeProps) => {
overlayInnerStyle={{ padding: 0 }}
placement="rightTop"
>
<Card className="relative w-[256px] shadow-md overflow-hidden" styles={{ body: { padding: 0 } }} hoverable>
<div className="h-[48px] px-4 py-2 flex flex-col justify-center items-center bg-primary text-white truncate">
<Card className="relative w-[256px] overflow-hidden shadow-md" styles={{ body: { padding: 0 } }} hoverable>
<div className="bg-primary flex h-[48px] flex-col items-center justify-center truncate px-4 py-2 text-white">
<div
className="w-full text-center outline-none overflow-hidden focus:bg-background focus:text-foreground focus:rounded-sm"
className="focus:bg-background focus:text-foreground w-full overflow-hidden text-center outline-none focus:rounded-sm"
contentEditable
suppressContentEditableWarning
onBlur={handleNodeNameBlur}
@@ -142,8 +142,8 @@ const WorkflowElement = ({ node }: NodeProps) => {
</div>
</div>
<div className="px-4 py-2 flex flex-col justify-center">
<div className="text-sm cursor-pointer" onClick={handleNodeClick}>
<div className="flex flex-col justify-center px-4 py-2">
<div className="cursor-pointer text-sm" onClick={handleNodeClick}>
{renderNodeContent()}
</div>
</div>

4
ui/src/components/workflow/WorkflowRunDetailDrawer.tsx
View File

@@ -40,7 +40,7 @@ const WorkflowRunDetailDrawer = ({ data, loading, trigger, ...props }: WorkflowR
<Alert showIcon type="error" message={<Typography.Text type="danger">{t("workflow_run.props.status.failed")}</Typography.Text>} />
</Show>
<div className="mt-4 p-4 bg-black text-stone-200 rounded-md">
<div className="mt-4 rounded-md bg-black p-4 text-stone-200">
<div className="flex flex-col space-y-3">
{data!.log.map((item, i) => {
return (
@@ -49,7 +49,7 @@ const WorkflowRunDetailDrawer = ({ data, loading, trigger, ...props }: WorkflowR
<div className="flex flex-col space-y-1">
{item.outputs.map((output, j) => {
return (
<div key={j} className="flex text-sm space-x-2">
<div key={j} className="flex space-x-2 text-sm">
<div>[{dayjs(output.time).format("YYYY-MM-DD HH:mm:ss")}]</div>
{output.error ? <div className="text-red-500">{output.error}</div> : <div>{output.content}</div>}
</div>

4
ui/src/components/workflow/node/AddNode.tsx
View File

@@ -45,7 +45,7 @@ const AddNode = ({ node: supnode }: NodeProps | BrandNodeProps) => {
};
return (
<div className="relative py-6 before:content-[''] before:absolute before:w-[2px] before:h-full before:left-[50%] before:-translate-x-[50%] before:top-0 before:bg-stone-200">
<div className="relative py-6 before:absolute before:left-[50%] before:top-0 before:h-full before:w-[2px] before:-translate-x-[50%] before:bg-stone-200 before:content-['']">
<Dropdown
menu={{
items: dropdownMenus.map((item) => {
@@ -61,7 +61,7 @@ const AddNode = ({ node: supnode }: NodeProps | BrandNodeProps) => {
}}
trigger={["click"]}
>
<div className="bg-stone-400 hover:bg-stone-500 rounded-full size-5 z-[1] relative flex items-center justify-center cursor-pointer">
<div className="relative z-[1] flex size-5 cursor-pointer items-center justify-center rounded-full bg-stone-400 hover:bg-stone-500">
<PlusOutlinedIcon className="text-white" />
</div>
</Dropdown>

8
ui/src/components/workflow/node/ApplyNodeForm.tsx
View File

@@ -143,9 +143,9 @@ const ApplyNodeForm = ({ node }: ApplyNodeFormProps) => {
</Form.Item>
<Form.Item className="mb-0">
<label className="block mb-1">
<div className="flex items-center justify-between gap-4 w-full">
<div className="flex-grow max-w-full truncate">
<label className="mb-1 block">
<div className="flex w-full items-center justify-between gap-4">
<div className="max-w-full grow truncate">
<span>{t("workflow_node.apply.form.access.label")}</span>
<Tooltip title={t("workflow_node.apply.form.access.tooltip")}>
<Typography.Text className="ms-1" type="secondary">
@@ -184,7 +184,7 @@ const ApplyNodeForm = ({ node }: ApplyNodeFormProps) => {
</Form.Item>
<Divider className="my-1">
<Typography.Text className="font-normal text-xs" type="secondary">
<Typography.Text className="text-xs font-normal" type="secondary">
{t("workflow_node.apply.form.advanced_config.label")}
</Typography.Text>
</Divider>

6
ui/src/components/workflow/node/BranchNode.tsx
View File

@@ -32,9 +32,9 @@ const BranchNode = ({ node }: BrandNodeProps) => {
return (
<>
<div className="relative flex gap-x-16 before:content-[''] before:absolute before:h-[2px] before:left-[128px] before:right-[128px] before:top-0 before:bg-stone-200">
<div className="relative flex gap-x-16 before:absolute before:inset-x-[128px] before:top-0 before:h-[2px] before:bg-stone-200 before:content-['']">
<Button
className="text-xs absolute left-[50%] -translate-x-1/2 -translate-y-1/2 z-[1]"
className="absolute left-[50%] z-[1] -translate-x-1/2 -translate-y-1/2 text-xs"
size="small"
shape="round"
variant="outlined"
@@ -48,7 +48,7 @@ const BranchNode = ({ node }: BrandNodeProps) => {
{node.branches!.map((branch, index) => (
<div
key={branch.id}
className="relative flex flex-col items-center before:content-[''] before:w-[2px] before:bg-stone-200 before:absolute before:h-full before:left-[50%] before:-translate-x-[50%] before:top-0"
className="relative flex flex-col items-center before:absolute before:left-[50%] before:top-0 before:h-full before:w-[2px] before:-translate-x-[50%] before:bg-stone-200 before:content-['']"
>
<div className="relative flex flex-col items-center">{renderNodes(branch, node.id, index)}</div>
</div>

6
ui/src/components/workflow/node/ConditionNode.tsx
View File

@@ -56,10 +56,10 @@ const ConditionNode = ({ node, branchId, branchIndex }: NodeProps) => {
overlayInnerStyle={{ padding: 0 }}
placement="rightTop"
>
<Card className="relative w-[256px] shadow-md mt-10 z-[1]" styles={{ body: { padding: 0 } }} hoverable>
<div className="h-[48px] px-4 py-2 flex flex-col justify-center items-center truncate">
<Card className="relative z-[1] mt-10 w-[256px] shadow-md" styles={{ body: { padding: 0 } }} hoverable>
<div className="flex h-[48px] flex-col items-center justify-center truncate px-4 py-2">
<div
className="w-full text-center outline-slate-200 overflow-hidden focus:bg-background focus:text-foreground focus:rounded-sm"
className="focus:bg-background focus:text-foreground w-full overflow-hidden text-center outline-slate-200 focus:rounded-sm"
contentEditable
suppressContentEditableWarning
onBlur={handleNodeNameBlur}

8
ui/src/components/workflow/node/DeployNodeForm.tsx
View File

@@ -189,9 +189,9 @@ const DeployNodeForm = ({ node }: DeployFormProps) => {
</Form.Item>
<Form.Item className="mb-0">
<label className="block mb-1">
<div className="flex items-center justify-between gap-4 w-full">
<div className="flex-grow max-w-full truncate">
<label className="mb-1 block">
<div className="flex w-full items-center justify-between gap-4">
<div className="max-w-full grow truncate">
<span>{t("workflow_node.deploy.form.provider_access.label")}</span>
<Tooltip title={t("workflow_node.deploy.form.provider_access.tooltip")}>
<Typography.Text className="ms-1" type="secondary">
@@ -257,7 +257,7 @@ const DeployNodeForm = ({ node }: DeployFormProps) => {
</Form.Item>
<Divider className="my-1">
<Typography.Text className="font-normal text-xs" type="secondary">
<Typography.Text className="text-xs font-normal" type="secondary">
{t("workflow_node.deploy.form.params_config.label")}
</Typography.Text>
</Divider>

6
ui/src/components/workflow/node/DeployNodeFormLocalFields.tsx
View File

@@ -285,9 +285,9 @@ Remove-Item -Path "$pfxPath" -Force
</Form.Item>
<Form.Item className="mb-0">
<label className="block mb-1">
<div className="flex items-center justify-between gap-4 w-full">
<div className="flex-grow max-w-full truncate">
<label className="mb-1 block">
<div className="flex w-full items-center justify-between gap-4">
<div className="max-w-full grow truncate">
<span>{t("workflow_node.deploy.form.local_post_command.label")}</span>
</div>
<div className="text-right">

6
ui/src/components/workflow/node/DeployNodeFormSSHFields.tsx
View File

@@ -200,9 +200,9 @@ const DeployNodeFormSSHFields = () => {
</Form.Item>
<Form.Item className="mb-0">
<label className="block mb-1">
<div className="flex items-center justify-between gap-4 w-full">
<div className="flex-grow max-w-full truncate">
<label className="mb-1 block">
<div className="flex w-full items-center justify-between gap-4">
<div className="max-w-full grow truncate">
<span>{t("workflow_node.deploy.form.ssh_post_command.label")}</span>
</div>
<div className="text-right">

2
ui/src/components/workflow/node/EndNode.tsx
View File

@@ -7,7 +7,7 @@ const EndNode = () => {
return (
<div className="flex flex-col items-center">
<div className="size-[20px] rounded-full bg-stone-400"></div>
<div className="text-sm mt-2">
<div className="mt-2 text-sm">
<Typography.Text type="secondary">{t("workflow_node.end.label")}</Typography.Text>
</div>
</div>

6
ui/src/components/workflow/node/NotifyNodeForm.tsx
View File

@@ -81,9 +81,9 @@ const NotifyNodeForm = ({ node }: NotifyNodeFormProps) => {
</Form.Item>
<Form.Item className="mb-0">
<label className="block mb-1">
<div className="flex items-center justify-between gap-4 w-full">
<div className="flex-grow max-w-full truncate">{t("workflow_node.notify.form.channel.label")}</div>
<label className="mb-1 block">
<div className="flex w-full items-center justify-between gap-4">
<div className="max-w-full grow truncate">{t("workflow_node.notify.form.channel.label")}</div>
<div className="text-right">
<Link className="ant-typography" to="/settings/notification" target="_blank">
<Button size="small" type="link">