Update index.html

index.html

@@ -278,30 +278,45 @@
             </h2>
             
             <div class="grid md:grid-cols-2 gap-8">
-              <!-- NEW XO Game Project -->
-<div class="project-card rounded-xl p-8 relative overflow-hidden">
-    <div class="absolute -right-10 -top-10 w-32 h-32 bg-yellow-500 rounded-full opacity-10"></div>
-    <div class="absolute -left-10 -bottom-10 w-32 h-32 bg-pink-500 rounded-full opacity-10"></div>
-
-    <div class="flex items-center mb-6">
-        <div class="w-16 h-16 bg-yellow-500 bg-opacity-20 rounded-lg flex items-center justify-center mr-4">
-            <i class="fas fa-gamepad text-3xl text-yellow-400"></i>
-        </div>
-        <h3 class="text-2xl font-bold tech-font">XO Tic-Tac-Toe Game</h3>
-    </div>
-
-    <p class="mb-6 text-gray-300">
-        A simple and fun Tic-Tac-Toe game made with HTML, CSS, and JavaScript. Play and challenge yourself!
-    </p>
-
-    <div class="flex justify-center mb-4">
-        <iframe src="https://adhamqabban37.github.io/xo/" width="100%" height="400px" style="border:none; border-radius: 12px;"></iframe>
-    </div>
+                <div class="project-card rounded-xl p-8 relative overflow-hidden">
+                    <div class="absolute -right-10 -top-10 w-32 h-32 bg-green-500 rounded-full opacity-10"></div>
+                    <div class="absolute -left-10 -bottom-10 w-32 h-32 bg-blue-500 rounded-full opacity-10"></div>
+                    <div class="flex items-center mb-6">
+                        <div class="w-16 h-16 bg-green-500 bg-opacity-20 rounded-lg flex items-center justify-center mr-4">
+                            <i class="fas fa-gamepad text-3xl text-green-400"></i>
+                        </div>
+                        <h3 class="text-2xl font-bold tech-font">Snake Game</h3>
+                    </div>
+                    <p class="mb-6 text-gray-300">
+                        A classic Snake game built with HTML, CSS, and JavaScript. Try to get the highest score!
+                    </p>
+                    <div class="flex justify-center mb-4">
+                        <iframe src="https://adhamqabban37.github.io/snakegame/" width="100%" height="400px" style="border:none; border-radius: 12px;"></iframe>
+                    </div>
+                    <a href="https://adhamqabban37.github.io/snakegame/" target="_blank" class="text-green-400 hover:text-green-200 transition">
+                        Play in full screen <i class="fas fa-arrow-right ml-1"></i>
+                    </a>
+                </div>
 
-    <a href="https://adhamqabban37.github.io/xo/" target="_blank" class="text-yellow-400 hover:text-yellow-200 transition">
-        Play in full screen <i class="fas fa-arrow-right ml-1"></i>
-    </a>
-</div>
+                <div class="project-card rounded-xl p-8 relative overflow-hidden">
+                    <div class="absolute -right-10 -top-10 w-32 h-32 bg-yellow-500 rounded-full opacity-10"></div>
+                    <div class="absolute -left-10 -bottom-10 w-32 h-32 bg-pink-500 rounded-full opacity-10"></div>
+                    <div class="flex items-center mb-6">
+                        <div class="w-16 h-16 bg-yellow-500 bg-opacity-20 rounded-lg flex items-center justify-center mr-4">
+                            <i class="fas fa-gamepad text-3xl text-yellow-400"></i>
+                        </div>
+                        <h3 class="text-2xl font-bold tech-font">XO Tic-Tac-Toe Game</h3>
+                    </div>
+                    <p class="mb-6 text-gray-300">
+                        A simple and fun Tic-Tac-Toe game made with HTML, CSS, and JavaScript. Play and challenge yourself!
+                    </p>
+                    <div class="flex justify-center mb-4">
+                        <iframe src="https://adhamqabban37.github.io/xo/" width="100%" height="400px" style="border:none; border-radius: 12px;"></iframe>
+                    </div>
+                    <a href="https://adhamqabban37.github.io/xo/" target="_blank" class="text-yellow-400 hover:text-yellow-200 transition">
+                        Play in full screen <i class="fas fa-arrow-right ml-1"></i>
+                    </a>
+                </div>
 
                 <div class="project-card rounded-xl p-8 relative overflow-hidden">
                     <div class="absolute -right-10 -top-10 w-32 h-32 bg-red-500 rounded-full opacity-10"></div>
@@ -353,21 +368,7 @@
         <a href="#" class="px-4 py-2 bg-gold-500 text-black rounded-md hover:bg-gold-300 transition-colors duration-300">Learn More</a>
     </div>
 </div>
-</div>                     
-              A dynamic portfolio showcasing my tech skills, certifications, and professional accomplishments with an interactive, modern interface.
-                    </p>
-                    
-                    <div class="flex flex-wrap gap-2 mb-6">
-                        <span class="px-3 py-1 bg-black bg-opacity-40 rounded-full text-xs">React</span>
-                        <span class="px-3 py-1 bg-black bg-opacity-40 rounded-full text-xs">Tailwind CSS</span>
-                        <span class="px-3 py-1 bg-black bg-opacity-40 rounded-full text-xs">JavaScript</span>
-                        <span class="px-3 py-1 bg-black bg-opacity-40 rounded-full text-xs">Responsive Design</span>
-                    </div>
-                    
-                    <a href="#" class="inline-flex items-center text-gold-500 hover:text-gold-300 transition">
-                        View Project <i class="fas fa-arrow-right ml-2"></i>
-                    </a>
-                </div>
+</div>                              
             </div>
             
             <div class="text-center mt-12">
@@ -515,7 +516,7 @@
                                 <i class="fab fa-linkedin-in"></i>
                             </a>
                             </a>
-<a href="https://github.com/adhamqabban37" target="_blank" class="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center text-white hover:bg-gray-600 transition" aria-label="GitHub profile">                                <i class="fab fa-github"></i>
+<a href="https://github.com/adhamqabban37" target="_blank" class="w-10 h-10 rounded-full bg-gray-800 flex items-center justify-center text-white hover:bg-gray-600 transition" aria-label="GitHub profile">                                 <i class="fab fa-github"></i>
                             </a>
                         </div>
                     </div>
@@ -569,9 +570,9 @@
                 <a href="https://www.linkedin.com/in/adam-qab-620856187/" target="_blank" class="text-gray-500 hover:text-blue-400 transition" aria-label="LinkedIn profile">
                     <i class="fab fa-linkedin-in"></i>
                 </a>
-<a href="https://github.com/adhamqabban37" target="_blank" class="text-gray-500 hover:text-white transition" aria-label="GitHub profile">                    
-       </a>         
-<a href="https://github.com/adhamqabban37" target="_blank" class="text-gray-500 hover:text-white transition" aria-label="GitHub profile">                    <i class="fab fa-github"></i>
+<a href="https://github.com/adhamqabban37" target="_blank" class="text-gray-500 hover:text-white transition" aria-label="GitHub profile">               
+</a>        
+<a href="https://github.com/adhamqabban37" target="_blank" class="text-gray-500 hover:text-white transition" aria-label="GitHub profile">                <i class="fab fa-github"></i>
                 </a>
             </div>
         </div>