feat: update web page

SirusCodes · Feb 20, 2025 · 1da239e · 1da239e
1 parent 37f6322
commit 1da239e
Show file tree

Hide file tree

Showing 7 changed files with 32 additions and 16 deletions.
diff --git a/web/assets/favicon.ico b/web/assets/favicon.ico
diff --git a/web/assets/github.png b/web/assets/github.png
diff --git a/web/assets/logo.png b/web/assets/logo.png
diff --git a/web/script.js → web/assets/script.js b/web/script.js → web/assets/script.js
diff --git a/web/styles.css → web/assets/styles.css b/web/styles.css → web/assets/styles.css
@@ -1,8 +1,8 @@
 body {
     margin: 0;
     font-family: 'Roboto', sans-serif;
-    background-color: #263238;
-    color: #c5c6c7;
+    background-color: #121212;
+    color: #E0E0E0;
     display: flex;
     flex-direction: column;
     height: 100vh;
@@ -12,14 +12,13 @@ body {
     display: flex;
     justify-content: space-between;
     padding: 10px 20px;
-    background-color: #37474F;
+    background-color: #1E1E1E;
     color: white;
     align-items: center;
 }
 
 .title {
-    font-size: 24px;
-    font-weight: bold;
+    font-size: 25px;
 }
 
 .repo-link a {
@@ -32,28 +31,37 @@ body {
     height: 24px;
 }
 
+.logo-icon {
+    width: 60px;
+}
+
+.logo-title {
+    display: flex;
+    align-items: center;
+}
+
 .toolbar {
     display: flex;
     justify-content: flex-start;
     padding: 10px 20px;
-    background-color: #455A64;
+    background-color: #2C2C2C;
     align-items: center;
 }
 
 .button {
     margin-right: 10px;
-    background-color: #80CBC4;
+    background-color: #424242;
     border: none;
     padding: 10px 20px;
-    color: #263238;
+    color: #E0E0E0;
     cursor: pointer;
     border-radius: 4px;
     font-size: 14px;
     transition: background-color 0.3s ease;
 }
 
 .button:hover {
-    background-color: #4DB6AC;
+    background-color: #616161;
 }
 
 #codeArea {
@@ -65,8 +73,8 @@ body {
     box-sizing: border-box;
     font-family: monospace;
     font-size: 16px;
-    background-color: #37474F;
-    color: #c5c6c7;
+    background-color: #1E1E1E;
+    color: #E0E0E0;
     resize: none;
     overflow-y: auto;
     border-radius: 4px;

diff --git a/web/github.png b/web/github.png
diff --git a/web/index.html b/web/index.html
@@ -1,16 +1,24 @@
-<html>
+<!DOCTYPE html>
+<html lang="en">
     <head>
         <title>AntiLang Interpreter</title>
         <meta charset="utf-8"/>
         <meta name="viewport" content="width=device-width, initial-scale=1"/>
-        <link rel="stylesheet" href="styles.css">
+        <link rel="shortcut icon" href="./assets/favicon.ico" type="image/x-icon">
+        <link rel="icon" href="./assets/favicon.ico" type="image/x-icon">
+        <link rel="stylesheet" href="./assets/styles.css">
     </head>
     <body>
         <div class="header">
-            <div class="title">AntiLang</div>
+            <div class="logo-title">
+                <div class="logo">
+                    <img src="./assets/logo.png" alt="Logo" class="logo-icon">
+                </div>
+                <div class="title">AntiLang</div>
+            </div>
             <div class="repo-link">
                 <a href="https://github.com/SirusCodes/AntiLang" target="_blank">
-                    <img src="github.png" alt="GitHub" class="github-icon">
+                    <img src="./assets/github.png" alt="GitHub" class="github-icon">
                 </a>
             </div>
         </div>
@@ -21,6 +29,6 @@
         <div id="terminal" class="terminal"></div>
 
         <script src="wasm_exec.js"></script>
-        <script src="script.js"></script>
+        <script src="./assets/script.js"></script>
     </body>
 </html>