File size: 3,483 Bytes
df1d2b6
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
import streamlit as st
from streamlit_lottie import st_lottie
import requests

# Load Lottie animation
def load_lottieurl(url: str):
    r = requests.get(url)
    if r.status_code != 200:
        return None
    return r.json()

# CSS Styling
st.markdown("""
    <style>
    body {
        background-color: #eef2f7;
    }
    h1, h2, h3 {
        font-family: 'Roboto', sans-serif;
        text-align: center;
    }
    h1 {
        color: #00FFFF;
        font-weight: 700;
        margin-bottom: 25px;
    }
    h2 {
        color: #FFFACD;
        font-weight: 600;
        margin-top: 30px;
    }
    h3 {
        color: #ba95b0;
        font-weight: 500;
    }
    p {
        font-family: 'Georgia', serif;
        line-height: 1.8;
        color: #555;
    }
    .about-author {
        background: linear-gradient(135deg, #ffffff, #e0f7fa);
        padding: 30px;
        border-radius: 15px;
        box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
        margin: 20px auto;
        max-width: 600px;
        text-align: center;
    }
    .about-author h2 {
        color: #007acc;
        margin-bottom: 15px;
        font-size: 2rem;
    }
    .about-author p {
        font-size: 1.1rem;
    }
    .social-icons {
        display: flex;
        justify-content: center;
        gap: 15px;
        margin-top: 20px;
    }
    .social-icons a img {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        transition: transform 0.2s;
    }
    .social-icons a img:hover {
        transform: scale(1.2);
    }
    </style>
    """, unsafe_allow_html=True)

# Title and Tagline
st.title("Zero to Hero: Mastering Machine Learning from the Ground Up πŸš€πŸ€–πŸ“š")
st.markdown("### Exploring Data Science, One Step at a Time")

# Lottie Animation
lottie_animation = load_lottieurl("https://lottie.host/6e182649-61a6-4683-8680-5493855ac08a/G0pStmcS8T.json")
if lottie_animation:
    st_lottie(lottie_animation, height=150, key="animation")

# About the App
st.subheader("About This App")
st.markdown("""
Welcome to my Machine Learning blog! This is a platform where I share my journey, 
learning experiences, and insights about data science and machine learning.
The roadmap includes:
<ul>
    <li>Problem Understanding</li>
    <li>Data Collection and Exploration</li>
    <li>Model Building and Evaluation</li>
    <li>Deployment and Monitoring</li>
</ul>
""", unsafe_allow_html=True)

# Author Section
st.markdown("""
<div class="about-author">
    <h2>About the Author</h2>
    <p>
        Hi, I'm <strong>Yash Harish Gupta</strong>! I'm an aspiring data scientist passionate about solving real-world problems 
        using machine learning. Currently, I'm learning and preparing to kickstart my career in the data science field.
    </p>
</div>
""", unsafe_allow_html=True)

# Social Links
st.markdown("""
<div class="social-icons">
    <a href="https://www.linkedin.com/in/yash-harish-gupta-71b011189/" target="_blank">
        <img src="https://upload.wikimedia.org/wikipedia/commons/c/ca/LinkedIn_logo_initials.png" alt="LinkedIn">
    </a>
    <a href="https://github.com/YashGupta018" target="_blank">
        <img src="https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png" alt="GitHub">
    </a>
</div>
""", unsafe_allow_html=True)

# Footer
st.markdown("""
<div style="text-align: center; margin-top: 20px; font-family: 'Georgia', serif;">
    <p>Made with ❀️ by Yash Harish Gupta</p>
</div>
""", unsafe_allow_html=True)