190 lines
5.3 KiB
Python
190 lines
5.3 KiB
Python
"""
|
|
Global CSS styles for NotebookLlaMa
|
|
Apply consistent typography and styling across all pages
|
|
"""
|
|
|
|
def get_custom_css():
|
|
"""Return custom CSS for the application"""
|
|
return """
|
|
<style>
|
|
/* Import Montserrat font */
|
|
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');
|
|
|
|
/* Apply Montserrat globally */
|
|
* {
|
|
font-family: 'Montserrat', sans-serif !important;
|
|
}
|
|
|
|
/* Main headers - reduce from 44px to 20px */
|
|
h1 {
|
|
font-size: 20px !important;
|
|
font-weight: 600 !important;
|
|
line-height: 1.3 !important;
|
|
margin-bottom: 0.5rem !important;
|
|
}
|
|
|
|
/* Subheaders */
|
|
h2 {
|
|
font-size: 18px !important;
|
|
font-weight: 600 !important;
|
|
line-height: 1.3 !important;
|
|
margin-bottom: 0.5rem !important;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 16px !important;
|
|
font-weight: 600 !important;
|
|
line-height: 1.3 !important;
|
|
margin-bottom: 0.5rem !important;
|
|
}
|
|
|
|
/* Body text */
|
|
p, div, span {
|
|
font-size: 16px !important;
|
|
line-height: 1.5 !important;
|
|
}
|
|
|
|
/* Source citations - smaller text */
|
|
.stExpander summary {
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
.stMarkdown a, .stMarkdown small, .stCaption {
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
/* Chat messages */
|
|
.stChatMessage {
|
|
font-size: 16px !important;
|
|
}
|
|
|
|
.stChatMessage h1, .stChatMessage h2, .stChatMessage h3 {
|
|
font-size: 16px !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.stChatMessage strong {
|
|
font-size: 16px !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
/* Buttons */
|
|
.stButton button {
|
|
font-family: 'Montserrat', sans-serif !important;
|
|
font-size: 14px !important;
|
|
font-weight: 500 !important;
|
|
}
|
|
|
|
/* Input fields */
|
|
input, textarea, select {
|
|
font-family: 'Montserrat', sans-serif !important;
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
/* Sidebar */
|
|
.css-1d391kg, [data-testid="stSidebar"] {
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
[data-testid="stSidebar"] h1 {
|
|
font-size: 16px !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
[data-testid="stSidebar"] .stMarkdown h1,
|
|
[data-testid="stSidebar"] .stMarkdown h2,
|
|
[data-testid="stSidebar"] .stMarkdown h3 {
|
|
font-size: 14px !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
/* Hide Streamlit's auto-generated page list (keep our custom navigation) */
|
|
section[data-testid="stSidebarNav"] {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Keep our custom navigation visible */
|
|
[data-testid="stSidebar"] .stMarkdown {
|
|
display: block !important;
|
|
}
|
|
|
|
/* Sidebar user info - reduce username size */
|
|
[data-testid="stSidebar"] .element-container {
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
/* Expander headers */
|
|
.streamlit-expanderHeader {
|
|
font-size: 15px !important;
|
|
font-weight: 500 !important;
|
|
}
|
|
|
|
/* Source link badges */
|
|
.stMarkdown code {
|
|
font-size: 13px !important;
|
|
padding: 2px 6px !important;
|
|
}
|
|
|
|
/* Info/Warning/Error boxes */
|
|
.stAlert {
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
/* Captions */
|
|
.caption, small, .stCaption {
|
|
font-size: 13px !important;
|
|
color: #6c757d !important;
|
|
}
|
|
|
|
/* Reduce spacing for cleaner look */
|
|
.block-container {
|
|
padding-top: 2rem !important;
|
|
padding-bottom: 1rem !important;
|
|
}
|
|
|
|
/* Streamlit title */
|
|
[data-testid="stAppViewContainer"] h1:first-of-type {
|
|
font-size: 24px !important;
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
/* Hide deploy button in top right */
|
|
[data-testid="stToolbar"] {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Logo in top left header */
|
|
[data-testid="stHeader"] {
|
|
background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjYwIiB2aWV3Qm94PSIwIDAgMjAwIDYwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxzdHlsZT4udGV4dHtmb250LWZhbWlseTpNb250c2VycmF0LHNhbnMtc2VyaWY7Zm9udC13ZWlnaHQ6NzAwO2ZpbGw6IzAwMDt9PC9zdHlsZT48Y2lyY2xlIGN4PSIzMCIgY3k9IjMwIiByPSIyNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjMiLz48cGF0aCBkPSJNMTUgMjBRMjAgMTUgMzAgMTVUNDUgMjBNMTUgMzBRMjAgMjUgMzAgMjVUNDUgMzBNMTUgNDBRMjAgMzUgMzAgMzVUNDUgNDAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwMCIgc3Ryb2tlLXdpZHRoPSIzIi8+PHRleHQgeD0iNjUiIHk9IjI1IiBjbGFzcz0idGV4dCIgZm9udC1zaXplPSIxNCI+U2FuZGJveDwvdGV4dD48dGV4dCB4PSI2NSIgeT0iNDUiIGNsYXNzPSJ0ZXh0IiBmb250LXNpemU9IjE0Ij5Ob3RlYm9va0xNPC90ZXh0Pjwvc3ZnPg==');
|
|
background-repeat: no-repeat;
|
|
background-position: 10px center;
|
|
background-size: 160px auto;
|
|
padding-left: 180px !important;
|
|
}
|
|
|
|
/* Adjust header spacing */
|
|
[data-testid="stHeader"] > div {
|
|
padding-left: 0 !important;
|
|
}
|
|
|
|
/* Hide keyboard shortcut hints */
|
|
[data-testid="stDecoration"] {
|
|
display: none !important;
|
|
}
|
|
|
|
.stDecorationBar {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Hide the keyboard shortcut text */
|
|
button[kind="header"] span {
|
|
display: none !important;
|
|
}
|
|
</style>
|
|
"""
|
|
|
|
|
|
def apply_custom_styles():
|
|
"""Apply custom CSS to the current page"""
|
|
import streamlit as st
|
|
st.markdown(get_custom_css(), unsafe_allow_html=True)
|