James McCool
commited on
Commit
·
8f402fd
1
Parent(s):
39f346a
Update tab styling in Streamlit app for improved visual consistency
Browse files- Uncommented and refined the tab styling in the Streamlit app to enhance the visual appearance of tabs and selections.
- Ensured consistent styling for tab components, including hover effects and background colors, to improve user experience.
- src/streamlit_app.py +35 -35
src/streamlit_app.py
CHANGED
@@ -16,41 +16,41 @@ def init_conn():
|
|
16 |
|
17 |
db = init_conn()
|
18 |
|
19 |
-
|
20 |
-
|
21 |
-
|
22 |
-
|
23 |
-
|
24 |
-
|
25 |
-
|
26 |
-
|
27 |
-
|
28 |
-
|
29 |
-
|
30 |
-
|
31 |
-
|
32 |
-
|
33 |
-
|
34 |
-
|
35 |
-
|
36 |
-
|
37 |
-
|
38 |
-
|
39 |
-
|
40 |
-
|
41 |
-
|
42 |
-
|
43 |
-
|
44 |
-
|
45 |
-
|
46 |
-
|
47 |
-
|
48 |
-
|
49 |
-
|
50 |
-
|
51 |
-
|
52 |
-
|
53 |
-
|
54 |
|
55 |
@st.cache_resource()
|
56 |
def init_baselines():
|
|
|
16 |
|
17 |
db = init_conn()
|
18 |
|
19 |
+
st.markdown("""
|
20 |
+
<style>
|
21 |
+
/* Tab styling */
|
22 |
+
.stTabs [data-baseweb="tab-list"] {
|
23 |
+
gap: 8px;
|
24 |
+
padding: 4px;
|
25 |
+
}
|
26 |
+
.stTabs [data-baseweb="tab"] {
|
27 |
+
height: 50px;
|
28 |
+
white-space: pre-wrap;
|
29 |
+
background-color: #DAA520;
|
30 |
+
color: white;
|
31 |
+
border-radius: 10px;
|
32 |
+
gap: 1px;
|
33 |
+
padding: 10px 20px;
|
34 |
+
font-weight: bold;
|
35 |
+
transition: all 0.3s ease;
|
36 |
+
}
|
37 |
+
.stTabs [aria-selected="true"] {
|
38 |
+
background-color: #DAA520;
|
39 |
+
border: 3px solid #FFD700;
|
40 |
+
color: white;
|
41 |
+
}
|
42 |
+
.stTabs [data-baseweb="tab"]:hover {
|
43 |
+
background-color: #FFD700;
|
44 |
+
cursor: pointer;
|
45 |
+
}
|
46 |
+
div[data-baseweb="select"] > div {
|
47 |
+
background-color: #DAA520;
|
48 |
+
color: white;
|
49 |
+
}
|
50 |
+
div{
|
51 |
+
box-sizing: content-box !important;
|
52 |
+
}
|
53 |
+
</style>""", unsafe_allow_html=True)
|
54 |
|
55 |
@st.cache_resource()
|
56 |
def init_baselines():
|