// TenGoldFramesGallery.jsx function removeImage(index) { setImages(prev => { const copy = [...prev]; copy[index] = null; return copy; }); } function clearAll() { if (!confirm('Clear all designs from the gallery?')) return; setImages(Array(10).fill(null)); } return (

Ten Gold Frames Gallery

{Array.from({length:10}).map((_, i) => (
{ROMAN[i]}
{/* Outer ornate frame */}
triggerUpload(i)} title={images[i] ? 'Click to replace design' : 'Click to upload design'} className="absolute inset-0 cursor-pointer rounded-xl shadow-2xl flex items-center justify-center" style={{ // ornate gilded look made with layered gradients and inner panel background: 'linear-gradient(135deg, #f7d27a 0%, #f3c04b 30%, #d9a21a 60%, #b78410 100%)', padding: '14px', boxShadow: '0 8px 20px rgba(0,0,0,0.35)' }} > {/* inner matte area */}
{images[i] ? ( {`design-${i+1}`} ) : (
Empty
click to upload
)}
{/* small remove button top-right of inner area */} {images[i] && ( )} {/* Decorative corner flourishes (simple) */}
Design {i+1}
))}
How to use:
  • Click any frame to upload a design from your computer. Supported: PNG/JPG/GIF (browser restrictions apply).
  • Use the Remove button to clear a frame. Clear all will empty the gallery.
  • Images are stored in your browser's localStorage for convenience — not on a server. Use the Download backup button to save a JSON copy of the gallery.
Notes for Wix Studio:
  1. If you use Wix Studio you can drop this component into a React app section or rebuild the markup as plain HTML/CSS. I can convert it for you if you want.
  2. Because Wix-hosted pages restrict custom JS in some plans, the simplest path is to export each design image from this gallery (right click & save) and then upload those images to your Wix media library and place them in image elements inside a 2x5 grid.
); } TEN COOL SHIRTS | ONLINE CLOTHING TEE SHIRT STORE
top of page
ALWAYS TEN, ALWAYS COOL

Welcome visitors to your site with a short, engaging introduction. Double click to edit and add your own text.

bottom of page