/* CONTENEUR EN FLEX */ .accordion { display:flex; flex-direction:column; gap:0; /* lignes séparatrices gérées par border */ max-width: 880px; margin: 0 auto; } /* ITEM EN FLEX COLONNE */ .accordion-item { display:flex; flex-direction:column; } /* En-tête : H2 + bouton (ligne en flex) */ .accordion h2 { margin:0; } .accordion button{ all: unset; display:flex; /* FLEX ICI */ align-items:center; justify-content:space-between; gap:14px; width:100%; cursor:pointer; padding:10px 6px; } .accordion .label { flex:1; font-size: clamp(18px, 2.2vw, 28px); font-weight:700; } .accordion button:focus-visible { outline: 3px solid #1a73e8; outline-offset: 3px; border-radius:6px; } /* Icônes en ligne (flex child) */ .icon { width:22px; height:22px; opacity:.85; margin-right:6px } .title-left { display:flex; align-items:center; gap:14px; } /* Chevron */ .chevron { width:22px; height:22px; flex:0 0 22px; transition: transform .2s ease; color: var(--chev); } [aria-expanded="true"] .chevron{ transform: rotate(-180deg); } /* PANNEAU EN FLEX COLONNE + TRANSITION hauteur */ .panel { display:flex; /* FLEX ICI */ flex-direction:column; overflow:hidden; max-height:0; /* fermé */ transition:max-height .28s ease; } .panel[data-open="true"] { max-height: 600px; /* valeur assez grande pour contenir le contenu */ } .panel > div { padding: 0 6px 18px 6px; color: var(--muted); line-height: 1.6; font-size: 16px; } Venice Poster - Paint by numbers Discover the elegance of Venice at home with the Venice Poster by Steloria. This paint by numbers kit transforms a creative moment into a sensual experience: golden light, reflections on the water, intimate alleys revealed under your brush. Easy to follow, it offers a professional result even without experience. Perfect for decorating, gifting, or relaxing after a busy day. A sublime result, easily The Venice Poster has been designed to enhance every gesture. The numbered areas guide you step by step, the colors are pre-mixed for a harmonious result, and the premium paper highlights every nuance. In just a few hours, you obtain a work ready to frame, with romantic and refined charm. What your Steloria kit contains 1 printed canvas with clear numbering and thick paper suitable for painting High-quality, durable, and opaque acrylic colors Several brushes of different sizes for details and large areas Illustrated instructions and tips for a clean and bright result Why choose this Venice Poster? Steloria selects durable materials and true-to-life pigments to ensure an elegant finish. This kit is designed to: Calm the mind: a meditative activity that reduces stress Beautify your interior: a chic and romantic decor inspired by Venice Offer an original and personalized gift Allow for quick creation, accessible from the first try Quick tips for a perfect result Start with the large areas to set the mood, then refine the details Clean your brushes between colors for clean lines Let each layer dry before adding final touches Frame your poster once dry to protect and enhance the artwork Indulge in this sensory journey through the heart of the Venetian canals. The Venice Poster from Steloria is an invitation to create, dream, and dress your walls with a soft and refined atmosphere. Order today and start your artwork with confidence. Description Model : Venice PosterMethod : Paint by numbersDifficulty level : IntermediateDimensions : 50x40cmFrame options : Sold with no frameSupport : Treated and printed cotton/linen canvasPaint type : Acrylic (24 colors)Packaging : rolled or folded in secure packaging // Accordéon : un seul panneau ouvert à la fois const accordion = document.getElementById('accordion'); const buttons = accordion.querySelectorAll('.accordion-item h2 > button'); function closeItem(btn){ btn.setAttribute('aria-expanded', 'false'); const panel = document.getElementById(btn.getAttribute('aria-controls')); panel.dataset.open = "false"; panel.style.maxHeight = null; } function openItem(btn){ btn.setAttribute('aria-expanded', 'true'); const panel = document.getElementById(btn.getAttribute('aria-controls')); panel.dataset.open = "true"; // ajuste la hauteur pour la transition panel.style.maxHeight = panel.scrollHeight + "px"; } buttons.forEach(btn => { btn.addEventListener('click', () => { const wasOpen = btn.getAttribute('aria-expanded') === 'true'; // ferme tous les items buttons.forEach(closeItem); // ouvre seulement celui cliqué s'il n'était pas déjà ouvert if (!wasOpen) openItem(btn); }); // touche Entrée/Espace pour accessibilité btn.addEventListener('keydown', (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); btn.click(); } }); }); // (Optionnel) ouvrir le premier par défaut : // if (buttons.length) openItem(buttons[0]);
Related
Related
Related
Related