/* 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; } Chibi Pop - Manga - Peinture par numéros Plongez dans un univers doux et coloré avec Chibi Pop, la peinture par numéros inspirée du manga. Ce kit transforme la création en plaisir sensuel et apaisant : lignes simples, traits arrondis, regards expressifs. Conçu pour les amateurs d’esthétique kawaii et pour tous ceux qui veulent un résultat charmant sans effort, Chibi Pop révèle des couleurs vibrantes et une finition nette, prête à être exposée ou offerte. Ce que contient le kit Toile pré-imprimée avec numéros clairs et contours précis, facile à suivre. Peintures acryliques de qualité, séchage rapide et couleurs lumineuses. Pinceaux de différentes tailles pour les détails et les aplats soyeux. Palette et guide de référence avec conseils simples pour un rendu pro. Comment l'utiliser Installez un espace calme et lumineux pour mieux apprécier chaque nuance. Commencez par les grandes zones, puis travaillez les détails avec un petit pinceau. Laissez sécher chaque couche brièvement pour éviter les bavures. Ajoutez une seconde couche sur les zones claires si vous souhaitez intensifier le contraste. Encadrez ou accrochez votre tableau une fois totalement sec pour sublimer votre pièce. Pourquoi choisir Chibi Pop ? Chibi Pop n’est pas seulement une activité manuelle : c’est une expérience sensorielle. Elle offre un instant de calme, une montée de fierté en voyant l’œuvre prendre vie, et un cadeau unique empreint de douceur. Adapté aux débutants comme aux passionnés de manga, le kit garantit un résultat soigné grâce à sa toile numérotée et ses peintures riches. Offrez-vous un moment de création délicat. Chibi Pop invite à la détente, stimule la créativité et magnifie votre intérieur avec une touche kawaii élégante. Laissez-vous séduire par la simplicité et la beauté de chaque trait. Description Modèle : Chibi Pop - MangaMéthode : Peinture par numérosNiveaux de difficulté : DébutantDimensions : 50x40cmOptions de cadre : Vendu sans cadreSupport : Toile de lin/coton traitée et impriméeType de peinture : Acrylique (24 couleurs)Emballage : 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