Update Home.py

Home.py

@@ -1,124 +1,87 @@
 import streamlit as st
-from streamlit_lottie import st_lottie
-import requests
 
-# Custom CSS for Enhanced Styling
+# 🎨 Custom CSS
 st.markdown("""
     <style>
-    @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');
-    @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600&display=swap');
-
+    @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;500&display=swap');
     body {
-        background: linear-gradient(135deg, #1e1e2f, #2a2a3b);
-        font-family: 'Poppins', sans-serif;
+        background: #111827;
         color: white;
+        font-family: 'Poppins', sans-serif;
     }
-    
-    /* Header Styling */
-    h1, h2, h3 {
+    h1, h2 {
         text-align: center;
-        color: #00FFFF;  /* Bright Cyan */
-        text-shadow: 0px 0px 12px rgba(0, 255, 255, 1), 
-                     0px 0px 20px rgba(0, 128, 255, 0.8);
-    }
-
-    .custom-subheader {
         color: #00FFFF;
-        font-family: 'Roboto', sans-serif;
-        font-weight: 600;
-        font-size: 28px;
-        margin-bottom: 15px;
-        text-align: center;
+        text-shadow: 0 0 8px rgba(0,255,255,0.6);
     }
-
-    /* Section Background */
     .section {
-        background: rgba(255, 255, 255, 0.1);
+        background: rgba(255, 255, 255, 0.05);
         padding: 20px;
-        border-radius: 15px;
-        margin-bottom: 30px;
-        box-shadow: 0px 4px 12px rgba(0, 255, 255, 0.2);
+        border-radius: 12px;
+        margin-bottom: 25px;
+        box-shadow: 0 4px 10px rgba(0,255,255,0.15);
+    }
+    .button-container {
+        text-align: center;
+        margin-top: 20px;
     }
-
-    /* Glowing Button */
     .glow-button {
-        background: linear-gradient(90deg, #00FFFF, #00CCFF);
+        background: linear-gradient(90deg, #00FFFF, #00BFFF);
         border: none;
-        padding: 12px 25px;
+        padding: 10px 24px;
         color: black;
         font-weight: bold;
-        border-radius: 25px;
-        box-shadow: 0px 0px 10px rgba(0, 255, 255, 0.8);
-        transition: 0.3s;
+        border-radius: 20px;
+        margin: 6px;
+        font-size: 14px;
+        box-shadow: 0px 0px 8px rgba(0,255,255,0.5);
         text-decoration: none;
         display: inline-block;
-        text-align: center;
-        font-size: 16px;
-        margin: 10px 5px;
     }
-
     .glow-button:hover {
-        transform: scale(1.1);
-        box-shadow: 0px 0px 20px rgba(0, 255, 255, 1);
-    }
-
-    .button-container {
-        text-align: center;
-        margin-top: 15px;
-        margin-bottom: 20px;
+        transform: scale(1.05);
+        box-shadow: 0px 0px 15px rgba(0,255,255,1);
     }
     </style>
 """, unsafe_allow_html=True)
 
+# 🚀 Header
+st.markdown("<h1>🔬 Neural Network Playground</h1>", unsafe_allow_html=True)
 
-# Title
-st.markdown("<h1 class='custom-subheader'>🏏 Crick-o-Meter: Unleashing Data-Driven Cricket Insights! 📊🔥</h1>", unsafe_allow_html=True)
-
-# Lottie Animation
-@st.cache_data
-def load_lottie_url(url: str):
-    response = requests.get(url)
-    if response.status_code != 200:
-        return None
-    return response.json()
-
-lottie_animation = load_lottie_url("https://lottie.host/6e182649-61a6-4683-8680-5493855ac08a/G0pStmcS8T.json")
-st_lottie(lottie_animation, height=200, key="cricket")
-
-# About the App
+# 🔍 About Section
 st.markdown('<div class="section">', unsafe_allow_html=True)
-st.markdown("<h2 class='custom-subheader'>🎯 About the App</h2>", unsafe_allow_html=True)
-st.write("Crick-o-Meter is your ultimate companion for cricket statistics and analytics. Whether you're a fantasy cricket player, a data nerd, or just an ardent fan, our app gives you real-time stats, player comparisons, and predictive insights!")
+st.markdown("## 🤖 What is this App?")
+st.write("This interactive app lets you explore neural networks in 2D using synthetic datasets. Visualize decision boundaries, test different architectures, and train models right in your browser using Keras and TensorFlow!")
 st.markdown('</div>', unsafe_allow_html=True)
 
-# Key Features
+# 🛠 Features
 st.markdown('<div class="section">', unsafe_allow_html=True)
-st.markdown("<h2 class='custom-subheader'>🚀 Key Features</h2>", unsafe_allow_html=True)
+st.markdown("## 🧠 Key Features")
 st.markdown("""
-- 📊 **Player Performance Analysis**
-- 📈 **Predictive Insights for Matches**
-- 🧠 **AI-driven Cricket Forecasting**
-- 📌 **Team Comparisons & Head-to-Head Stats**
+- 🌀 Multiple synthetic datasets (`moons`, `circles`, `blobs`, etc.)
+- 🧱 Choose number of hidden layers (including zero!)
+- ⚙️ Adjustable neurons per layer & activation functions
+- 🧮 Live decision boundary visualization
+- 📉 Training loss and validation curves
 """)
 st.markdown('</div>', unsafe_allow_html=True)
 
-# About the Creator
+# 👤 Creator Section
 st.markdown('<div class="section">', unsafe_allow_html=True)
-st.markdown("<h2 class='custom-subheader'>👨‍💻 About the Creator</h2>", unsafe_allow_html=True)
-st.write("Hi! I'm a passionate developer blending machine learning with cricket analytics. My goal is to make cricket statistics accessible and insightful for fans worldwide.")
+st.markdown("## 👨‍💻 About the Creator")
+st.write("Built by a passionate developer blending Machine Learning with interactive visualization tools to make learning intuitive and engaging.")
 st.markdown('</div>', unsafe_allow_html=True)
 
-# Contact Section
+# 📬 Contact / Footer
 st.markdown('<div class="section">', unsafe_allow_html=True)
-st.markdown("<h2 class='custom-subheader'>📞 Contact Me</h2>", unsafe_allow_html=True)
-
-# Button Section (Now Centered with Space)
+st.markdown("## 📬 Contact Me")
 st.markdown('<div class="button-container">', unsafe_allow_html=True)
 st.markdown("""
-[<button class="glow-button">LinkedIn</button>](https://www.linkedin.com/in/dommeti-thoran-raj-692769191/)  
-[<button class="glow-button">GitHub</button>](https://github.com/raj2216)  
-[<button class="glow-button">Email</button>](mailto:rajbunny2216@gmail.com)  
+[<a class="glow-button" href="https://www.linkedin.com/in/dommeti-thoran-raj-692769191/" target="_blank">LinkedIn</a>]  
+[<a class="glow-button" href="https://github.com/raj2216" target="_blank">GitHub</a>]  
+[<a class="glow-button" href="mailto:rajbunny2216@gmail.com">Email</a>]  
 """, unsafe_allow_html=True)
 st.markdown('</div>', unsafe_allow_html=True)
-
 st.markdown('</div>', unsafe_allow_html=True)
+
+