Merge pull request steam-bell-92#544 from siri-004/fix/js-console-errors

fix: resolve console errors and UI layout issues

Author: steam-bell-92

web-app/css/styles.css

@@ -109,7 +109,8 @@ body {
     color: var(--text-color);
     line-height: 1.6;
     transition: background-color var(--motion-duration) ease, color var(--motion-duration) ease;
-    padding-bottom: 6rem; /* reserve space for fixed footer */
+    padding-bottom: 6rem;
+    /* reserve space for fixed footer */
 }
 
 #main-content {
@@ -1688,11 +1689,11 @@ body {
     width: 100%;
     box-sizing: border-box;
 
-    background: rgba(255,255,255,0.03);
+    background: rgba(255, 255, 255, 0.03);
     padding: 1.2rem;
     border-radius: 16px;
 
-    border: 1px solid rgba(255,255,255,0.08);
+    border: 1px solid rgba(255, 255, 255, 0.08);
 
     transition: all 0.25s ease;
     overflow: hidden;
@@ -1709,7 +1710,7 @@ body {
 .project-card:hover {
     transform: translateY(-4px);
     border-color: rgba(34, 197, 94, 0.3);
-    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
 }
 
 .project-card:hover::after {
@@ -1731,11 +1732,9 @@ body {
     justify-content: center;
     border-radius: 20px;
 
-    background: linear-gradient(
-        135deg,
-        rgba(34, 197, 94, 0.12),
-        rgba(74, 222, 128, 0.10)
-    );
+    background: linear-gradient(135deg,
+            rgba(34, 197, 94, 0.12),
+            rgba(74, 222, 128, 0.10));
 
     margin-bottom: 1rem;
 

web-app/index.html

@@ -803,7 +803,7 @@
 <div class="navbar-brand">
 <a class="logo-wrap" href="#">
 <!-- LOGO IMAGE -->
-<img alt="PyMini Logo" class="navbar-logo" src="/python-mini-project/images/logo.png"/>
+<img alt="PyMini Logo" class="navbar-logo" src="/assets/logo.png"/>
 <!-- TEXT -->
 <div class="logo-text">
 <span class="logo-py">py</span>

web-app/js/projects/2048-game.js

@@ -98,20 +98,20 @@ function get2048GameHTML() {
                 }
 
                 .tile {
-    width: 100%;
-    aspect-ratio: 1 / 1;
-    height: auto;
-    background: var(--control-color);
-
-    display: flex;
-    justify-content: center;
-    align-items: center;
+                    width: 100%;
+                    aspect-ratio: 1 / 1;
+                    height: auto;
+                    background: var(--control-color);
 
-    font-size: clamp(16px, 5vw, 28px);
-    font-weight: bold;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
 
-    border-radius: 12px;
+                    font-size: clamp(16px, 5vw, 28px);
+                    font-weight: bold;
 
+                    border-radius: 12px;
+                }
                 /* Right Side Controls Layout */
                 .controls {
                     display: flex;
@@ -437,24 +437,22 @@ function init2048Game() {
         }
     }
 
-    let touchStartX = 0;
-    let touchStartY = 0;
 
     gridContainer.addEventListener('touchstart', e => {
         e.preventDefault();
         touchStartX = e.changedTouches[0].screenX;
         touchStartY = e.changedTouches[0].screenY;
     }, { passive: false });
 
-    gridContainer.addEventListener('touchend', e => {
+        gridContainer.addEventListener('touchend', e => {
         e.preventDefault();
         let touchEndX = e.changedTouches[0].screenX;
         let touchEndY = e.changedTouches[0].screenY;
-        
+
         let dx = touchEndX - touchStartX;
         let dy = touchEndY - touchStartY;
         let moved = false;
-        
+
         if (Math.abs(dx) > Math.abs(dy)) {
             if (dx > 30) moved = moveRight();
             else if (dx < -30) moved = moveLeft();
@@ -469,16 +467,6 @@ function init2048Game() {
         }
     }, { passive: false });
 
-    document
-        .getElementById("restart-btn")
-        .addEventListener("click", () => {
-
-    window.addEventListener("mouseup", (e) => {
-        if (!isDragging) return;
-        isDragging = false;
-        handleSwipeEnd(e.clientX, e.clientY);
-    });
-
     createBoard();
 }
 

web-app/js/projects/flappy-game.js

@@ -314,12 +314,18 @@ function initFlappyGame() {
     }
 
     function tap(e) {
-        if (e && e.preventDefault) e.preventDefault();
-        if (gameOver) {
-            resetGame();
-        } else {
-            resetGame();
+        if (e && e.preventDefault) {
+            e.preventDefault();
+        }
+
+        jump();
+    }
+    function jump() {
+        if (!gameRunning) {
+            startGame();
         }
+
+        bird.velocity = bird.jumpStrength;
     }
 
     function handleKeyDown(event) {
@@ -334,12 +340,16 @@ function initFlappyGame() {
     canvas.addEventListener('mousedown', tap);
     canvas.addEventListener('touchstart', tap, { passive: false });
 
+
+    function stopGame() {
         if (animationId) {
             cancelAnimationFrame(animationId);
             animationId = null;
         }
+        gameRunning = false;
     }
 
+    console.log(startBtn);
     startBtn.addEventListener("click", function () {
         startScreen.style.display = "none";
         gameScreen.style.display = "flex";

web-app/js/projects/word-scramble.js

@@ -2,7 +2,6 @@
 // WORD SCRAMBLE GAME
 // ============================================
 
-console.log('📝 Word Scramble loaded - Version with Timer');
 
 function getWordScrambleHTML() {
     console.log('🎨 Generating Word Scramble HTML');