import streamlit as st
from streamlit.components.v1 import html

def main():
    # Set page config
    st.set_page_config(layout="wide", page_title="HTML Viewer")
    
    # Create sidebar
    with st.sidebar:
        # Create an expander for the password inputs
        with st.expander("Passwords and Link"):
            # Add password inputs to the expander
            password1 = st.text_input("Password 1", type="password")
            password2 = st.text_input("Password 2", type="password")
            password3 = st.text_input("Password 3", type="password")
            password4 = st.text_input("Password 4", type="password")
            link = st.text_input("Link")
    
    # Main content area
    st.header("HTML Viewer")
    
    # Create a text area for HTML input
    html_input = st.text_area("Input HTML:", height=100)
    
    # Display HTML content if there's input
    if html_input:
        # Create a container for the HTML viewer
        viewer_container = st.container()
        with viewer_container:
            # Use custom CSS to style the viewer
            st.markdown("""
                <style>
                    .html-viewer {
                        border: 1px solid #ccc;
                        padding: 20px;
                        background: white;
                        min-height: 300px;
                        margin-bottom: 20px;
                    }
                    .stTextInput {
                        margin-bottom: 10px;
                    }
                </style>
            """, unsafe_allow_html=True)
            
            # Display the HTML content
            st.markdown('<div class="html-viewer">', unsafe_allow_html=True)
            html(html_input, height=400)
            st.markdown('</div>', unsafe_allow_html=True)

if __name__ == "__main__":
    main()