Add logo

app.py → 1_Input.py

@@ -16,9 +16,16 @@ import seaborn as sns
 
 # Path manipulation
 from pathlib import Path
+import sys
+sys.path.append('./scripts')
 
-# Custom imports
+# Custom and other imports
 import project_config
+from utils import add_logo
+
+# Insert logo
+add_logo(project_config.MEDIA_DIR / 'gravity_logo.png')
 
 # Page title
-st.title("GRAVITY")
+st.title("Input")
+

pages/1_Input.py

@@ -1,3 +0,0 @@
-import streamlit as st
-
-st.title("Input")

pages/2_Validate.py

@@ -0,0 +1,16 @@
+import streamlit as st
+
+# Path manipulation
+from pathlib import Path
+import sys
+sys.path.append('..')
+sys.path.append('scripts')
+
+# Custom and other imports
+import project_config
+from utils import add_logo
+
+# Insert logo
+add_logo(project_config.MEDIA_DIR / 'gravity_logo.png')
+
+st.title("Validate")

scripts/utils.py

@@ -0,0 +1,46 @@
+import base64
+import streamlit as st
+
+# From https://stackoverflow.com/questions/73251012/put-logo-and-title-above-on-top-of-page-navigation-in-sidebar-of-streamlit-multi
+# See also https://arnaudmiribel.github.io/streamlit-extras/extras/app_logo/ 
+@st.cache_data()
+def get_base64_of_bin_file(png_file):
+    with open(png_file, "rb") as f:
+        data = f.read()
+    return base64.b64encode(data).decode()
+
+def build_markup_for_logo(
+    png_file,
+    background_position="50% 10%",
+    margin_top="10%",
+    padding="20px",
+    image_width="80%",
+    image_height="",
+):
+    binary_string = get_base64_of_bin_file(png_file)
+    return """
+            <style>
+                [data-testid="stSidebarNav"] {
+                    background-image: url("data:image/png;base64,%s");
+                    background-repeat: no-repeat;
+                    background-position: %s;
+                    margin-top: %s;
+                    padding: %s;
+                    background-size: %s %s;
+                }
+            </style>
+            """ % (
+        binary_string,
+        background_position,
+        margin_top,
+        padding,
+        image_width,
+        image_height,
+    )
+
+def add_logo(png_file):
+    logo_markup = build_markup_for_logo(png_file)
+    st.markdown(
+        logo_markup,
+        unsafe_allow_html=True,
+    )