From 8f25791fa1d2ea53f3ba3bd9fc3af3f34d0f5414 Mon Sep 17 00:00:00 2001 From: goddonebianu Date: Sat, 14 Feb 2026 02:08:40 +0800 Subject: [PATCH] less buttons --- .vscode/settings.json | 6 ++- .../srt-player/components/atoms/FileInput.tsx | 7 ++- src/app/folders/FoldersClient.tsx | 8 ++-- src/app/folders/[folder_id]/InFolder.tsx | 9 ++-- src/components/layout/LanguageSettings.tsx | 7 ++- src/components/ui/index.ts | 8 ---- src/design-system/base/button/button.tsx | 45 +++---------------- 7 files changed, 29 insertions(+), 61 deletions(-) diff --git a/.vscode/settings.json b/.vscode/settings.json index bf80054..7e0ee1b 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -9,5 +9,9 @@ }, "[css]": { "editor.defaultFormatter": "rvest.vs-code-prettier-eslint" - } + }, + "tailwindCSS.classFunctions": [ + "cva", + "cx" + ] } \ No newline at end of file diff --git a/src/app/(features)/srt-player/components/atoms/FileInput.tsx b/src/app/(features)/srt-player/components/atoms/FileInput.tsx index fcf0e43..5145137 100644 --- a/src/app/(features)/srt-player/components/atoms/FileInput.tsx +++ b/src/app/(features)/srt-player/components/atoms/FileInput.tsx @@ -1,7 +1,7 @@ "use client"; import React, { useRef } from "react"; -import { Button } from "@/design-system/base/button"; +import { LightButton } from "@/design-system/base/button"; import { FileInputProps } from "../../types/controls"; interface FileInputComponentProps extends FileInputProps { @@ -34,15 +34,14 @@ export function FileInput({ accept, onFileSelect, disabled, className, children disabled={disabled} className="hidden" /> - + ); } \ No newline at end of file diff --git a/src/app/folders/FoldersClient.tsx b/src/app/folders/FoldersClient.tsx index faba006..5d91837 100644 --- a/src/app/folders/FoldersClient.tsx +++ b/src/app/folders/FoldersClient.tsx @@ -7,7 +7,7 @@ import { FolderPlus, Trash2, } from "lucide-react"; -import { CircleButton, DashedButton } from "@/design-system/base/button"; +import { CircleButton, LightButton } from "@/design-system/base/button"; import { useEffect, useState } from "react"; import { useRouter } from "next/navigation"; import { useTranslations } from "next-intl"; @@ -135,7 +135,7 @@ export function FoldersClient({ userId }: { userId: string; }) { {/* 新建文件夹按钮 */} - { const folderName = prompt(t("enterFolderName")); if (!folderName) return; @@ -154,11 +154,11 @@ export function FoldersClient({ userId }: { userId: string; }) { } }} disabled={loading} - className="w-full" + className="w-full border-dashed" > {loading ? t("creating") : t("newFolder")} - + {/* 文件夹列表 */}
diff --git a/src/app/folders/[folder_id]/InFolder.tsx b/src/app/folders/[folder_id]/InFolder.tsx index 1821c23..f13a3c2 100644 --- a/src/app/folders/[folder_id]/InFolder.tsx +++ b/src/app/folders/[folder_id]/InFolder.tsx @@ -7,7 +7,7 @@ import { AddTextPairModal } from "./AddTextPairModal"; import { TextPairCard } from "./TextPairCard"; import { useTranslations } from "next-intl"; import { PageLayout } from "@/components/ui/PageLayout"; -import { PrimaryButton, IconButton, LinkButton } from "@/design-system/base/button"; +import { PrimaryButton, CircleButton, LinkButton } from "@/design-system/base/button"; import { CardList } from "@/components/ui/CardList"; import { actionCreatePair, actionDeletePairById, actionGetPairsByFolderId } from "@/modules/folder/folder-aciton"; import { TSharedPair } from "@/shared/folder-type"; @@ -81,12 +81,13 @@ export function InFolder({ folderId, isReadOnly }: { folderId: number; isReadOnl {t("memorize")} {!isReadOnly && ( - { setAddModal(true); }} - icon={} - /> + > + + )}
diff --git a/src/components/layout/LanguageSettings.tsx b/src/components/layout/LanguageSettings.tsx index 64739c4..90ff5a8 100644 --- a/src/components/layout/LanguageSettings.tsx +++ b/src/components/layout/LanguageSettings.tsx @@ -15,7 +15,12 @@ export function LanguageSettings() { }; return ( <> - + + +
{showLanguageMenu && (
diff --git a/src/components/ui/index.ts b/src/components/ui/index.ts index efb798b..24bee35 100644 --- a/src/components/ui/index.ts +++ b/src/components/ui/index.ts @@ -9,20 +9,12 @@ export { Card, type CardVariant, type CardPadding, type CardProps } from '@/desi export { Button, PrimaryButton, - SecondaryButton, LightButton, - SuccessButton, - WarningButton, - ErrorButton, - GhostButton, GhostLightButton, - OutlineButton, LinkButton, - IconButton, IconClick, CircleButton, CircleToggleButton, - DashedButton, type ButtonVariant, type ButtonSize, type ButtonProps diff --git a/src/design-system/base/button/button.tsx b/src/design-system/base/button/button.tsx index d307e98..58c5c6b 100644 --- a/src/design-system/base/button/button.tsx +++ b/src/design-system/base/button/button.tsx @@ -41,7 +41,7 @@ import { cn } from "@/design-system/lib/utils"; */ const buttonVariants = cva( // 基础样式 - "border flex-inline items-center justify-center gap-2 rounded-md font-semibold shadow transition-all duration-250 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", + "inline-flex items-center justify-center gap-2 rounded-md font-semibold shadow leading-none transition-all duration-250 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", { variants: { variant: { @@ -56,9 +56,9 @@ const buttonVariants = cva( link: "text-primary-500 hover:text-primary-600 hover:underline shadow-none px-0", }, size: { - sm: "h-8 px-3 text-sm", - md: "h-10 px-4 text-base", - lg: "h-12 px-6 text-lg", + sm: "px-2.5 py-1.5 text-sm", + md: "px-4 py-2 text-base", + lg: "px-6 py-3 text-lg", }, fullWidth: { true: "w-full", @@ -248,50 +248,22 @@ export const PrimaryButton = (props: Omit) => ( ); }; - -// DashedButton: 虚线边框按钮(使用 outline 变体近似) -export const DashedButton = (props: Omit) => ( -