def UiComponents(pagespath, csspath, imgpath, header = True, sidebar = True, bgimg = True, colborders = True):
    import streamlit as st
    if header == True:    
        #            <div style="width: 100%;height: 170px; background-color: rgb(0,0,0,0);border: 4px solid rgb(122,176,199); padding: 0px; margin-bottom: 10px;border-radius: 20%; ">

        st.markdown(
            """
            <div style="width: 100%; height: 170px; background-color: #7ab0c7; padding: 0px; margin-bottom: 10px; ">
            <h1 style="font-family: 'Arial',d;text-align: center; color: rgb(255, 255, 255);">PACE - MEEB / CEFE</h1>
            <h2 style="font-family: 'Arial';text-align: center; color: rgb(255, 255, 255);">NIRS Utils</h2>
            </div>
            """,
            unsafe_allow_html=True
        )

        st.markdown("""
            <style>
                .block-container {
                        padding-top: 3rem;
                        padding-bottom: 0rem;
                        padding-left: 5rem;
                        padding-right: 5rem;
                    }
            </style>
            """,
              unsafe_allow_html=True
              )
    
    if sidebar == True:
        from st_pages import Page, show_pages
        # from st_pages import Page, Section, show_pages, add_page_title, hide_pages


        if 'interface' not in st.session_state:
            st.session_state['interface'] = 'simple'
        else:
            st.session_state["interface"] = st.session_state.get('interface')

        # # TOC menu on the left
        show_pages(
            [Page("app.py", "Home"),
            Page(str(pagespath / "0-inputs.py"), "Inputs"),
            Page(str(pagespath / "1-samples_selection.py"), "Samples Selection"),
            Page(str(pagespath / "2-model_creation.py"), "Models Creation & Predictions"),

            ]
        )

        with st.sidebar:
            interface = st.radio(label="Interface", options=['simple', 'advanced'], key='interface')
            # st.page_link(str(pages_folder / '1-samples_selection.py'))
            if st.session_state['interface'] == 'simple':
                #     st.page_link(str(pages_folder / '2-model_creation.py'))
                pass
            # if advanced interface, split Models Creation and Predictions
            elif st.session_state['interface'] == 'advanced':
                show_pages(
                    [Page("app.py", "Home"),
                    Page(str(pagespath / "0-inputs.py"), "Inputs"),
                    Page(str(pagespath / "1-samples_selection.py"), "Samples Selection"),
                    Page(str(pagespath / "2-model_creation.py"), "Models Creation"),
                    Page(str(pagespath / "3-prediction.py"), "Predictions"),
                    ]
                )
    
    if colborders == True:
        import streamlit as st
        with open(csspath) as f:
            st.markdown(f"<style>{f.read()}</style>", unsafe_allow_html=True)
    
    if bgimg == True:
        import base64
        with open(imgpath, "rb") as image_file:
            base64_image= base64.b64encode(image_file.read()).decode('utf-8')

                # CSS code to set the background image
        # Get the base64-encoded image

        # CSS code to set the background image
        background_image_style = f"""
            <style>
            .stApp {{
                background-image: url("data:image/jpeg;base64,{base64_image}");
                background-size: cover;
                background-repeat: no-repeat;
                background-attachment: fixed;
            }}
            </style>
        """

        # Inject the CSS style
        st.markdown(background_image_style, unsafe_allow_html=True)