Spaces:
Sleeping
Sleeping
File size: 2,692 Bytes
6d34253 01611d4 38332fe 3354413 38332fe 5ee42b3 45b87b5 0656283 45b87b5 c3a317e 45b87b5 38332fe 3433f82 38332fe 931e410 e32d5e8 38332fe |
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 |
import streamlit as st
# Page configuration
st.set_page_config(
page_title="HomePage",
page_icon="🚀",
layout="wide"
)
# Global CSS for consistent styling
st.markdown("""
<style>
h1 {
text-align: center;
color: #BB3385;
margin-top: 20px;
margin-bottom: 10px;
}
.description {
text-align: center;
font-size: 18px;
margin-bottom: 30px;
color: #333333;
}
.centered-text {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 32px;
color: #BB3385;
font-weight: bold;
text-align: center;
}
.steps-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 40px;
}
.step {
width: 200px;
height: 80px;
margin: 10px;
font-size: 18px;
color: black;
border-radius: 40px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
font-weight: bold;
background-color: rgba(255, 255, 255, 0.8);
box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
}
.step:nth-child(1) { background-color: #32CD32; } /* Light Red */
.step:nth-child(2) { background-color: #1E90FF; } /* Gold */
.step:nth-child(3) { background-color: #FF8C00; } /* Light Green */
.step:nth-child(4) { background-color: #FF0000; } /* Light Blue */
.step:nth-child(5) { background-color: #9400D3; } /* Light Pink */
.step:nth-child(6) { background-color: #0000FF; } /* Light Salmon */
.step:nth-child(7) { background-color: #808080; } /* Thistle */
.step:nth-child(8) { background-color: #FF00FF; } /* Light Yellow */
.step:nth-child(9) { background-color: #FF6347; } /* Light Cyan */
.step:nth-child(10) { background-color: #00FFFF; } /* Wheat */
</style>
""", unsafe_allow_html=True)
# Render the title
st.markdown('<h1> Life Cycle of ML💡</h1>', unsafe_allow_html=True)
# Render the steps layout
st.markdown(
"""
<div class="steps-container">
<div class="step">1. Problem Statement</div>
<div class="step">2. Data Collection</div>
<div class="step">3. Simple EDA</div>
<div class="step">4. Data Preprocessing</div>
<div class="step">5. EDA</div>
<div class="step">6. Feature Engineering</div>
<div class="step">7. Model Training</div>
<div class="step">8. Model Testing</div>
<div class="step">9. Model Deployment</div>
<div class="step">10. Monitoring</div>
</div>
""",
unsafe_allow_html=True
) |