From 72684fe98180b6fd39bf23b877db781a30e66226 Mon Sep 17 00:00:00 2001
From: RedGrox <ryzijbarsik95@gmail.com>
Date: Mon, 17 Aug 2026 23:33:20 +0300
Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20?=
 =?UTF-8?q?=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86=D1=83=20projects?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 html/css/style.css       |  4 ++++
 html/index.html          |  4 ++++
 html/js/animation.js     | 46 ++++++++++++++++++++++++++++++++++++++
 html/js/app.js           | 48 ----------------------------------------
 html/projects/index.html | 19 ++++++++++++++++
 5 files changed, 73 insertions(+), 48 deletions(-)
 create mode 100644 html/js/animation.js
 create mode 100644 html/projects/index.html

diff --git a/html/css/style.css b/html/css/style.css
index b108fa3..28fd105 100644
--- a/html/css/style.css
+++ b/html/css/style.css
@@ -73,6 +73,10 @@ header {
     border: 1px solid var(--border);
     transition: 0.3s;
     margin-right: 14px;
+    font-size: 15px;
+    text-shadow: 0 0 10px var(--accent-glow);
+    color: var(--accent);
+    text-decoration: none;
 }
 
 .header-button img {
diff --git a/html/index.html b/html/index.html
index 3c92c1c..295b68e 100644
--- a/html/index.html
+++ b/html/index.html
@@ -19,6 +19,9 @@
                 AloeGames
             </div>
 
+            <a class="header-button" href="./projects/" target="_blank">
+                Projects
+            </a>
             <!-- <a class="header-button" href="https://t.me/AloeGames" rel="noopener" target="_blank">
                 <img src="https://telegram.org/img/t_logo.svg" alt="Telegram">
             </a> -->
@@ -99,6 +102,7 @@
     </footer>
 
     <script src="js/app.js"></script>
+    <script src="js/animation.js"></script>
 
 </body>
 
diff --git a/html/js/animation.js b/html/js/animation.js
new file mode 100644
index 0000000..b825b1d
--- /dev/null
+++ b/html/js/animation.js
@@ -0,0 +1,46 @@
+const canvas = document.getElementById('bgCanvas');
+const ctx = canvas.getContext('2d');
+
+function resize() {
+    canvas.width = window.innerWidth;
+    canvas.height = window.innerHeight;
+}
+
+window.addEventListener('resize', resize);
+resize();
+
+const particles = [];
+
+for (let i = 0; i < 80; i++) {
+    particles.push({
+        x: Math.random() * canvas.width,
+        y: Math.random() * canvas.height,
+        vx: (Math.random() - 0.5) * 0.5,
+        vy: (Math.random() - 0.5) * 0.5,
+        size: Math.random() * 2 + 1
+    });
+}
+
+function animate() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+    particles.forEach(p => {
+        p.x += p.vx;
+        p.y += p.vy;
+
+        if (p.x < 0 || p.x > canvas.width) p.vx *= -1;
+        if (p.y < 0 || p.y > canvas.height) p.vy *= -1;
+
+        ctx.beginPath();
+        ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2);
+        ctx.fillStyle = 'rgba(34,197,94,0.8)';
+        ctx.shadowBlur = 10;
+        ctx.shadowColor = 'rgba(34,197,94,0.8)';
+        ctx.fill();
+        ctx.shadowBlur = 0;
+    });
+
+    requestAnimationFrame(animate);
+}
+
+animate();
diff --git a/html/js/app.js b/html/js/app.js
index ddf8901..c41f5b6 100644
--- a/html/js/app.js
+++ b/html/js/app.js
@@ -71,51 +71,3 @@ function searchQuery(event) {
 
     window.location.href = url;
 }
-
-// Background animation
-const canvas = document.getElementById('bgCanvas');
-const ctx = canvas.getContext('2d');
-
-function resize() {
-    canvas.width = window.innerWidth;
-    canvas.height = window.innerHeight;
-}
-
-window.addEventListener('resize', resize);
-resize();
-
-const particles = [];
-
-for (let i = 0; i < 80; i++) {
-    particles.push({
-        x: Math.random() * canvas.width,
-        y: Math.random() * canvas.height,
-        vx: (Math.random() - 0.5) * 0.5,
-        vy: (Math.random() - 0.5) * 0.5,
-        size: Math.random() * 2 + 1
-    });
-}
-
-function animate() {
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-    particles.forEach(p => {
-        p.x += p.vx;
-        p.y += p.vy;
-
-        if (p.x < 0 || p.x > canvas.width) p.vx *= -1;
-        if (p.y < 0 || p.y > canvas.height) p.vy *= -1;
-
-        ctx.beginPath();
-        ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2);
-        ctx.fillStyle = 'rgba(34,197,94,0.8)';
-        ctx.shadowBlur = 10;
-        ctx.shadowColor = 'rgba(34,197,94,0.8)';
-        ctx.fill();
-        ctx.shadowBlur = 0;
-    });
-
-    requestAnimationFrame(animate);
-}
-
-animate();
\ No newline at end of file
diff --git a/html/projects/index.html b/html/projects/index.html
new file mode 100644
index 0000000..d844db3
--- /dev/null
+++ b/html/projects/index.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon" href="../images/favicon.ico">
+    <link rel="stylesheet" href="../css/style.css">
+    <title>AloeGames Projects</title>
+</head>
+<body>
+    <canvas id="bgCanvas"></canvas>
+
+    <section class="hero">
+        <h1>To be continue...</h1>
+    </section>
+
+    <script src="../js/animation.js"></script>
+</body>
+</html>
\ No newline at end of file