File size: 4,690 Bytes
8496edd
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
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
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
html_style = """\
<style>
    /* General */
    .stApp {
        /* background-color: #f0f2f6; /* Uncomment for a light gray background */
    }

    /* Sidebar */
    [data-testid="stSidebar"] {
        /* background-color: #ffffff; /* Optional: Force white sidebar background */
        padding-top: 1rem;
    }
    [data-testid="stSidebar"] .stHeader {
        /* font-size: 1.1em; */
        font-weight: 600;
        /* color: #1a73e8; /* Example accent color */
    }

    /* Sidebar Buttons (Chapter Navigation) */
    div[data-testid="stSidebarNavItems"] button {
        text-align: left !important;
        justify-content: flex-start !important;
        border-radius: 8px;
        margin-bottom: 5px; /* Spacing between buttons */
        transition: background-color 0.2s ease-in-out, border-left 0.2s ease-in-out;
        border: 1px solid transparent; /* Base border */
        width: 100%; /* Ensure buttons fill width */
        padding: 0.5rem 0.75rem; /* Adjust padding */
    }
    /* Active Chapter Button */
    div[data-testid="stSidebarNavItems"] button.st-emotion-cache- L0+++ { /* Specific selector for active (primary) */
        background-color: #e7f3ff; /* Light blue background for active */
        color: #1967d2; /* Darker blue text for active */
        border: 1px solid #1967d2; /* Blue border for active */
        font-weight: 600;
    }
    /* Hover effect for non-disabled buttons */
    div[data-testid="stSidebarNavItems"] button:not(:disabled):hover {
        background-color: #f1f3f4; /* Subtle hover */
    }
    /* Disabled Chapter Button */
    div[data-testid="stSidebarNavItems"] button:disabled {
        background-color: transparent; /* No background */
        color: #a0a0a0; /* Grayed out text */
        cursor: not-allowed !important;
        opacity: 0.6; /* Make it more faded */
        border: 1px solid #e0e0e0; /* Light gray border */
    }
    div[data-testid="stSidebarNavItems"] button:disabled .stMarkdown { /* Target text inside disabled */
         color: #a0a0a0 !important;
    }


    /* Expander Header */
    div[data-testid="stExpander"] div[role="button"] > div > p {
        font-weight: 600; /* Slightly bolder expander titles */
        font-size: 1.0em;
    }

    /* Main Content Area Headers */
    .st-emotion-cache- S+++ { /* Selector for st.header */
        /* border-bottom: 2px solid #1a73e8; /* Example accent underline */
        /* padding-bottom: 0.3rem; */
    }

    /* Buttons in Main Area */
    .stButton>button {
        border-radius: 8px;
        padding: 0.5rem 1rem;
    }
    .stButton>button[kind="primary"] {
        background-color: #1976d2; /* Consistent primary color */
    }
    .stButton>button[kind="primary"]:hover {
        background-color: #1565c0;
    }

    /* Markdown Content Styling */
    .main .stMarkdown code {
        background-color: #f0f2f6; /* Light background for code */
        border-radius: 4px;
        padding: 0.2em 0.4em;
        font-size: 0.9em;
    }
    .main .stMarkdown pre > code {
        background-color: #f5f5f5; /* Slightly different for block */
        border: 1px solid #e0e0e0;
        padding: 1em;
        border-radius: 5px;
    }

    /* Media query for dark theme adjustments */
    @media (prefers-color-scheme: dark) {
        /* Sidebar */
        [data-testid="stSidebar"] {
            /* background-color: #1e1e1e; /* Optional: Force dark sidebar background */
        }
         div[data-testid="stSidebarNavItems"] button.st-emotion-cache- L0+++ { /* Active Chapter Dark */
            background-color: #2a3a4f; /* Darker blue background */
            color: #82c0ff; /* Lighter blue text */
            border: 1px solid #3a7bc8; /* Blue border */
        }
        div[data-testid="stSidebarNavItems"] button:not(:disabled):hover {
             background-color: #333333; /* Darker hover */
        }
         div[data-testid="stSidebarNavItems"] button:disabled {
             color: #707070;
             border: 1px solid #444444;
         }
         div[data-testid="stSidebarNavItems"] button:disabled .stMarkdown {
             color: #707070 !important;
         }

        /* Main Content */
        .main .stMarkdown code {
            background-color: #333333;
        }
        .main .stMarkdown pre > code {
            background-color: #2c2c2c;
            border: 1px solid #444444;
        }
         /* Buttons in Main Area */
        .stButton>button[kind="primary"] {
            background-color: #64b5f6; /* Lighter primary for dark mode */
            color: #111;
        }
        .stButton>button[kind="primary"]:hover {
            background-color: #90caf9;
        }
    }

</style>
"""