fix: invite modal QR toggle — replace {} icon with "QR Code" button label
CI / Build & Quality Checks (push) Successful in 10m21s

Icons.BlockCode is the {} curly-braces icon, which is unintuitive for a
QR code toggle. No QR-specific icon exists in folds, so replace the
IconButton with a labeled Button ("QR Code") that clearly communicates
its purpose. Also fix var(--bg-surface-border) → color.Surface.ContainerLine
in the QR panel border (the CSS variable doesn't exist in Cinny's theme).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-03 16:59:32 -04:00
parent 6ed1fc75de
commit 8e4cbc47c4
@@ -207,17 +207,17 @@ export function InviteUserPrompt({ room, requestClose }: InviteUserProps) {
>
<Text size="B300">{linkCopied ? 'Copied!' : 'Copy Link'}</Text>
</Button>
<IconButton
<Button
size="300"
radii="300"
variant={showQr ? 'Primary' : 'Surface'}
variant={showQr ? 'Primary' : 'Secondary'}
fill={showQr ? 'Soft' : 'None'}
aria-label="Show QR code"
aria-label="Toggle QR code"
aria-pressed={showQr}
onClick={() => setShowQr((v) => !v)}
>
<Icon src={Icons.BlockCode} size="100" />
</IconButton>
<Text size="B300">QR Code</Text>
</Button>
<IconButton size="300" radii="300" onClick={requestClose} aria-label="Close">
<Icon src={Icons.Cross} />
</IconButton>
@@ -230,7 +230,7 @@ export function InviteUserPrompt({ room, requestClose }: InviteUserProps) {
gap="200"
style={{
padding: config.space.S300,
borderBottom: `1px solid var(--bg-surface-border)`,
borderBottom: `1px solid ${color.Surface.ContainerLine}`,
}}
>
<img