with one click
css-layout-solver
Résout les problèmes de layout CSS avec Flexbox, Grid et techniques modernes. Se déclenche avec "CSS", "layout", "Flexbox", "Grid", "centrer", "aligner", "responsive", "mon layout est cassé", "overflow", "z-index".
Menu
Résout les problèmes de layout CSS avec Flexbox, Grid et techniques modernes. Se déclenche avec "CSS", "layout", "Flexbox", "Grid", "centrer", "aligner", "responsive", "mon layout est cassé", "overflow", "z-index".
| name | css-layout-solver |
| description | Résout les problèmes de layout CSS avec Flexbox, Grid et techniques modernes. Se déclenche avec "CSS", "layout", "Flexbox", "Grid", "centrer", "aligner", "responsive", "mon layout est cassé", "overflow", "z-index". |
Comprendre le layout souhaité : recueillir la description précise du résultat attendu — maquette, screenshot du problème actuel, ou description textuelle. Identifier le contexte (page entière, widget, carte, navigation).
Choisir la technique adaptée : sélectionner Flexbox pour les layouts unidimensionnels (lignes ou colonnes), CSS Grid pour les layouts bidimensionnels (grilles complexes), ou container queries pour des composants auto-adaptatifs indépendants du viewport.
Implémenter avec code CSS complet et commenté : fournir un code directement fonctionnel avec les propriétés clés commentées pour expliquer les choix (ex. flex: 1 1 auto vs flex: 0 0 auto).
Gérer le responsive : ajouter media queries basées sur le contenu, utiliser clamp() pour des valeurs fluides, min() et max() pour les contraintes, et container queries pour les composants réutilisables.
Déboguer les problèmes courants : diagnostiquer overflow caché, conflits de z-index et stacking contexts, margin collapse entre blocs, shrink non désiré sur les enfants flex, et height:100% sans contexte parent.
Animations et transitions CSS : proposer des animations performantes basées sur transform et opacity (GPU-accelerated), des keyframes pour les séquences complexes, et will-change uniquement quand nécessaire.
Variables CSS et théming : structurer le design avec custom properties (--color-primary), implémenter le dark mode via prefers-color-scheme et variables, et organiser les design tokens en couches logiques.
Optimiser la maintenabilité : réduire la spécificité (préférer les classes aux IDs), utiliser @layer pour contrôler la cascade, éviter !important, et mesurer l'impact sur le rendering performance (Composite, Paint, Layout).
Orchestration multi-agent déterministe avec le tool natif Workflow de Claude Code. Conçoit des scripts qui fan-out, vérifient et synthétisent sur de nombreux sous-agents (pipeline, parallel, adversarial verify, judge panel, loop-until-dry). Se déclenche avec "workflow", "orchestrer des agents", "fan-out", "multi-agent", "paralléliser des sous-agents", "audit exhaustif", "vérification adversariale", "/workflows".
Orchestration multi-agent déterministe avec le tool natif Workflow de Claude Code. Conçoit des scripts qui fan-out, vérifient et synthétisent sur de nombreux sous-agents (pipeline, parallel, adversarial verify, judge panel, loop-until-dry). Se déclenche avec "workflow", "orchestrer des agents", "fan-out", "multi-agent", "paralléliser des sous-agents", "audit exhaustif", "vérification adversariale", "/workflows".
Guide du protocole Agent-to-Agent (A2A) de Google pour l'interopérabilité entre agents IA — découverte, communication et collaboration inter-agents. Se déclenche avec "A2A", "agent-to-agent", "protocole A2A", "Google A2A", "interopérabilité agents".
Observabilité complète pour agents IA — distributed tracing, métriques custom, log correlation et dashboards de supervision. Se déclenche avec "observabilité agent", "tracing agent", "métriques agent", "agent observability", "OpenTelemetry agent".
Sous-agent spécialisé dans les appels API REST/GraphQL avec retry, auth et transformation de données. Se déclenche avec "sous-agent API", "API caller agent", "agent qui appelle une API", "REST agent", "HTTP agent", "API integration subagent", "external API agent".
Développement d'agents conversationnels avec Microsoft AutoGen. Création de group chats, agents spécialisés et workflows multi-agents avec exécution de code. Se déclenche avec "AutoGen", "Microsoft AutoGen", "autogen agent", "group chat agent", "ConversableAgent", "AssistantAgent", "UserProxyAgent", "coding agent", "agents qui conversent".