fix(i18n): sync all lesson translations with English source
Synchronizes 72 lesson files across 5 languages (de, pl, es, ar, uk) to match the English source. This ensures code, solutions, and validations are identical while only title, description, task, and message fields are translated. Changes include: - Box model lessons (01-box-model.json) - Units and variables (05-units-variables.json) - Transitions and animations (06-transitions-animations.json) - Responsive design (08-responsive.json) - HTML elements (20-html-elements.json) - HTML forms basic and validation (21, 22) - HTML details/summary, progress/meter (23, 24) - HTML datalist, dialog, fieldset (25, 27, 28) - HTML tables and SVG (30, 32) - HTML marquee (31) - Welcome module (00-welcome.json) Fixes validation inconsistencies and removes extra content that exceeded English source. German translations were largely correct; Polish, Spanish, Arabic, and Ukrainian required full translations.
This commit is contained in:
@@ -2,65 +2,65 @@
|
||||
"$schema": "../../schemas/code-crispies-module-schema.json",
|
||||
"id": "html-elements",
|
||||
"title": "HTML Block & Inline",
|
||||
"description": "Understanding the fundamental difference between container (block) and inline elements",
|
||||
"description": "Зрозумійте основну різницю між контейнерними (блоковими) та рядковими елементами",
|
||||
"mode": "html",
|
||||
"difficulty": "beginner",
|
||||
"lessons": [
|
||||
{
|
||||
"id": "block-vs-inline-intro",
|
||||
"title": "Block vs Inline Elements",
|
||||
"description": "HTML elements fall into two main categories:<br><br><strong>Block elements</strong> (containers) start on a new line and take full width. Examples: <kbd><div></kbd>, <kbd><p></kbd>, <kbd><h1></kbd>, <kbd><section></kbd><br><br><strong>Inline elements</strong> flow within text and only take needed width. Examples: <kbd><span></kbd>, <kbd><a></kbd>, <kbd><strong></kbd>, <kbd><em></kbd>",
|
||||
"task": "Wrap the word <kbd>important</kbd> with <kbd><strong></kbd> tags to make it bold. Notice how the paragraph (block) takes full width while strong (inline) flows with text.",
|
||||
"title": "Блокові vs рядкові елементи",
|
||||
"description": "HTML елементи поділяються на дві основні категорії:<br><br><strong>Блокові елементи</strong> (контейнери) починаються з нового рядка і займають повну ширину. Приклади: <kbd><div></kbd>, <kbd><p></kbd>, <kbd><h1></kbd>, <kbd><section></kbd><br><br><strong>Рядкові елементи</strong> розміщуються всередині тексту і займають лише необхідну ширину. Приклади: <kbd><span></kbd>, <kbd><a></kbd>, <kbd><strong></kbd>, <kbd><em></kbd>",
|
||||
"task": "Оберніть слово <kbd>важливе</kbd> тегами <kbd><strong></kbd>, щоб зробити його жирним. Зверніть увагу, як абзац (блок) займає повну ширину, тоді як strong (рядковий) тече з текстом.",
|
||||
"previewHTML": "",
|
||||
"previewBaseCSS": "body { font-family: system-ui, sans-serif; padding: 20px; } p { background: #e3f2fd; padding: 10px; } strong { background: #ffecb3; }",
|
||||
"sandboxCSS": "",
|
||||
"initialCode": "<p>This is a paragraph with an important word.</p>",
|
||||
"solution": "<p>This is a paragraph with an <strong>important</strong> word.</p>",
|
||||
"initialCode": "<p>Це абзац з важливе словом.</p>",
|
||||
"solution": "<p>Це абзац з <strong>важливе</strong> словом.</p>",
|
||||
"previewContainer": "preview-area",
|
||||
"validations": [
|
||||
{
|
||||
"type": "element_exists",
|
||||
"value": "p",
|
||||
"message": "Add a <kbd><p></kbd> paragraph element"
|
||||
"message": "Додайте елемент абзацу <kbd><p></kbd>"
|
||||
},
|
||||
{
|
||||
"type": "parent_child",
|
||||
"value": { "parent": "p", "child": "strong" },
|
||||
"message": "Wrap the word <kbd>important</kbd> with <kbd><strong></kbd> tags"
|
||||
"message": "Оберніть слово <kbd>важливе</kbd> тегами <kbd><strong></kbd>"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "semantic-containers",
|
||||
"title": "Semantic Tags",
|
||||
"description": "Modern HTML uses semantic containers that describe their content:<br><br><kbd><header></kbd> - Page or section header<br><kbd><nav></kbd> - Navigation links<br><kbd><main></kbd> - Main content area<br><kbd><section></kbd> - Thematic grouping<br><kbd><article></kbd> - Self-contained content<br><kbd><footer></kbd> - Page or section footer",
|
||||
"task": "Create a basic page structure:<br>1. Add a <kbd><header></kbd> with an <kbd><h1></kbd> containing the text <code>My Website</code><br>2. Add a <kbd><main></kbd> element with a paragraph saying <code>Welcome to my site!</code><br>3. Add a <kbd><footer></kbd> with a paragraph saying <code>Copyright 2026</code>",
|
||||
"title": "Семантичні теги",
|
||||
"description": "Сучасний HTML використовує семантичні контейнери, які описують свій вміст:<br><br><kbd><header></kbd> - Заголовок сторінки або секції<br><kbd><nav></kbd> - Навігаційні посилання<br><kbd><main></kbd> - Основний вміст<br><kbd><section></kbd> - Тематичне групування<br><kbd><article></kbd> - Самостійний вміст<br><kbd><footer></kbd> - Підвал сторінки або секції",
|
||||
"task": "Створіть базову структуру сторінки:<br>1. Додайте <kbd><header></kbd> з <kbd><h1></kbd>, що містить текст <code>Мій Сайт</code><br>2. Додайте елемент <kbd><main></kbd> з абзацом, що каже <code>Ласкаво просимо на мій сайт!</code><br>3. Додайте <kbd><footer></kbd> з абзацом, що каже <code>Copyright 2026</code>",
|
||||
"previewHTML": "",
|
||||
"previewBaseCSS": "body { font-family: system-ui; margin: 0; } header { background: #1976d2; color: white; padding: 15px; } main { padding: 20px; min-height: 100px; } footer { background: #424242; color: white; padding: 10px; text-align: center; }",
|
||||
"sandboxCSS": "",
|
||||
"initialCode": "",
|
||||
"solution": "<header>\n <h1>My Website</h1>\n</header>\n<main>\n <p>Welcome to my site!</p>\n</main>\n<footer>\n <p>Copyright 2026</p>\n</footer>",
|
||||
"solution": "<header>\n <h1>Мій Сайт</h1>\n</header>\n<main>\n <p>Ласкаво просимо на мій сайт!</p>\n</main>\n<footer>\n <p>Copyright 2026</p>\n</footer>",
|
||||
"previewContainer": "preview-area",
|
||||
"validations": [
|
||||
{
|
||||
"type": "element_exists",
|
||||
"value": "header",
|
||||
"message": "Add a <kbd><header></kbd> element"
|
||||
"message": "Додайте елемент <kbd><header></kbd>"
|
||||
},
|
||||
{
|
||||
"type": "element_exists",
|
||||
"value": "main",
|
||||
"message": "Add a <kbd><main></kbd> element"
|
||||
"message": "Додайте елемент <kbd><main></kbd>"
|
||||
},
|
||||
{
|
||||
"type": "element_exists",
|
||||
"value": "footer",
|
||||
"message": "Add a <kbd><footer></kbd> element"
|
||||
"message": "Додайте елемент <kbd><footer></kbd>"
|
||||
},
|
||||
{
|
||||
"type": "parent_child",
|
||||
"value": { "parent": "header", "child": "h1" },
|
||||
"message": "Add an <kbd><h1></kbd> heading inside your header"
|
||||
"message": "Додайте заголовок <kbd><h1></kbd> всередині header"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user