Update app.py

app.py

@@ -2,7 +2,6 @@
 from __future__ import annotations
 
 from datetime import datetime, date, time
-import base64
 
 import pandas as pd
 import streamlit as st
@@ -12,92 +11,101 @@ from ppt_fill import fill_ppt
 
 st.set_page_config(page_title="Reports 940", layout="centered")
 
+VISION_URL = "https://huggingface.co/spaces/DAM20/Etmam/resolve/main/assets/vision2030_logo.png"
+AMANAH_URL = "https://huggingface.co/spaces/DAM20/Etmam/resolve/main/assets/amanah_logo.png"
+CENTER_URL = "https://huggingface.co/spaces/DAM20/Etmam/resolve/main/assets/center_logo.png"
 
-vision_b64 = get_base64_image("assets/vision2030_logo.png")
-center_b64 = get_base64_image("assets/center_logo.png")
-amanah_b64 = get_base64_image("assets/amanah_logo.png")
-
-page_css = f"""
+page_css = """
 <style>
-.stAppViewContainer {{
+.stAppViewContainer {
     position: relative;
     background: linear-gradient(to bottom, #043548 0%, #02141e 55%, #01080c 100%);
     background-attachment: fixed;
-}}
+}
 
-main .block-container {{
+main .block-container {
     max-width: 900px;
-    padding-top: 5.5rem;
-}}
+    padding-top: 7rem;
+}
 
-[data-testid="stHeader"] {{
+[data-testid="stHeader"] {
     background-color: rgba(0, 0, 0, 0);
-}}
+}
 
-.top-logos-wrapper {{
+.top-logos-main {
     display: flex;
-    flex-direction: column;
-    align-items: center;
     justify-content: center;
-    row-gap: 0.8rem;
-    margin-bottom: 2.5rem;
-}}
+    margin-top: 2.5rem;
+    margin-bottom: 1.5rem;
+}
 
-.vision-logo {{
-    width: 260px;
-    height: auto;
-}}
+.vision-logo {
+    height: 170px;
+    width: auto;
+}
 
-.bottom-logos-row {{
+.middle-logos {
     display: flex;
-    align-items: center;
     justify-content: center;
-    column-gap: 40px;
-}}
+    gap: 3rem;
+    margin-bottom: 3rem;
+}
 
-.center-logo {{
-    width: 260px;
+.center-logo {
     height: auto;
-}}
+    width: 260px;
+}
 
-.amanah-logo {{
-    width: 220px;
-    height: auto;
-}}
+.amanah-logo {
+    height: 70px;
+    width: auto;
+}
 
-h1 {{
-    color: #ffffff !important;
-}}
+.title-block {
+    margin-bottom: 1.5rem;
+}
+
+.title-text {
+    font-size: 2.2rem;
+    font-weight: 700;
+    color: #ffffff;
+}
 
-label, p, span {{
+h1, h2, h3, h4, h5, h6, p, label {
     color: #ffffff !important;
-}}
+}
 </style>
 """
-
 st.markdown(page_css, unsafe_allow_html=True)
 
 st.markdown(
     f"""
-    <div class="top-logos-wrapper">
-        <img src="data:image/png;base64,{vision_b64}" class="vision-logo" />
-        <div class="bottom-logos-row">
-            <img src="data:image/png;base64,{center_b64}" class="center-logo" />
-            <img src="data:image/png;base64,{amanah_b64}" class="amanah-logo" />
-        </div>
+    <div class="top-logos-main">
+        <img src="{VISION_URL}" class="vision-logo" />
+    </div>
+    <div class="middle-logos">
+        <img src="{CENTER_URL}" class="center-logo" />
+        <img src="{AMANAH_URL}" class="amanah-logo" />
     </div>
     """,
     unsafe_allow_html=True,
 )
 
-st.title("Reports 940")
+st.markdown(
+    """
+    <div class="title-block">
+        <span class="title-text">Reports 940</span>
+    </div>
+    """,
+    unsafe_allow_html=True,
+)
 
 uploaded_file = st.file_uploader("Upload file (Excel)", type=["xlsx"])
 
-c1, c2 = st.columns(2)
-with c1:
+col1, col2 = st.columns(2)
+with col1:
     d_closed = st.date_input("Date", value=date.today())
-with c2:
+with col2:
     t_closed = st.time_input("Time", value=time(8, 0))
 
 CLOSED_DT = pd.Timestamp(datetime.combine(d_closed, t_closed))
@@ -122,8 +130,9 @@ if uploaded_file is not None:
         )
     with dl2:
         st.download_button(
-            "Download PowerPoint report",
+            "Download PowerPoint",
             data=out_ppt.getvalue(),
             file_name="report_balady.pptx",
             mime="application/vnd.openxmlformats-officedocument.presentationml.presentation",
         )
+