feat: enhance lesson preview functionality and improve run button interaction; change lesson indicator to percentage; split preview css for better isolation

This commit is contained in:
Michael Czechowski
2025-05-19 23:30:22 +02:00
parent 1e81d0e66b
commit 1f50963028
5 changed files with 518 additions and 544 deletions

View File

@@ -130,18 +130,6 @@ export class LessonEngine {
// Get the complete CSS by combining all parts
const userCssWithWrapper = this.getCompleteCss();
// Create the complete CSS by combining base CSS with user code and sandbox CSS
const combinedCSS = `
/* Base CSS */
${previewBaseCSS || ""}
/* User Code */
${userCssWithWrapper || ""}
/* Sandbox CSS (for visualizing the exercise) */
${sandboxCSS || ""}
`;
// Write the content to the iframe
const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
iframeDoc.open();
@@ -149,7 +137,9 @@ export class LessonEngine {
<!DOCTYPE html>
<html>
<head>
<style>${combinedCSS}</style>
<style>${previewBaseCSS}</style>
<style>${userCssWithWrapper}</style>
<style>${sandboxCSS}</style>
</head>
<body>
${previewHTML || "<div>No preview available</div>"}