fix(web): align tool detail layout (#1204)

* fix(web): align inline tool detail spacing

* fix(web): polish tool detail alignment
This commit is contained in:
Ananovo
2026-07-28 17:29:43 +08:00
committed by GitHub
parent 25dfa638b3
commit 8a77d2f84d
7 changed files with 113 additions and 10 deletions
+10 -3
View File
@@ -7,10 +7,14 @@ import { useTranslation } from '@/lib/use-translation'
export const Dialog = DialogPrimitive.Root
export const DialogTrigger = DialogPrimitive.Trigger
type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
closeButtonClassName?: string
}
export const DialogContent = React.forwardRef<
HTMLDivElement,
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
>(({ className, children, ...props }, ref) => {
DialogContentProps
>(({ className, closeButtonClassName, children, ...props }, ref) => {
const { t } = useTranslation()
return (
<DialogPrimitive.Portal>
@@ -25,7 +29,10 @@ export const DialogContent = React.forwardRef<
>
{children}
<DialogPrimitive.Close
className="absolute right-3 top-3 flex h-8 w-8 items-center justify-center rounded-full text-[var(--app-hint)] transition-colors hover:bg-[var(--app-subtle-bg)] hover:text-[var(--app-fg)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--app-link)]"
className={cn(
'absolute right-3 top-3 flex h-8 w-8 items-center justify-center rounded-full text-[var(--app-hint)] transition-colors hover:bg-[var(--app-subtle-bg)] hover:text-[var(--app-fg)] focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--app-link)]',
closeButtonClassName
)}
aria-label={t('button.close')}
>
<CloseIcon className="h-4 w-4" />