fix(skills): keep skill title input transparent in dark mode (#2710)

The skill name Input on the detail editor uses `bg-transparent px-0`
to render as flush, chrome-less text. The base Input component also
applies `dark:bg-input/30`, which Tailwind keeps because it lives in
the `dark:` variant. In dark mode this exposes a 30% white fill that
appears flush against the text — looking like missing left padding.

Add `dark:bg-transparent` to the className so the override wins in
both color modes.
This commit is contained in:
Zheng Li
2026-05-18 16:32:28 +08:00
committed by GitHub
parent 1796ef6dff
commit c78bfbcf17

View File

@@ -679,7 +679,7 @@ export function SkillDetailPage({ skillId }: { skillId: string }) {
readOnly={!canEdit}
onChange={(e) => setName(e.target.value)}
placeholder={t(($) => $.detail.name_placeholder)}
className="h-9 border-0 bg-transparent px-0 text-lg font-semibold shadow-none focus-visible:ring-0 read-only:cursor-default"
className="h-9 border-0 bg-transparent px-0 text-lg font-semibold shadow-none focus-visible:ring-0 read-only:cursor-default dark:bg-transparent"
aria-label={t(($) => $.detail.name_aria)}
/>
<div className="space-y-1">