app.py

import streamlit as st
import streamlit.components.v1 as components

# Set page config for dark theme
st.set_page_config(layout="wide", page_title="Web UI", page_icon=":ghost:", initial_sidebar_state="expanded")

# Apply dark theme
st.markdown("""
<style>
    .reportview-container {
        background-color: #000000;
    }
    .sidebar .sidebar-content {
        background-color: #262730;
    }
    .Widget>label {
        color: white;
    }
    .stRadio>div{
        color: white;
    }
    .stCheckbox>div{
        color: white;
    }
    .stSelectbox>div{
        color: white;
    }
    .main .block-container {
        background-color: #000000;
    }
    iframe {
        background-color: #000000;
    }
</style>
""", unsafe_allow_html=True)

# Sidebar menu
st.sidebar.title("메뉴")
menu = st.sidebar.radio("선택하세요:", ("A", "B"))

# Main content
if menu == "A":
    components.iframe("https://seawolf2357-flxloraexp.hf.space", height=800, scrolling=True)
elif menu == "B":
    components.iframe("http://hugpu.ai:8000", height=800, scrolling=True)

# Make the layout responsive
st.markdown("""
<style>
    .reportview-container .main .block-container {
        max-width: 1000px;
        padding-top: 2rem;
        padding-right: 2rem;
        padding-left: 2rem;
        padding-bottom: 2rem;
    }
    .sidebar .sidebar-content {
        width: 300px;
    }
</style>
""", unsafe_allow_html=True)

# Ensure iframes are loaded correctly
st.markdown("""
<script>
    window.addEventListener('load', function() {
        var iframes = document.getElementsByTagName('iframe');
        for (var i = 0; i < iframes.length; i++) {
            iframes[i].onload = function() {
                this.style.height = this.contentWindow.document.body.scrollHeight + 'px';
            }
        }
    });
</script>
""", unsafe_allow_html=True)