/* 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(16px, 1.8vw, 22px); font-weight:700; color: #464746; } .accordion button:focus-visible { outline: 3px solid #1a73e8; outline-offset: 3px; border-radius:6px; } /* Icônes en ligne (flex child) */ .icona { width:22px; height:22px; opacity:.85; margin-right:6px; color: #464746; } .title-left { display:flex; align-items:center; gap:14px; } /* Chevron */ .chevrona { width:22px; height:22px; flex:0 0 22px; transition: transform .2s ease; color: #464746; } [aria-expanded="true"] .chevrona{ 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; } Vue sur Notre-Dame de Paris - Paris - Peinture par numéros Plongez dans l'atmosphère intime et lumineuse de Paris avec la peinture par numéros "Vue sur Notre-Dame de Paris" signée Steloria. Ce kit vous invite à recréer, trait par trait, la silhouette majestueuse de la cathédrale, les reflets sur la Seine et la douceur d'une lumière dorée. Conçu pour libérer votre créativité, il transforme un moment ordinaire en un instant sensuel et apaisant, accessible aussi bien aux débutants qu'aux amateurs confirmés. Description du tableau La composition joue sur les contrastes entre pierre et ciel, ombre et éclaircie. Les zones numérotées guident votre geste pour obtenir une harmonie de couleurs sans effort. Les teintes ont été choisies pour restituer la chaleur des pierres, la profondeur des ciels parisiens et le miroitement de l'eau - une palette riche mais facile à appliquer. Résultat : une œuvre élégante, prête à sublimer votre intérieur ou offrir en cadeau. Contenu du kit Toile en coton de qualité prête à peindre (format 40 x 50 cm) Peintures acryliques non toxiques, numérotées et couvrantes 3 pinceaux de tailles variées pour détails et aplats Guide illustré et référence couleur pour suivre pas à pas Palette jetable et suggestion de vernis de finition Pourquoi choisir Steloria ? Steloria associe savoir-faire et sensibilité artistique. Nos kits offrent des pigments stables, une toile fine et un rendu professionnel sans complexité. Peindre devient un rituel plaisant : chaque coup de pinceau détend, chaque nuance révèle votre touché. C'est une expérience chic et accessible, idéale pour se détendre après la journée ou créer un souvenir unique de Paris. Conseils pour réussir Commencez par les grandes surfaces pour poser l'ambiance générale. Utilisez le pinceau fin pour les détails de l'architecture et des vitraux. Appliquez des couches légères et laissez sécher entre chaque couche. Nettoyez les pinceaux à l'eau tiède et séchez-les à plat. Vernissez légèrement pour protéger et intensifier les couleurs. Offrez-vous l'élégance d'un tableau peint main avec Steloria. Transformez quelques heures en une œuvre qui parle de lumière, de pierre et d'émotion - un hommage sensible à Notre-Dame de Paris à poser chez vous ou à offrir à un être cher. Description Modèle : Vue sur Notre-Dame de Paris - ParisMéthode : Peinture par numérosNiveaux de difficulté : IntermédiaireDimensions : 20x30cm, 40x50cmOptions de cadre : Vendu avec cadre en kit à monter soi-mêmeSupport : Toile de lin/coton traitée et impriméeType de peinture : AcryliqueEmballage : roulé ou plié dans un emballage sécurisé // 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