Update Home.py

Home.py

@@ -2,37 +2,66 @@ import streamlit as st
 from streamlit_lottie import st_lottie
 import requests
 
-# Custom CSS for styling
+# Custom CSS for Enhanced Styling
 st.markdown("""
     <style>
+    @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');
+
     body {
-        background-color: #1a1a1a;
+        background: linear-gradient(135deg, #1e1e2f, #2a2a3b);
+        font-family: 'Poppins', sans-serif;
         color: white;
     }
-    h1 {
+    
+    h1, h2 {
         color: #00FFFF;
         text-align: center;
-        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
+        text-shadow: 0px 0px 10px rgba(0, 255, 255, 0.8);
     }
+    
     .section {
         background: rgba(255, 255, 255, 0.1);
         padding: 20px;
-        border-radius: 10px;
+        border-radius: 15px;
         margin-bottom: 20px;
-        box-shadow: 0px 4px 8px rgba(255, 255, 255, 0.1);
+        box-shadow: 0px 4px 12px rgba(0, 255, 255, 0.2);
     }
-    p {
-        font-size: 18px;
+
+    .glow-button {
+        background: linear-gradient(90deg, #00FFFF, #00CCFF);
+        border: none;
+        padding: 10px 20px;
+        color: black;
+        font-weight: bold;
+        border-radius: 25px;
+        box-shadow: 0px 0px 10px rgba(0, 255, 255, 0.8);
+        transition: 0.3s;
+        text-decoration: none;
+        display: inline-block;
+        text-align: center;
     }
-    </style>
-    """,
-    unsafe_allow_html=True
-)
 
-# Title
-st.title("🏏 Crick-o-Meter: Unleashing Data-Driven Cricket Insights! 📊🔥")
+    .glow-button:hover {
+        transform: scale(1.1);
+        box-shadow: 0px 0px 20px rgba(0, 255, 255, 1);
+    }
+
+    ul {
+        list-style-type: none;
+        padding: 0;
+    }
+    
+    li::before {
+        content: "⚡ ";
+        color: #00FFFF;
+    }
+    </style>
+""", unsafe_allow_html=True)
 
+# Title with Glow Effect
+st.markdown("<h1>🏏 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)
@@ -43,32 +72,35 @@ def load_lottie_url(url: str):
 lottie_animation = load_lottie_url("https://lottie.host/6e182649-61a6-4683-8680-5493855ac08a/G0pStmcS8T.json")
 st_lottie(lottie_animation, height=200, key="cricket")
 
-
-st.subheader("🏏 About the App")
-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!
-""")
+# About the App
+st.markdown('<div class="section">', unsafe_allow_html=True)
+st.markdown("### 🎯 About the App")
+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('</div>', unsafe_allow_html=True)
 
 # Key Features
-st.subheader("🚀 Key Features")
-st.write("""
+st.markdown('<div class="section">', 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**
 """)
+st.markdown('</div>', unsafe_allow_html=True)
 
+# About the Creator
+st.markdown('<div class="section">', unsafe_allow_html=True)
+st.markdown("### 👨‍💻 About the Creator")
+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('</div>', unsafe_allow_html=True)
 
-st.subheader("👨‍💻 About the Creator")
-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.subheader("🌐 Connect with Me")
+# Connect with Me (Styled Buttons)
+st.markdown('<div class="section">', unsafe_allow_html=True)
+st.markdown("### 🌐 Connect with Me")
 st.markdown("""
-- **LinkedIn:** [Dommeti Thoran Raj](https://www.linkedin.com/in/dommeti-thoran-raj-692769191/) 🤝  
-- **GitHub:** [Raj2216](https://github.com/raj2216) 💻  
-- **Email:** [rajbunny2216@gmail.com](mailto:rajbunny2216@gmail.com) 📧
-""")
-
+[<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)  
+""", unsafe_allow_html=True)
+st.markdown('</div>', unsafe_allow_html=True)