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,15 +2,15 @@
|
||||
"$schema": "../../schemas/code-crispies-module-schema.json",
|
||||
"id": "html-details-summary",
|
||||
"title": "HTML Details & Summary",
|
||||
"description": "Create expandable content sections without JavaScript",
|
||||
"description": "Crea secciones expandibles sin JavaScript",
|
||||
"mode": "html",
|
||||
"difficulty": "beginner",
|
||||
"lessons": [
|
||||
{
|
||||
"id": "details-summary-basic",
|
||||
"title": "First Widget",
|
||||
"description": "The <kbd><details></kbd> element creates a collapsible section. The <kbd><summary></kbd> provides the clickable label.<br><br>Click the summary to toggle the hidden content - no JavaScript needed!",
|
||||
"task": "Create a <kbd><details></kbd> element with:<br>1. A <kbd><summary></kbd> saying <code>Click to reveal</code><br>2. A <kbd><p></kbd> with the text <code>This content was hidden!</code>",
|
||||
"title": "Primer widget",
|
||||
"description": "El elemento <kbd><details></kbd> crea una sección plegable. El <kbd><summary></kbd> proporciona la etiqueta clickeable.<br><br>¡Haz clic en el resumen para mostrar el contenido oculto - sin JavaScript!",
|
||||
"task": "Crea un elemento <kbd><details></kbd> con:<br>1. Un <kbd><summary></kbd> que diga <code>Click to reveal</code><br>2. Un <kbd><p></kbd> con el texto <code>This content was hidden!</code>",
|
||||
"previewHTML": "",
|
||||
"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } details { border: 1px solid #ddd; border-radius: 8px; padding: 15px; } summary { font-weight: 600; cursor: pointer; } summary:hover { color: #1976d2; } details p { margin-top: 15px; color: #666; }",
|
||||
"sandboxCSS": "",
|
||||
@@ -21,30 +21,30 @@
|
||||
{
|
||||
"type": "element_exists",
|
||||
"value": "details",
|
||||
"message": "Add a <kbd><details></kbd> element"
|
||||
"message": "Añade un elemento <kbd><details></kbd>"
|
||||
},
|
||||
{
|
||||
"type": "element_exists",
|
||||
"value": "summary",
|
||||
"message": "Add a <kbd><summary></kbd> inside the details"
|
||||
"message": "Añade un <kbd><summary></kbd> dentro del details"
|
||||
},
|
||||
{
|
||||
"type": "parent_child",
|
||||
"value": { "parent": "details", "child": "summary" },
|
||||
"message": "The <kbd><summary></kbd> must be inside <kbd><details></kbd>"
|
||||
"message": "El <kbd><summary></kbd> debe estar dentro de <kbd><details></kbd>"
|
||||
},
|
||||
{
|
||||
"type": "parent_child",
|
||||
"value": { "parent": "details", "child": "p" },
|
||||
"message": "Add a <kbd><p></kbd> inside <kbd><details></kbd> for the hidden content"
|
||||
"message": "Añade un <kbd><p></kbd> dentro de <kbd><details></kbd> para el contenido oculto"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "details-open-attribute",
|
||||
"title": "Pre-expanded Details",
|
||||
"description": "By default, <kbd><details></kbd> is closed. Add the <kbd>open</kbd> attribute to show the content initially.<br><br>This is a boolean attribute - just add <kbd>open</kbd> without a value.",
|
||||
"task": "Add the <kbd>open</kbd> attribute to the <kbd><details></kbd> element to show the content by default.",
|
||||
"title": "Expandido por defecto",
|
||||
"description": "Por defecto, <kbd><details></kbd> está cerrado. Añade el atributo <kbd>open</kbd> para mostrar el contenido inicialmente.<br><br>Este es un atributo booleano - solo añade <kbd>open</kbd> sin valor.",
|
||||
"task": "Añade el atributo <kbd>open</kbd> al elemento <kbd><details></kbd> para mostrar el contenido por defecto.",
|
||||
"previewHTML": "",
|
||||
"previewBaseCSS": "body { font-family: system-ui; padding: 20px; } details { border: 1px solid #ddd; border-radius: 8px; padding: 15px; background: #f9f9f9; } summary { font-weight: 600; cursor: pointer; } details p { margin-top: 15px; color: #666; }",
|
||||
"sandboxCSS": "",
|
||||
@@ -55,15 +55,15 @@
|
||||
{
|
||||
"type": "attribute_value",
|
||||
"value": { "selector": "details", "attr": "open", "value": true },
|
||||
"message": "Add the <kbd>open</kbd> attribute to <kbd><details></kbd>"
|
||||
"message": "Añade el atributo <kbd>open</kbd> a <kbd><details></kbd>"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "faq-accordion",
|
||||
"title": "FAQ Accordion",
|
||||
"description": "Multiple <kbd><details></kbd> elements create an accordion-style FAQ. Each question can be expanded independently.<br><br><b>Pro tip:</b> Type <kbd>details*3>summary+p</kbd> and press Tab for Emmet expansion. <kbd>*3</kbd> creates 3 elements, <kbd>></kbd> nests inside, <kbd>+</kbd> adds siblings.",
|
||||
"task": "Create an FAQ section with:<br>1. An <kbd><h1></kbd> saying <code>Frequently Asked Questions</code><br>2. Three <kbd><details></kbd> elements, each with a question in <kbd><summary></kbd> and an answer in <kbd><p></kbd>",
|
||||
"title": "Acordeón FAQ",
|
||||
"description": "Múltiples elementos <kbd><details></kbd> crean un FAQ estilo acordeón. Cada pregunta puede expandirse independientemente.<br><br><b>Pro tip:</b> Escribe <kbd>details*3>summary+p</kbd> y presiona Tab para expansión Emmet. <kbd>*3</kbd> crea 3 elementos, <kbd>></kbd> anida dentro, <kbd>+</kbd> añade hermanos.",
|
||||
"task": "Crea una sección FAQ con:<br>1. Un <kbd><h1></kbd> que diga <code>Frequently Asked Questions</code><br>2. Tres elementos <kbd><details></kbd>, cada uno con una pregunta en <kbd><summary></kbd> y una respuesta en <kbd><p></kbd>",
|
||||
"previewHTML": "",
|
||||
"previewBaseCSS": "body { font-family: system-ui; min-height: 100vh; background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%); display: flex; flex-direction: column; justify-content: center; padding: 40px; margin: 0; box-sizing: border-box; } h1 { font-size: 2.5rem; color: #4a4a4a; text-align: center; margin: 0 0 30px 0; } details { background: white; border-radius: 12px; margin-bottom: 15px; padding: 20px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); } summary { font-size: 1.3rem; font-weight: 600; color: #5c5c5c; cursor: pointer; list-style: none; } summary::before { content: '▸ '; color: #fcb69f; } details[open] summary::before { content: '▾ '; } details p { margin: 15px 0 0 0; color: #666; line-height: 1.6; }",
|
||||
"sandboxCSS": "",
|
||||
@@ -74,22 +74,22 @@
|
||||
{
|
||||
"type": "element_exists",
|
||||
"value": "h1",
|
||||
"message": "Add an <kbd><h1></kbd> heading for the FAQ title"
|
||||
"message": "Añade un encabezado <kbd><h1></kbd> para el título del FAQ"
|
||||
},
|
||||
{
|
||||
"type": "element_count",
|
||||
"value": { "selector": "details", "min": 3 },
|
||||
"message": "Create at least 3 <kbd><details></kbd> elements for the FAQ"
|
||||
"message": "Crea al menos 3 elementos <kbd><details></kbd> para el FAQ"
|
||||
},
|
||||
{
|
||||
"type": "element_count",
|
||||
"value": { "selector": "summary", "min": 3 },
|
||||
"message": "Each <kbd><details></kbd> needs a <kbd><summary></kbd> for the question"
|
||||
"message": "Cada <kbd><details></kbd> necesita un <kbd><summary></kbd> para la pregunta"
|
||||
},
|
||||
{
|
||||
"type": "element_count",
|
||||
"value": { "selector": "details p", "min": 3 },
|
||||
"message": "Each <kbd><details></kbd> needs a <kbd><p></kbd> for the answer"
|
||||
"message": "Cada <kbd><details></kbd> necesita un <kbd><p></kbd> para la respuesta"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user