feat: implement #4 — replace answer-revealing validation messages with pedagogical hints

Rewrite ~120 validation error messages across 17 English lesson modules
and their localized variants (ar, de, es, pl, uk) to use concept questions,
property hints, and directional nudges instead of revealing the exact
CSS property-value answers.

Priority modules (flexbox, box-model, colors, positioning) fully rewritten.
All remaining CSS modules updated. Only message strings changed — no
validation logic modifications.
This commit is contained in:
2026-03-28 19:40:28 +01:00
parent 782e87705c
commit c560676544
50 changed files with 434 additions and 403 deletions

View File

@@ -34,7 +34,7 @@
{
"type": "property_value",
"value": { "property": "background", "expected": "lightcoral" },
"message": "Setze <kbd>background: lightcoral</kbd>",
"message": "Überprüfe die <kbd>background</kbd>-Eigenschaft innerhalb der Media Query",
"options": { "exact": false }
}
]
@@ -53,7 +53,11 @@
"solution": " font-size: 5vw;",
"previewContainer": "preview-area",
"validations": [
{ "type": "property_value", "value": { "property": "font-size", "expected": "5vw" }, "message": "Setze <kbd>font-size: 5vw</kbd>" }
{
"type": "property_value",
"value": { "property": "font-size", "expected": "5vw" },
"message": "Welche Eigenschaft steuert die Schriftgröße? Welche Viewport-Einheit skaliert mit der Breite?"
}
]
},
{
@@ -73,7 +77,7 @@
{
"type": "property_value",
"value": { "property": "display", "expected": "grid" },
"message": "Setze <kbd>display: grid</kbd>"
"message": "Welcher Display-Wert aktiviert das CSS-Grid-Layout?"
},
{
"type": "regex",
@@ -84,7 +88,7 @@
{
"type": "property_value",
"value": { "property": "gap", "expected": "1rem" },
"message": "Setze <kbd>gap: 1rem</kbd>"
"message": "Welche Eigenschaft steuert den Abstand zwischen Grid-Zellen?"
}
]
},
@@ -117,7 +121,7 @@
{
"type": "property_value",
"value": { "property": "width", "expected": "250px" },
"message": "Setze <kbd>width: 250px</kbd>",
"message": "Überprüfe die <kbd>width</kbd>-Eigenschaft für die Sidebar",
"options": { "exact": false }
}
]