gemini-design-mcp 3.12.5 → 3.12.7

package/build/prompts/system.js

@@ -245,7 +245,7 @@ Gut-check questions to ensure you're not shipping mediocrity:
 
 **Code Quality**: Production-grade, functional, and clean. No placeholder content unless explicitly temporary.
 
-**Styling**: Use Tailwind CSS (with arbitrary values \`[]\` for precision) or custom CSS/SCSS as appropriate for the project.
+**Styling**: Use the styling approach specified in the tech stack or design system. Adapt to whatever CSS framework or methodology the project uses.
 
 **Responsiveness**: Design for all viewports. Mobile should feel intentional, not cramped.
 
@@ -605,8 +605,8 @@ UTILISER EXACTEMENT :
 // =============================================================================
 export const DESIGN_SYSTEM_USAGE_INSTRUCTIONS = `
 RÈGLE CRITIQUE - DESIGN SYSTEM OBLIGATOIRE:
-Si un design system est fourni dans le context, tu DOIS :
-- Copier EXACTEMENT les classes Tailwind spécifiées
+Si un design system est fourni, tu DOIS :
+- Copier EXACTEMENT les styles, classes, et patterns spécifiés
 - NE JAMAIS inventer de nouvelles couleurs, paddings, ou border-radius
 - Utiliser les composants définis (Button Primary, Input, Card, etc.)
 - Respecter les tailles définies (sm/md/lg) sans les modifier
@@ -650,7 +650,7 @@ RÈGLES CRITIQUES:
    (et ainsi de suite jusqu'à VIBE_5)
 
 2. CHAQUE section doit être COMPLÈTE et auto-suffisante:
-   - Tous les styles Tailwind inline
+   - Tous les styles inline (selon le tech stack)
    - Extractible telle quelle sans modification
    - Pas de dépendances sur d'autres sections
 
@@ -667,7 +667,7 @@ RÈGLES CRITIQUES:
    - Border-radius différent
    - Effets différents (shadows, gradients, etc.)
 
-5. Inclure TOUTES les classes Tailwind inline - AUCUNE variable externe, AUCUN CSS custom
+5. Inclure TOUS les styles inline - AUCUNE variable externe, AUCUN fichier CSS séparé
 
 OUTPUT: Une page React/HTML complète et fonctionnelle avec les 5 sections bien marquées. Le code doit être prêt à être sauvegardé et ouvert dans un navigateur.`;
 

package/build/tools/create-frontend.js

@@ -7,7 +7,7 @@ export const createFrontendSchema = {
         "Be specific about functionality and content. " +
         "Example: 'A pricing page with 3 tiers (Basic, Pro, Enterprise) with feature comparison table'"),
     techStack: z.string().describe("The tech stack to use. Be specific. " +
-        "Examples: 'React + TypeScript + Tailwind CSS', 'Next.js 14 App Router + shadcn/ui', 'Vue 3 + Composition API + CSS Modules'"),
+        "Examples: 'React + TypeScript + Tailwind CSS', 'Next.js 14 App Router + shadcn/ui', 'Vue 3 + Composition API'..."),
     designSystem: z.string().describe("REQUIRED: Copy-paste the ENTIRE content of design-system.md here. " +
         "This contains ALL visual/design information: colors, typography, spacing, components styling, etc. " +
         "Do NOT summarize - paste the FULL file content as-is."),
@@ -38,7 +38,7 @@ ${context}
 TECH STACK: ${techStack}
 
 CRITICAL RULES:
-- Copy EXACTLY the Tailwind classes, colors, spacing, border-radius from the design system above.
+- Copy EXACTLY the styles, classes, colors, spacing, patterns from the design system above.
 - NEVER invent new values. The new component must look EXACTLY like the design system.
 - Implement the functional requirements from the context above.
 

package/build/tools/generate-vibes.js

@@ -12,7 +12,7 @@ export const generateVibesSchema = {
         "Exemples: 'developers', 'enterprise clients', 'young consumers', 'creative professionals'"),
     techStack: z.string().optional().describe("Tech stack pour la page de vibes. " +
         "Default: 'React + TypeScript + Tailwind CSS'. " +
-        "Exemples: 'Next.js + Tailwind', 'Vue 3 + Tailwind', 'HTML + Tailwind'"),
+        "Exemples: 'Next.js', 'Vue 3', 'HTML + CSS', 'Svelte'..."),
 };
 
 export async function generateVibes(params) {
@@ -73,7 +73,7 @@ FORMAT DU design-system.md:
 ## Instructions d'utilisation
 
 Pour tous les composants frontend:
-- Copier EXACTEMENT les classes Tailwind de ce code de référence
+- Copier EXACTEMENT les styles de ce code de référence
 - Utiliser les mêmes couleurs, spacing, border-radius
 - Maintenir la même direction esthétique
 \`\`\`

package/build/tools/modify-frontend.js

@@ -45,7 +45,7 @@ ${targetCode}
 MODIFICATION REQUESTED: ${modification}
 
 CRITICAL RULES:
-- Copy EXACTLY the Tailwind classes, colors, spacing, border-radius from the design system above.
+- Copy EXACTLY the styles, classes, colors, spacing, patterns from the design system above.
 - NEVER invent new values. The modified code must look EXACTLY like the design system.
 - Implement the functional requirements from the context above.
 

package/build/tools/snippet-frontend.js

@@ -9,7 +9,7 @@ export const snippetFrontendSchema = {
         "'A form validation function for email and password', " +
         "'A custom hook for handling API requests with loading/error states'"),
     techStack: z.string().describe("The tech stack being used. " +
-        "Examples: 'React + TypeScript + Tailwind CSS', 'Vue 3 + Composition API'"),
+        "Examples: 'React + TypeScript + Tailwind CSS', 'Vue 3 + Composition API', 'Svelte + CSS'..."),
     designSystem: z.string().describe("REQUIRED: Copy-paste the ENTIRE content of design-system.md here. " +
         "This contains ALL visual/design information: colors, typography, spacing, components styling, etc. " +
         "Do NOT summarize - paste the FULL file content as-is."),
@@ -45,7 +45,7 @@ INSERTION CONTEXT:
 ${insertionContext}
 
 CRITICAL RULES:
-- Copy EXACTLY the Tailwind classes, colors, spacing, border-radius from the design system above.
+- Copy EXACTLY the styles, classes, colors, spacing, patterns from the design system above.
 - NEVER invent new values. The snippet must look EXACTLY like the design system.
 - Implement the functional requirements from the context above.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gemini-design-mcp",
-  "version": "3.12.5",
+  "version": "3.12.7",
   "description": "MCP server that uses Gemini 3 Pro for frontend/design code generation",
   "main": "build/index.js",
   "bin": {