chris/beachPartyBalloons
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: zoom chrome/metallic preview dots to 220% background-size

Browse Source 
Image-based colors (chrome/metallic) have a balloon silhouette against
a transparent bg, so cover was fitting the whole image including
whitespace. 220% zooms into the center where the finish actually is.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
chris 2026-04-15 14:51:24 -04:00
parent c22b668bc5
commit f2fa8e3c17
1 changed files with 8 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
estore/src/components/ColorPicker.tsx
View File

@ -357,6 +357,7 @@ export default function ColorPicker({ product, maxColors, onClose, editingEntry
height: '13px', height: '13px',
borderRadius: '50%', borderRadius: '50%',
background: c.image ? `url('/color/${c.image}') center/cover` : c.hex, background: c.image ? `url('/color/${c.image}') center/cover` : c.hex,
backgroundSize: c.image ? '220%' : undefined,
border: '1px solid rgba(0,0,0,0.12)', border: '1px solid rgba(0,0,0,0.12)',
flexShrink: 0, flexShrink: 0,
display: 'inline-block', display: 'inline-block',