feat: add complete German translation of the website

- Add German HTML entry point (index.de.html)
- Add German app.js with translated UI strings (app.de.js)
- Add German lesson config (lessons.de.js)
- Add German translations of all 6 lesson modules:
  - HTML Elements: Block vs Inline
  - HTML Forms: Basic Inputs
  - HTML Forms: Validation
  - CSS: Basic Selectors
  - CSS: Advanced Selectors
  - Tailwind: Basics

All IDs, variable names, and code examples remain in English.
Only user-facing text has been translated to German.

src/config/lessons.de.js

@@ -0,0 +1,111 @@
+/**
+ * Lesson Config (German) - Functions for loading lesson configurations
+ */
+
+// Import German lesson configs
+import basicSelectorsConfig from "../../lessons/de/00-basic-selectors.json";
+import advancedSelectorsConfig from "../../lessons/de/01-advanced-selectors.json";
+import tailwindConfig from "../../lessons/de/10-tailwind-basics.json";
+// HTML lessons
+import htmlElementsConfig from "../../lessons/de/20-html-elements.json";
+import htmlFormsBasicConfig from "../../lessons/de/21-html-forms-basic.json";
+import htmlFormsValidationConfig from "../../lessons/de/22-html-forms-validation.json";
+
+// Module store
+const moduleStore = [
+	htmlElementsConfig,
+	htmlFormsBasicConfig,
+	htmlFormsValidationConfig,
+	basicSelectorsConfig,
+	advancedSelectorsConfig,
+	tailwindConfig
+];
+
+/**
+ * Load all available modules
+ * @returns {Promise<Array>} Promise resolving to array of modules
+ */
+export async function loadModules() {
+	return moduleStore.map((module) => ({
+		...module,
+		lessons: module.lessons.map((lesson) => ({
+			...lesson,
+			mode: module.mode || "css"
+		}))
+	}));
+}
+
+/**
+ * Get a module by its ID
+ * @param {string} moduleId - The module ID to find
+ * @returns {Object|null} The module object or null if not found
+ */
+export function getModuleById(moduleId) {
+	return moduleStore.find((module) => module.id === moduleId) || null;
+}
+
+/**
+ * Load module configs from a URL
+ * @param {string} url - URL to load the config from
+ * @returns {Promise<Object>} Promise resolving to the module config
+ */
+export async function loadModuleFromUrl(url) {
+	try {
+		const response = await fetch(url);
+		if (!response.ok) {
+			throw new Error(`Failed to load module: ${response.status} ${response.statusText}`);
+		}
+
+		const moduleConfig = await response.json();
+		validateModuleConfig(moduleConfig);
+
+		return moduleConfig;
+	} catch (error) {
+		console.error("Error loading module from URL:", error);
+		throw error;
+	}
+}
+
+/**
+ * Validate a module configuration
+ * @param {Object} config - The module configuration to validate
+ * @throws {Error} If the configuration is invalid
+ */
+function validateModuleConfig(config) {
+	// Required fields
+	if (!config.id) throw new Error('Module config missing "id"');
+	if (!config.title) throw new Error('Module config missing "title"');
+	if (!Array.isArray(config.lessons)) throw new Error('Module config missing "lessons" array');
+
+	// Check each lesson
+	config.lessons.forEach((lesson, index) => {
+		if (!lesson.title) throw new Error(`Lesson ${index} missing "title"`);
+		if (!lesson.previewHTML) throw new Error(`Lesson ${index} missing "previewHTML"`);
+	});
+}
+
+/**
+ * Add a custom module to the store
+ * @param {Object} moduleConfig - The module configuration to add
+ * @returns {boolean} Success status
+ */
+export function addCustomModule(moduleConfig) {
+	try {
+		validateModuleConfig(moduleConfig);
+
+		// Check if module with same ID already exists
+		const existingIndex = moduleStore.findIndex((m) => m.id === moduleConfig.id);
+		if (existingIndex >= 0) {
+			// Replace existing module
+			moduleStore[existingIndex] = moduleConfig;
+		} else {
+			// Add new module
+			moduleStore.push(moduleConfig);
+		}
+
+		return true;
+	} catch (error) {
+		console.error("Error adding custom module:", error);
+		return false;
+	}
+}