Initial commit

.claude-plugin/plugin.json

@@ -0,0 +1,12 @@
+{
+  "name": "leapmultix-skill-testing-mobile-responsive",
+  "description": "Skill testing-mobile-responsive from LeapMultix",
+  "version": "1.0.0",
+  "author": {
+    "name": "Julien LE SAUX",
+    "email": "contact@jls42.org"
+  },
+  "skills": [
+    "./skills"
+  ]
+}

README.md

@@ -0,0 +1,3 @@
+# leapmultix-skill-testing-mobile-responsive
+
+Skill testing-mobile-responsive from LeapMultix

plugin.lock.json

@@ -0,0 +1,45 @@
+{
+  "$schema": "internal://schemas/plugin.lock.v1.json",
+  "pluginId": "gh:jls42/leapmultix:leapmultix-marketplace/skills/testing-mobile-responsive",
+  "normalized": {
+    "repo": null,
+    "ref": "refs/tags/v20251128.0",
+    "commit": "d336c5b10ccab5781d421fd76658e0e77cc40bf3",
+    "treeHash": "e6e8d2fcb068d40c279220bd4431bffdbb20f9f721f56b11aea1274e60dc1249",
+    "generatedAt": "2025-11-28T10:19:15.161709Z",
+    "toolVersion": "publish_plugins.py@0.2.0"
+  },
+  "origin": {
+    "remote": "git@github.com:zhongweili/42plugin-data.git",
+    "branch": "master",
+    "commit": "aa1497ed0949fd50e99e70d6324a29c5b34f9390",
+    "repoRoot": "/Users/zhongweili/projects/openmind/42plugin-data"
+  },
+  "manifest": {
+    "name": "leapmultix-skill-testing-mobile-responsive",
+    "description": "Skill testing-mobile-responsive from LeapMultix",
+    "version": "1.0.0"
+  },
+  "content": {
+    "files": [
+      {
+        "path": "README.md",
+        "sha256": "10e8cf1882a40828d8317ec2ad8080b53eb2f25c4cbc4f52da5b28fb1b380a47"
+      },
+      {
+        "path": ".claude-plugin/plugin.json",
+        "sha256": "836a041edef2a3e0141ac0b33714be2b05b4c9c1760dd79f51e2f3ce80399d61"
+      },
+      {
+        "path": "skills/testing-mobile-responsive/SKILL.md",
+        "sha256": "18556974588aeb5ef30057cc9bc889c5d5fe58128ac4a90c59cdbec1ec44dc01"
+      }
+    ],
+    "dirSha256": "e6e8d2fcb068d40c279220bd4431bffdbb20f9f721f56b11aea1274e60dc1249"
+  },
+  "security": {
+    "scannedAt": null,
+    "scannerVersion": null,
+    "flags": []
+  }
+}

skills/testing-mobile-responsive/SKILL.md

@@ -0,0 +1,215 @@
+---
+name: testing-mobile-responsive
+description: Tests mobile compatibility and responsive design (touch, viewports, mobile performance). Use after responsive CSS modifications, touch controls, or before releases
+allowed-tools: Read, Grep, Glob, Bash, WebSearch
+---
+
+# Tests Responsive Mobile
+
+Guide les tests de responsive design et compatibilité mobile pour garantir une expérience optimale sur tous les appareils.
+
+## Table des matières
+
+- [Quand utiliser](#quand-utiliser)
+- [Viewports essentiels](#viewports-essentiels)
+- [Outils de test](#outils-de-test)
+- [Checklist responsive](#checklist-responsive)
+- [Workflow de test](#workflow-de-test)
+- [Checklist finale](#checklist-finale)
+- [En cas de doute](#en-cas-de-doute)
+
+## Quand utiliser
+
+- Modifications CSS responsive
+- Ajout de touch controls
+- Avant chaque release
+- Bugs reportés sur mobile
+- Tests performance mobile
+
+## Viewports essentiels
+
+**Desktop:** 1920×1080, 1366×768
+**Tablet:** 768×1024, 1024×768
+**Mobile:** 375×667, 390×844, 412×915
+
+Trouve les breakpoints CSS utilisés dans le projet.
+
+## Outils de test
+
+### Chrome DevTools Device Mode
+
+Émule différents appareils :
+
+- Viewports prédéfinis
+- Touch simulation
+- Network/CPU throttling
+
+### Chrome DevTools MCP
+
+- Capture screenshots multi-device
+- Tests automatisés layout
+- Performance profiling
+
+### Tests sur vrais appareils
+
+**Essentiels :**
+
+- iPhone (iOS récent)
+- Android (version récente)
+
+**Pourquoi :**
+
+- Touch réel ≠ simulation
+- Performance réelle
+- Bugs spécifiques device
+
+## Checklist responsive
+
+### 1. Layout
+
+- Layout fluide (pas de horizontal scroll)
+- Contenu lisible sans zoom
+- Images redimensionnées
+- Colonnes en stack mobile
+
+### 2. Touch targets
+
+**Taille minimum :**
+
+- 44×44 px (iOS)
+- 48×48 px (Android)
+- 8px espacement minimum
+
+Trouve les tailles de touch targets dans le CSS.
+
+### 3. Navigation mobile
+
+- Menu burger accessible
+- Animation fluide
+- Fermeture backdrop ou X
+- Pas de piège clavier
+
+### 4. Touch interactions
+
+**Supportés :**
+
+- Tap (pas de hover requis)
+- Swipe si applicable
+- Pinch-zoom si pertinent
+
+**Éviter :**
+
+- Hover-only interactions
+- Gestures complexes
+
+Trouve les touch handlers dans le JavaScript.
+
+### 5. Formulaires mobiles
+
+**Optimisations :**
+
+- Input type approprié (`email`, `tel`, `number`)
+- `autocomplete` actif
+- Labels visibles
+- Clavier adapté au type
+
+Examine les formulaires et leur configuration.
+
+### 6. Images responsive
+
+**Techniques :**
+
+- `srcset` pour résolutions multiples
+- `<picture>` pour art direction
+- Lazy loading
+- WebP avec fallback
+
+Trouve la stratégie d'images responsive.
+
+### 7. Typography
+
+**Tailles :**
+
+- 16px minimum corps de texte
+- Line-height ≥ 1.5
+- rem/em pour scalabilité
+
+Examine les tailles de police CSS.
+
+### 8. Performance mobile
+
+**Métriques cibles :**
+
+- First Contentful Paint < 2s (3G)
+- Time to Interactive < 5s (3G)
+- Lighthouse Performance > 80
+
+Lance Lighthouse en mode mobile.
+
+## Workflow de test
+
+### 1. Tests DevTools
+
+Pour chaque viewport clé :
+
+- Layout adaptatif
+- Touch targets simulation
+- Performance
+- Screenshot
+
+### 2. Tests vrais devices
+
+iPhone et Android :
+
+- Navigation complète
+- Touch interactions réelles
+- Formulaires
+- Jeux arcade si applicable
+
+### 3. Tests throttling
+
+Avec 3G + 4x CPU :
+
+- Temps de chargement
+- Fluidité interactions
+- FPS jeux arcade
+
+### 4. Corrections
+
+Priorise :
+
+1. Bloquants (layout cassé)
+2. UX dégradée (touch targets petits)
+3. Performance (chargement lent)
+
+## Checklist finale
+
+- [ ] Tous viewports testés (mobile, tablet, desktop)
+- [ ] Touch targets ≥ 44×44 px
+- [ ] Pas de horizontal scroll
+- [ ] Menu mobile fonctionnel
+- [ ] Formulaires optimisés (input types)
+- [ ] Images responsive (srcset/picture)
+- [ ] Typography lisible (16px min)
+- [ ] Performance 3G acceptable (< 5s TTI)
+- [ ] Testé sur vrais appareils (iOS + Android)
+- [ ] Lighthouse Mobile > 80
+- [ ] Pas de hover-only interactions
+
+## En cas de doute
+
+**Source :** Vrais appareils + Lighthouse Mobile
+
+**Règles absolues :**
+
+1. Toujours tester sur vrais appareils (iOS + Android)
+2. Toujours tester avec 3G throttling
+3. Touch targets minimum 44×44 px
+4. Jamais hover-only interactions
+5. Lighthouse Mobile > 80 obligatoire
+
+**Workflow minimal :**
+
+- DevTools pour iterations rapides
+- Vrais appareils pour validation finale
+- Lighthouse mobile pour métriques