Update style/sidebar_style.css

style/sidebar_style.css

@@ -1,81 +1,10 @@
-/* from streamlit-on-Hover-tabs package */
-section[data-testid='stSidebar'] {
-    background-color: #111;
-    flex-shrink: unset !important;  
+.st-emotion-cache-1c7y2kd {
+    flex-direction: row-reverse;
+    text-align: right;
 }
 
-@media(hover:hover) and (min-width: 600px) and (max-width: 769px){
+[class='stAudio'] {
+    max-width: 500px !important;
+    margin: auto !important;
+  }
 
-    header[data-testid="stHeader"] {
-        display:none;
-    }
-
-    section[data-testid='stSidebar'] {
-        height: 100%;
-        min-width:165px !important;
-        width: 165px !important;
-        margin-left: 300px;
-        position: relative;
-        z-index: 1;
-        top: 0;
-        left: 0;
-        background-color: #111;
-        overflow-x: hidden;
-        transition: 0.5s ease;
-        padding-top: 60px;
-        white-space: nowrap;
-        
-    }
-
-    section[data-testid='stSidebar']:hover{
-        min-width: 300px !important;
-        }
-
-    button[kind="header"] {
-        display: none;
-    }
-
-    div[data-testid="collapsedControl"]{
-        display: none;
-    }
-}
-
-@media(hover: hover) and (min-width: 769px){
-
-    header[data-testid="stHeader"] {
-        display:none;
-        font-size: 12px;
-    }
-
-    section[data-testid='stSidebar'] {
-        height: 100%;
-        min-width:165px !important;
-        width: 165px !important;
-        transform:translateX(0px);
-        position: relative;
-        z-index: 1;
-        top: 0;
-        left: 0;
-        background-color: #111;
-        overflow-x: hidden;
-        transition: 0.5s ease;
-        padding-top: 60px;
-        white-space: nowrap;
-    }
-
-    section[data-testid='stSidebar']:hover{
-        min-width: 300px !important;
-        }
-
-    button[kind="header"] {
-        display: none;
-    }
-
-    div[data-testid="collapsedControl"]{
-        display: none;
-    }
-}
-
-.sidebar-intro {
-    color: white;
-  }