将徽标和标题放在 Streamlit 多页应用程序侧边栏中的页面导航上方/顶部

我正在使用新的多页功能 https://docs.streamlit.io/library/get-started/multipage-apps想要设计我的多页应用程序的样式，并在页面导航的顶部/之前放置一个带有标题的徽标。

这是一个测试过的小例子Python 3.9 with streamlit==1.11.1在以下目录结构中：

/Home.py
/pages/Page_1.py
/pages/Page_2.py

Home.py:

import streamlit as st


st.sidebar.markdown(
    "My Logo (sidebar) should be on top of the Navigation within the sidebar"
)

st.markdown("# Home")

Page_1.py:

import streamlit as st

st.markdown("Page 1")

Page_2.py:

import streamlit as st

st.markdown("Page 2")

我可以使用以下命令运行：

$ streamlit run Home.py

But this leads to the Text printed below and not above the navigation:

有什么办法可以做到这一点吗？欢迎任何提示！

最好的祝愿， 绳索

一种选择是通过 CSS 来完成，函数如下：

def add_logo():
    st.markdown(
        """
        <style>
            [data-testid="stSidebarNav"] {
                background-image: url(http://placekitten.com/200/200);
                background-repeat: no-repeat;
                padding-top: 120px;
                background-position: 20px 20px;
            }
            [data-testid="stSidebarNav"]::before {
                content: "My Company Name";
                margin-left: 20px;
                margin-top: 20px;
                font-size: 30px;
                position: relative;
                top: 100px;
            }
        </style>
        """,
        unsafe_allow_html=True,
    )

And then just call that function at the top of each page. That produces an effect like this: