Create techsolut_theme.py

techsolut_theme.py

@@ -0,0 +1,211 @@
+import streamlit as st
+from PIL import Image
+
+# TECHSOLUT branding assets
+TECHSOLUT_LOGO_PATH = "assets/techsolut_logo.png"
+
+
+def apply_techsolut_theme():
+    # # Hide Streamlit default footer & menu
+    # hide_streamlit_style = """
+    #     <style>
+    #         #MainMenu {visibility: hidden;}
+    #         footer {visibility: hidden;}
+    #         header {visibility: hidden;}
+    #     </style>
+    # """
+    # st.markdown(hide_streamlit_style, unsafe_allow_html=True)
+
+    # TECHSOLUT theme CSS with animated SVG background
+    custom_css = """
+        <style>
+            html, body, [class*="css"] {
+                font-family: 'Segoe UI', sans-serif;
+                background: linear-gradient(145deg, #0F172A 0%, #1E293B 100%);
+                color: #E0F2F1;
+                overflow-x: hidden;
+            }
+
+            body::before {
+                content: "";
+                position: fixed;
+                top: 0;
+                left: 0;
+                width: 100%;
+                height: 100%;
+                background-image: url('https://www.svgrepo.com/show/353498/ai.svg');
+                background-repeat: no-repeat;
+                background-position: right bottom;
+                background-size: 150px;
+                opacity: 0.03;
+                z-index: -1;
+            }
+
+            .block-container {
+                padding-top: 2rem;
+                padding-bottom: 2rem;
+                animation: fadeIn 1s ease-in-out;
+            }
+
+            @keyframes fadeIn {
+                from { opacity: 0; }
+                to { opacity: 1; }
+            }
+
+            h1, h2, h3, h4, h5, h6 {
+                color: #34D399;
+                transition: color 0.3s ease-in-out;
+            }
+
+            .stButton>button {
+                background-color: #1E293B;
+                color: white;
+                border: 1px solid #34D399;
+                border-radius: 8px;
+                padding: 0.5rem 1.5rem;
+                transition: all 0.3s ease-in-out;
+            }
+
+            .stButton>button:hover {
+                background-color: #34D399;
+                color: black;
+            }
+
+            .stDownloadButton>button {
+                background-color: #0EA5E9;
+                color: white;
+            }
+
+            .stSidebar {
+                background-color: #1E293B;
+                animation: slideIn 1s ease-in-out;
+            }
+
+            @keyframes slideIn {
+                from { transform: translateX(-20px); opacity: 0; }
+                to { transform: translateX(0); opacity: 1; }
+            }
+
+            .stMarkdown a {
+                color: #38BDF8;
+            }
+
+            .stMarkdown a:hover {
+                text-decoration: underline;
+            }
+
+            input, select, textarea {
+                border-radius: 6px;
+                border: 1px solid #334155;
+                padding: 0.4rem;
+            }
+
+            .metric-label {
+                color: #94A3B8;
+                font-size: 0.8rem;
+            }
+
+            .metric-value {
+                font-size: 1.5rem;
+                color: #10B981;
+            }
+
+            .icon {
+                margin-right: 8px;
+            }
+        </style>
+    """
+    st.markdown(custom_css, unsafe_allow_html=True)
+
+    # Add TECHSOLUT logo & title
+    col1, col2 = st.columns([1, 8])
+    with col1:
+        try:
+            logo = Image.open(TECHSOLUT_LOGO_PATH)
+            st.image(logo, width=80)
+        except Exception:
+            st.write(":sparkles:")
+    with col2:
+        st.title("TECHSOLUT Platform - Vision par Ordinateur")
+
+    # Optional banner / call to action widget
+    st.markdown("""
+     <div style="background-color:#1E3A8A;padding:1rem;border-radius:10px;margin-top:1rem;">
+        <h4 style="color:#E0F2F1;">👋 Bienvenue sur la plateforme TECHSOLUT !</h4>
+        <p style="color:#CBD5E1;">🎯 <strong>Plateforme de Computer Vision</strong> pour l'analyse d'images et de vidéos en temps réel.</p>
+        <p style="color:#CBD5E1;">Effectuez des analyses en temps réel avec YOLO, RT-DETR, SAM2 et plus encore.<br>
+        Multi-caméras, détection d'intrusion, export PDF, et enregistrement vidéo intégrés.</p>
+        <p style="color:#CBD5E1;">⚙️ Configurez vos préférences via la barre latérale.<br>
+        📹 Multi-caméras | 🛡️ Détection d'intrusion | 📄 Export PDF | 🎬 Enregistrement vidéo</p>
+    </div>
+    """, unsafe_allow_html=True)
+
+    # Sticky footer with widgets and links
+    st.markdown("""
+    <style>
+        .footer {
+            position: fixed;
+            left: 0;
+            bottom: 0;
+            width: 100%;
+            background-color: #1E293B;
+            color: white;
+            text-align: center;
+            padding: 10px;
+            font-size: 14px;
+            z-index: 100;
+            border-top: 1px solid #334155;
+        }
+        .footer a {
+            color: #34D399;
+            text-decoration: none;
+        }
+        .footer a:hover {
+            text-decoration: underline;
+        }
+    </style>
+    <div class="footer">
+        <div>© 2025 TECHSOLUT - Développé avec ❤️ par Sylvestre Apetcho | <a href="mailto:contact@techsolut.fr">contact@techsolut.fr</a></div>
+        <div style="margin-top:5px;">
+            🌐 <a href="https://www.techsolut.fr" target="_blank">Site Web</a> |
+            📄 <a href="https://www.techsolut.fr/docs" target="_blank">Documentation</a> |
+            ✉️ <a href="mailto:contact@techsolut.fr">Support</a>
+        </div>
+        <div style="margin-top:4px;color:#9CA3AF;">📦 Version 1.0 - Avril 2025</div>
+    </div>
+    """, unsafe_allow_html=True)
+
+def techsolut_sidebar_widgets():
+    st.sidebar.markdown("---")
+    st.sidebar.header("🌐 Liens utiles")
+    st.sidebar.markdown("[TECHSOLUT Website](https://www.techsolut.fr)")
+    st.sidebar.markdown("[Documentation](https://www.techsolut.fr/docs)")
+    st.sidebar.markdown("[Contact Support](mailto:contact@techsolut.fr)")
+    st.sidebar.markdown("---")
+    st.sidebar.markdown("""
+        <small style='color:#9CA3AF;'>📦 Version 1.0 - Avril 2025</small>
+    """, unsafe_allow_html=True)
+
+def main():
+    st.set_page_config(
+        page_title="Plateforme de Vision par Ordinateur - TECHSOLUT",
+        layout="wide"
+    )
+
+    apply_techsolut_theme()
+    techsolut_sidebar_widgets()
+
+    # Exemple de widget dynamique supplémentaire
+    st.sidebar.markdown("---")
+    st.sidebar.subheader("📊 Indicateurs en direct")
+    col1, col2 = st.sidebar.columns(2)
+    col1.metric("🎥 Caméras", "3", "+1")
+    col2.metric("⚠️ Alertes", "5", "-2")
+
+    st.sidebar.markdown("""
+        <hr style='border:1px solid #334155; margin-top: 1rem; margin-bottom: 0.5rem;'>
+        <div style='color:#9CA3AF;font-size:12px;'>Plateforme alimentée par Streamlit & YOLO</div>
+    """, unsafe_allow_html=True)
+
+if __name__ == "__main__":
+    main()