Spaces:

victor
/

HTML-playground

Running

victor HF staff commited on 4 days ago

Commit

3620c5a

1 Parent(s): ad91862

fix: Simplify textarea content to remove duplicate HTML structure

Files changed (1) hide show

index.html CHANGED Viewed

@@ -9,33 +9,26 @@
 <body class="m-0 p-0">
     <div class="grid grid-cols-1 md:grid-cols-2 w-screen h-screen divide-x divide-amber-300">
         <div class="bg-gray-100">
-            <textarea id="code-input" class="w-full h-full font-mono p-4 resize-none focus:outline-none"><!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Document</title>
-    <style>
-        body {
-            font-family: Arial, sans-serif;
-            background-color: #f0f0f0;
-        }
-        h1 {
-            color: navy;
-        }
-    </style>
-</head>
-<body>
-    <h1>Welcome to the HTML Playground</h1>
-    <p id="message">Click the button to change this text.</p>
-    <button onclick="changeText()">Change Text</button>
-    <script>
-        function changeText() {
-            document.getElementById('message').innerText = 'Text changed!';
-        }
-    </script>
-</body>
-</html></textarea>
         </div>
         <div class="bg-white">
             <iframe id="output" class="w-full h-full border-none"></iframe>

 <body class="m-0 p-0">
     <div class="grid grid-cols-1 md:grid-cols-2 w-screen h-screen divide-x divide-amber-300">
         <div class="bg-gray-100">
+            <textarea id="code-input" class="w-full h-full font-mono p-4 resize-none focus:outline-none"><h1>Welcome to the HTML Playground</h1>
+<p id="message">Click the button to change this text.</p>
+<button onclick="changeText()">Change Text</button>
+<style>
+    body {
+        font-family: Arial, sans-serif;
+        background-color: #f0f0f0;
+        padding: 20px;
+    }
+    h1 {
+        color: navy;
+    }
+</style>
+<script>
+    function changeText() {
+        document.getElementById('message').innerText = 'Text changed!';
+    }
+</script></textarea>
         </div>
         <div class="bg-white">
             <iframe id="output" class="w-full h-full border-none"></iframe>