import streamlit as st

def main():

    st.markdown('<div style="display: flex; justify-content: center;"><p style="font-size: 30px; font-weight: bold;">Artwork Caption Generation</p></div>', unsafe_allow_html=True)
    col_left, col_right = st.columns(2)

    with col_left:
        col11, col12 = st.columns(2)
        with col11:
            st.image(image="assets/drawing.jpeg")
        with col12:
            st.write("<div style='text-align:right;'>Witness the birth of creativity. Our website breathes life into your artistic visions.</div>", unsafe_allow_html=True)
        col21, col22 = st.columns(2)
        with col21:
            st.write("<div style='text-align:left;'>Delve into the depths of inspiration. Explore our platform to give voice to your masterpiece.</div>", unsafe_allow_html=True)
        with col22:
            st.image(image="assets/thinking.jpeg")
        col31, col32 = st.columns(2)
        with col31:
            st.image(image="assets/generate.jpeg")
        with col32:
            st.write("<div style='text-align:right;'>Crafting the narrative of your creation. Unleash your imagination with our caption generator for artwork.</div>", unsafe_allow_html=True)

    with col_right:
        st.subheader('How to use')

        st.markdown("##### 1. Upload an image.")

        st.image(image="assets/self_portrait.jpg", width=180)

        st.markdown("##### 2. Click on 'Generate Caption'.")

        st.button(label="Generate Caption", type="primary", key="disabled Generation", use_container_width=True, disabled=True)

        st.markdown("##### 3. Boom!! Your imaginary caption is ready.")

        st.markdown(f'<div style="display: flex; justify-content: center;"><p style="font-size: 25px; font-weight: bold; color: blue;">Portrait Artist Son</p></div>', unsafe_allow_html = True)

        if st.button(label="Go To Generator", type="primary"):
            st.switch_page(page='pages/Caption_Generator.py')

if __name__ == "__main__":
    main()