fix(qr-button): match height of stacked buttons
- Change from width-based to height-based sizing (height: 100%) - Button now takes full height of parent container - Increase QR code from 52px to 72px to fill larger button - Button remains square with aspectRatio: 1 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
dc2d46663b
commit
81f202d215
|
|
@ -37,9 +37,8 @@ export function QRCodeButton({ url, style }: QRCodeButtonProps) {
|
||||||
padding: '4px',
|
padding: '4px',
|
||||||
fontSize: '16px',
|
fontSize: '16px',
|
||||||
color: 'rgba(253, 186, 116, 1)',
|
color: 'rgba(253, 186, 116, 1)',
|
||||||
width: '100%',
|
height: '100%',
|
||||||
aspectRatio: '1',
|
aspectRatio: '1',
|
||||||
alignSelf: 'stretch',
|
|
||||||
flexShrink: 0,
|
flexShrink: 0,
|
||||||
...style,
|
...style,
|
||||||
}
|
}
|
||||||
|
|
@ -62,7 +61,7 @@ export function QRCodeButton({ url, style }: QRCodeButtonProps) {
|
||||||
Object.assign(e.currentTarget.style, buttonStyles)
|
Object.assign(e.currentTarget.style, buttonStyles)
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<QRCodeSVG value={url} size={52} level="L" />
|
<QRCodeSVG value={url} size={72} level="L" />
|
||||||
</button>
|
</button>
|
||||||
</Popover.Trigger>
|
</Popover.Trigger>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue