Update index.html

KittyLinux2Win · Nov 18, 2024 · 43fd360 · 43fd360
1 parent c27d4e9
commit 43fd360
Showing 1 changed file with 20 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -8,6 +8,7 @@
     <script src="https://cdn.tailwindcss.com"></script>
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
     <link rel="stylesheet" href="./src/css/fonts.css">
+    <link rel="stylesheet" href="./src/css/console.css">
 </head>
 <body class="bg-gray-100 text-gray-900 font-sans dark:bg-gray-900 dark:text-gray-200">
     <header class="bg-white dark:bg-dark shadow-md sticky top-0 z-50">
@@ -78,6 +79,24 @@ <h3 class="text-xl font-semibold text-primary mb-4">Coming soon</h3>
                 </div>
             </div>
         </section>
+
+        <section id="console-emulator" class="bg-darker text-white py-20">
+            <div class="container mx-auto px-6">
+                <h2 class="text-3xl font-bold text-center text-gray-200 mb-10">OpenSource</h2>
+                <div class="bg-black p-6 rounded-lg shadow-lg w-full max-w-4xl mx-auto relative">
+                  <!-- Console Header -->
+                  <div class="flex items-center gap-2 mb-4">
+                    <div class="w-3 h-3 rounded-full bg-red-500"></div>
+                    <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
+                    <div class="w-3 h-3 rounded-full bg-green-500"></div>
+                  </div>
+                  <!-- Console Body -->
+                  <div id="console-output" class="text-green-400 font-mono text-lg whitespace-pre-wrap">
+                    <!-- Dynamic typing area -->
+                  </div>
+                </div>
+            </div>
+        </section>
 
     </main>
 
@@ -114,6 +133,7 @@ <h3 class="text-lg font-semibold mb-2 text-center">OpenSource</h3>
         </div>
     </footer>
     <script src="./src/js/nav.js"></script>
+    <script src="./src/js/console.js"></script>
     <script src="./src/js/tailwind.config.js"></script>
 </body>
 </html>