Files
PrivyDrop/frontend/components/Editor/EditorToolbar/BasicFormatTools.tsx
T
david_bai 27375c1a4d refactor(theme): use design tokens and fix dark mode visuals
- Replace hardcoded Tailwind colors (bg-white, bg-gray-50/100, text-gray-, border-gray-, divide-gray-*, text-blue-600/800, bg-blue-50) with design tokens (bg-card, bg-muted, text-foreground, text-muted-foreground, border-
    border, text-primary, hover:bg-accent, bg-primary/10).
  - ClipboardApp: update RichTextEditor toolbar/editor, FileUploadHandler, ShareCard, FileListDisplay, SendTabPanel, RetrieveTabPanel, FileTransferButton.
  - Blog UI: unify styles in list page, tag page, post page, ArticleListItem, and TableOfContents.
  - MDX/prose: normalize pre/code/table/blockquote/lists and figure captions; switch rehype table divider to theme token.
  - Misc: adjust HomeClient and HowItWorks copy colors to tokens.
  - No functional changes; light mode parity; improved contrast and consistency in dark mode.
2025-11-25 21:52:45 +08:00

45 lines
1.2 KiB
TypeScript

import { Bold, Italic, Underline } from "lucide-react";
import { FormatType } from "../types";
interface BasicFormatToolsProps {
isStyleActive: (style: string) => boolean;
formatText: (style: FormatType) => void;
}
export function BasicFormatTools({
isStyleActive,
formatText,
}: BasicFormatToolsProps) {
return (
<div className="flex flex-wrap gap-1">
<button
className={`p-1.5 rounded ${
isStyleActive("bold") ? "bg-accent" : "hover:bg-accent"
}`}
onClick={() => formatText("bold")}
title="Bold"
>
<Bold className="w-3.5 h-3.5" />
</button>
<button
className={`p-1.5 rounded ${
isStyleActive("italic") ? "bg-accent" : "hover:bg-accent"
}`}
onClick={() => formatText("italic")}
title="Italic"
>
<Italic className="w-3.5 h-3.5" />
</button>
<button
className={`p-1.5 rounded ${
isStyleActive("underline") ? "bg-accent" : "hover:bg-accent"
}`}
onClick={() => formatText("underline")}
title="Underline"
>
<Underline className="w-3.5 h-3.5" />
</button>
</div>
);
}