|
|
| import streamlit as st
|
|
|
| def apply_custom_css():
|
| """Apply custom CSS styling"""
|
| st.markdown("""
|
| <style>
|
|
|
| [data-testid="stSidebarNav"] {
|
| display: none !important;
|
| }
|
| .main-header {
|
| font-size: 2.5rem;
|
| color: #1f77b4;
|
| text-align: center;
|
| margin-bottom: 1rem;
|
| }
|
|
|
| .metric-card {
|
| background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
| padding: 1rem;
|
| border-radius: 10px;
|
| color: white;
|
| box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
| margin-bottom: 1rem;
|
| }
|
| .metric-value {
|
| font-size: 1.8rem;
|
| font-weight: bold;
|
| }
|
| .metric-label {
|
| font-size: 0.9rem;
|
| opacity: 0.9;
|
| }
|
| .section-header {
|
| border-left: 5px solid #1f77b4;
|
| padding-left: 1rem;
|
| margin: 1.5rem 0 1rem 0;
|
| font-size: 1.5rem;
|
| }
|
| .stButton button {
|
| width: 100%;
|
| }
|
| @media (max-width: 768px) {
|
| .main-header {
|
| font-size: 2rem;
|
| }
|
| .metric-value {
|
| font-size: 1.5rem;
|
| }
|
| }
|
| </style>
|
| """, unsafe_allow_html=True)
|
|
|
| def create_metric_card(value, label, icon="📊", color="#1f77b4"):
|
| """Create a styled metric card"""
|
| return f"""
|
| <div class="metric-card" style="background: linear-gradient(135deg, {color} 0%, {color}88 100%);">
|
| <div style="display: flex; justify-content: space-between; align-items: center;">
|
| <div>
|
| <div class="metric-value">{value}</div>
|
| <div class="metric-label">{label}</div>
|
| </div>
|
| <div style="font-size: 2rem;">{icon}</div>
|
| </div>
|
| </div>
|
| """
|
|
|
| COLORS = {
|
| 'primary': '#1f77b4',
|
| 'secondary': '#ff7f0e',
|
| 'success': '#2ca02c',
|
| 'danger': '#d62728',
|
| 'warning': '#ffbb78'
|
| }
|
|
|
