Replace all:unset with explicit button/input resets across Foundry UI (#237)

Styletron's generated stylesheet ordering makes all:unset unreliable —
it can override font-size, border-radius, and background unpredictably.
Replace with appearance:none + targeted resets and clean up duplicate
CSS properties introduced during iterative fixes.

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Nicholas Kissel 2026-03-11 11:04:20 -07:00 committed by GitHub
parent e03484848e
commit 302bc7b674
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 158 additions and 154 deletions

View file

@ -45,7 +45,13 @@ export const TranscriptHeader = memo(function TranscriptHeader({
}
}}
className={css({
all: "unset",
appearance: "none",
WebkitAppearance: "none",
background: "none",
border: "none",
padding: "0",
margin: "0",
outline: "none",
fontWeight: 500,
fontSize: "14px",
color: theme.colors.contentPrimary,
@ -79,7 +85,11 @@ export const TranscriptHeader = memo(function TranscriptHeader({
}
}}
className={css({
all: "unset",
appearance: "none",
WebkitAppearance: "none",
background: "none",
margin: "0",
outline: "none",
padding: "2px 8px",
borderRadius: "999px",
border: "1px solid rgba(255, 255, 255, 0.3)",
@ -136,7 +146,11 @@ export const TranscriptHeader = memo(function TranscriptHeader({
<button
onClick={() => onSetActiveTabUnread(!activeTab.unread)}
className={css({
all: "unset",
appearance: "none",
WebkitAppearance: "none",
background: "none",
border: "none",
margin: "0",
boxSizing: "border-box",
display: "inline-flex",
alignItems: "center",