vsj0702 commited on
Commit
a848a47
·
verified ·
1 Parent(s): 100b6c8

fixing dark mode bugs

Browse files
Files changed (1) hide show
  1. app.py +37 -4
app.py CHANGED
@@ -27,29 +27,39 @@ BORDER = "#2a3240" if dm else "#dddddd"
27
  SHADOW = "rgba(0,0,0,0.3)" if dm else "rgba(0,0,0,0.1)"
28
  ACE_THEME = "monokai" if dm else "chrome"
29
 
30
- # 4️⃣ CSS
31
  st.markdown(f"""
32
  <style>
33
  .stApp {{ background-color: {BG}; color: {TEXT}; }}
34
- [data-testid="stSidebar"] {{ background-color: {PANEL_BG} !important; }}
 
 
 
 
35
  .ace_editor, .ace_scroller {{
36
  background: {PANEL_BG} !important;
37
  box-shadow: 0 4px 8px {SHADOW} !important;
38
  border-radius: 8px !important;
39
  }}
 
40
  textarea, input, .stTextArea textarea {{
41
  background: {PANEL_BG} !important;
42
  color: {TEXT} !important;
43
  border: 1px solid {BORDER} !important;
44
  border-radius: 4px !important;
45
  }}
 
46
  button, .stDownloadButton > button {{
47
  background-color: {ACCENT} !important;
48
  color: #fff !important;
49
  border-radius: 6px !important;
50
  transition: transform 0.1s;
51
  }}
52
- button:hover {{ transform: scale(1.02) !important; }}
 
 
 
 
53
  .chat-container {{
54
  background: {PANEL_BG} !important;
55
  border: 1px solid {BORDER} !important;
@@ -58,13 +68,36 @@ st.markdown(f"""
58
  max-height: 480px;
59
  overflow-y: auto;
60
  }}
 
61
  .chat-message {{ margin-bottom: 1rem; padding: 0.75rem 1rem; border-radius: 12px; }}
62
  .user-message {{ background: rgba(100,149,237,0.2); align-self: flex-end; }}
63
  .bot-message {{ background: rgba(200,200,200,0.2); align-self: flex-start; }}
64
- pre code {{ display: block; padding: 0.5rem; background: rgba(0,0,0,0.1); border-radius: 4px; overflow-x: auto; }}
 
 
 
 
 
 
 
 
65
  label[data-testid="stMarkdownContainer"] > div > div {{
66
  color: {TEXT} !important;
67
  }}
 
 
 
 
 
 
 
 
 
 
 
 
 
 
68
  </style>
69
  """, unsafe_allow_html=True)
70
 
 
27
  SHADOW = "rgba(0,0,0,0.3)" if dm else "rgba(0,0,0,0.1)"
28
  ACE_THEME = "monokai" if dm else "chrome"
29
 
30
+ # 4️⃣ CSS styling
31
  st.markdown(f"""
32
  <style>
33
  .stApp {{ background-color: {BG}; color: {TEXT}; }}
34
+
35
+ [data-testid="stSidebar"] {{
36
+ background-color: {PANEL_BG} !important;
37
+ }}
38
+
39
  .ace_editor, .ace_scroller {{
40
  background: {PANEL_BG} !important;
41
  box-shadow: 0 4px 8px {SHADOW} !important;
42
  border-radius: 8px !important;
43
  }}
44
+
45
  textarea, input, .stTextArea textarea {{
46
  background: {PANEL_BG} !important;
47
  color: {TEXT} !important;
48
  border: 1px solid {BORDER} !important;
49
  border-radius: 4px !important;
50
  }}
51
+
52
  button, .stDownloadButton > button {{
53
  background-color: {ACCENT} !important;
54
  color: #fff !important;
55
  border-radius: 6px !important;
56
  transition: transform 0.1s;
57
  }}
58
+
59
+ button:hover {{
60
+ transform: scale(1.02) !important;
61
+ }}
62
+
63
  .chat-container {{
64
  background: {PANEL_BG} !important;
65
  border: 1px solid {BORDER} !important;
 
68
  max-height: 480px;
69
  overflow-y: auto;
70
  }}
71
+
72
  .chat-message {{ margin-bottom: 1rem; padding: 0.75rem 1rem; border-radius: 12px; }}
73
  .user-message {{ background: rgba(100,149,237,0.2); align-self: flex-end; }}
74
  .bot-message {{ background: rgba(200,200,200,0.2); align-self: flex-start; }}
75
+ pre code {{
76
+ display: block;
77
+ padding: 0.5rem;
78
+ background: rgba(0,0,0,0.1);
79
+ border-radius: 4px;
80
+ overflow-x: auto;
81
+ }}
82
+
83
+ /* Dark mode toggle label fix */
84
  label[data-testid="stMarkdownContainer"] > div > div {{
85
  color: {TEXT} !important;
86
  }}
87
+
88
+ /* 3-dot menu (top-right) */
89
+ [data-testid="stDecoration"] + div button {{
90
+ filter: brightness({ '2.5' if dm else '1.0' });
91
+ }}
92
+
93
+ /* Dropdown menu dark styling */
94
+ .st-emotion-cache-1r4qj8v, .st-emotion-cache-0 {{
95
+ background-color: {PANEL_BG} !important;
96
+ color: {TEXT} !important;
97
+ }}
98
+ .st-emotion-cache-1r4qj8v:hover {{
99
+ background-color: {BORDER} !important;
100
+ }}
101
  </style>
102
  """, unsafe_allow_html=True)
103