|
|
import streamlit as st |
|
|
|
|
|
st.markdown( |
|
|
""" |
|
|
<div style="text-align: center;"> |
|
|
<img src="https://cdn-uploads.huggingface.co/production/uploads/67441c51a784a9d15cb12871/HluSYdnzBXZl0ZdjG_Uta.gif" width="100%" /> |
|
|
</div> |
|
|
""", |
|
|
unsafe_allow_html=True |
|
|
) |
|
|
|
|
|
background_image_url = "https://cdn-uploads.huggingface.co/production/uploads/67441c51a784a9d15cb12871/7ZCmkouk1pS37_kREZmYJ.jpeg" |
|
|
|
|
|
|
|
|
st.markdown( |
|
|
f""" |
|
|
<style> |
|
|
.stApp {{ |
|
|
background-image: url("{background_image_url}"); |
|
|
background-size: auto; /* Ensures the image retains its original size */ |
|
|
background-repeat: repeat; /* Makes the image repeat to cover the entire background */ |
|
|
background-position: top left; /* Starts repeating from the top-left corner */ |
|
|
background-attachment: fixed; /* Keeps the background fixed as you scroll */ |
|
|
}} |
|
|
|
|
|
/* Semi-transparent overlay */ |
|
|
.stApp::before {{ |
|
|
content: ""; |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background: rgba(0, 0, 0, 0.4); /* Adjust transparency here (0.4 for 40% transparency) */ |
|
|
z-index: -1; |
|
|
}} |
|
|
|
|
|
/* Container to center elements and limit width */ |
|
|
.content-container {{ |
|
|
max-width: 100%; /* Allow full width */ |
|
|
margin: 0 auto; /* Center the container */ |
|
|
padding: 0px; /* Remove padding to make the image fill the entire space */ |
|
|
}} |
|
|
|
|
|
/* Styling the markdown content */ |
|
|
.stMarkdown {{ |
|
|
color: white; /* White text to ensure visibility */ |
|
|
font-size: 100px; /* Adjust font size for readability */ |
|
|
text-align: center; /* Center align text */ |
|
|
}} |
|
|
</style> |
|
|
""", |
|
|
unsafe_allow_html=True |
|
|
) |
|
|
|
|
|
if st.button("Previous ⏮️"): |
|
|
st.switch_page("pages/4_Model_Creation_and_Evaluation.py") |
|
|
|
|
|
if st.button("Home 🏠"): |
|
|
st.switch_page("Home.py") |
|
|
|
