update

backend/generator.py

@@ -452,6 +452,31 @@ async def generate_baustein_detail(baustein_id: str, topic: str, title: str) ->
         pass
 
 
+async def rework_baustein(baustein_id: str, topic: str, title: str, current: dict, instructions: str) -> None:
+    try:
+        prompt = _build_baustein_rework_prompt(topic, title, current, instructions)
+        returncode, stdout, stderr = await _run_claude("baustein-" + baustein_id, prompt, 60, tools=None)
+
+        if returncode != 0:
+            return
+
+        data = _parse_json(stdout)
+        if not isinstance(data, dict):
+            return
+
+        now = datetime.now(timezone.utc).isoformat()
+        await update_baustein(
+            baustein_id,
+            title=data.get("title", title),
+            description=data.get("description", ""),
+            purpose=data.get("purpose", ""),
+            example=json.dumps(data.get("examples", []), ensure_ascii=False),
+            updated_at=now,
+        )
+    except Exception:
+        pass
+
+
 def _build_baustein_rework_prompt(topic: str, title: str, current: dict, instructions: str) -> str:
     current_json = json.dumps({
         "title": title,
@@ -468,31 +493,9 @@ AKTUELLER STAND:
 ANWEISUNGEN VOM NUTZER:
 {instructions}
 
-Antworte AUSSCHLIESSLICH mit einem JSON-Objekt mit den Feldern "description", "purpose", "examples".
+Antworte AUSSCHLIESSLICH mit einem JSON-Objekt mit den Feldern "title", "description", "purpose", "examples".
 "examples" ist ein Array mit Objekten {{"label": "...", "code": "..."}}.
 Kein weiterer Text, nur das JSON.
 """
 
 
-async def rework_baustein(baustein_id: str, topic: str, title: str, current: dict, instructions: str) -> None:
-    try:
-        prompt = _build_baustein_rework_prompt(topic, title, current, instructions)
-        returncode, stdout, stderr = await _run_claude("baustein-" + baustein_id, prompt, 60, tools=None)
-
-        if returncode != 0:
-            return
-
-        data = _parse_json(stdout)
-        if not isinstance(data, dict):
-            return
-
-        now = datetime.now(timezone.utc).isoformat()
-        await update_baustein(
-            baustein_id,
-            description=data.get("description", ""),
-            purpose=data.get("purpose", ""),
-            example=json.dumps(data.get("examples", []), ensure_ascii=False),
-            updated_at=now,
-        )
-    except Exception:
-        pass

frontend/src/components/BausteineView.vue

@@ -373,7 +373,6 @@ onUnmounted(stopPolling)
   font-family: -apple-system, sans-serif;
   font-size: 10px;
   font-weight: 700;
-  text-transform: uppercase;
   letter-spacing: 1px;
   color: #8be9fd;
   margin-bottom: 4px;

templates/Format/Baustein.md

@@ -30,7 +30,7 @@ TYPOGRAFIE
 - Beschreibung: 14px, line-height 1.55
 - Zweck: 14px, italic, color #5a6470
 - Code: "SF Mono", Consolas, monospace, 12px, line-height 1.5
-- Code-Label: 10px, uppercase, letter-spacing 1px
+- Code-Label: 10px, letter-spacing 1px
 
 FARBEN
 - Card-Hintergrund: #ffffff
@@ -49,13 +49,24 @@ FARBEN
 - Label-Farbe in Code: #8be9fd (cyan)
 
 INHALTLICHE PRINZIPIEN
-- Titel: nur der Baustein-Name, kein Präfix, keine Variante
-- Beschreibung: 1 Satz, was es macht (mechanisch, neutral)
-- Zweck: 1 Satz, wofür man es nutzt (Anwendungsfall)
-- Beide Sätze knapp wie möglich, jedes überflüssige Wort raus
+- Titel: GELÄUFIGSTER Kurzbegriff, max 1-2 Wörter, kein Präfix, keine Variante
+  - Gut: "Header", "Variable", "Klasse", "for-Schleife"
+  - Schlecht: "Überschriften h1–h6", "Variablen-Deklaration mit Typ"
+- Beschreibung: WAS macht es mechanisch? 1 Satz, max 5 Wörter, abstrakt/technisch
+  - Gut: "Definiert eine Überschrift.", "Wiederholt einen Code-Block."
+  - Schlecht: "Sechs Ebenen von der wichtigsten bis zur untergeordneten Überschrift."
+- Zweck: WANN brauche ich das? 1 Satz, max 5 Wörter, situativ/Problem-Trigger
+  - Gut: "Strukturiert die Seiteninhalte.", "Liste oder Bereich durchgehen."
+  - Schlecht: "Gliedert Inhalt in Hierarchie für Leser, SEO und Screenreader-Navigation."
+- WICHTIG: Beschreibung und Zweck dürfen sich NICHT inhaltlich überschneiden
+  - Schlecht (tautologisch): Beschreibung "Wiederholt Code." / Zweck "Etwas mehrfach tun."
+  - Gut (distinkt): Beschreibung "Wiederholt einen Code-Block." / Zweck "Liste oder Bereich durchgehen."
+- Beide Sätze: jedes überflüssige Wort raus, keine Aufzählungen, keine Komma-Listen
 - Genau EIN Code-Beispiel: das relevanteste / häufigste / typischste
 - Beispiel zeigt den Standard-Use-Case, nicht Edge-Cases
-- Knappes Label über dem Beispiel (2-4 Wörter, uppercase)
+- Label über Beispiel: max 2-3 Wörter, einfach, beschreibend
+  - Gut: "Alle Header", "Zuweisung", "Grund-Regel"
+  - Schlecht: "Alle Ebenen h1–h6", "Variable mit Typ-Hint deklarieren"
 
 LAYOUT-DETAILS
 - Header und Body keine separaten Sektionen, alles in einer Card
@@ -93,7 +104,9 @@ GENERIERUNG MIT FEEDBACK-LOOP
 2. In Browser anzeigen (Playwright-Screenshot oder direkt)
 3. Prüfen:
    - Wirklich nur 4 Elemente (Titel, Beschreibung, Zweck, Beispiel)?
-   - Beschreibung und Zweck unter 15 Wörtern?
+   - Beschreibung und Zweck je max 5 Wörter?
+   - Titel max 1-2 Wörter, geläufiger Kurzbegriff?
+   - Label max 2-3 Wörter, simpel?
    - Code-Beispiel unter 8 Zeilen?
    - Label über Code-Block kurz und prägnant?
    - Card kompakt, kein leerer Raum?

templates/Referenz/Baustein.md

@@ -70,7 +70,6 @@ h1 {
   font-family: -apple-system, sans-serif;
   font-size: 10px;
   font-weight: 700;
-  text-transform: uppercase;
   letter-spacing: 1px;
   color: #8be9fd;
   margin-bottom: 6px;
@@ -88,9 +87,9 @@ h1 {
 
   <h1>for-Schleife</h1>
 
-  <p class="beschreibung">Führt einen Code-Block wiederholt aus.</p>
+  <p class="beschreibung">Wiederholt einen Code-Block.</p>
 
-  <p class="zweck">Wiederholung wenn Anzahl Durchläufe bekannt ist oder Index gebraucht wird.</p>
+  <p class="zweck">Liste oder Bereich durchgehen.</p>
 
   <div class="examples">