github-actions[bot] commited on
Commit
0a116c1
Β·
1 Parent(s): 93ec99f

sync from 86b9481

Browse files
Files changed (2) hide show
  1. .streamlit/config.toml +7 -0
  2. app.py +187 -44
.streamlit/config.toml ADDED
@@ -0,0 +1,7 @@
 
 
 
 
 
 
 
 
1
+ [theme]
2
+ base = "dark"
3
+ primaryColor = "#ea4647"
4
+ backgroundColor = "#050811"
5
+ secondaryBackgroundColor = "#0f1219"
6
+ textColor = "#f1f5f9"
7
+ font = "sans serif"
app.py CHANGED
@@ -34,49 +34,170 @@ st.set_page_config(
34
 
35
  st.markdown("""
36
  <style>
37
- /* 닀크 λΈŒλžœλ”© */
38
- [data-testid="stAppViewContainer"] {
39
- background: #0a0d16;
 
 
 
 
 
 
 
40
  }
41
  [data-testid="stHeader"] {
42
- background: #0a0d16;
43
  }
44
  [data-testid="stSidebar"] {
45
- background: #0f1219;
46
  }
47
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
48
  /* 헀더 */
49
  .dl-header {
50
  text-align: center;
51
- padding: 1.5rem 0 1rem;
52
  }
53
  .dl-header img {
54
  border-radius: 50%;
55
- box-shadow: 0 0 40px rgba(234,70,71,0.3);
56
  }
57
  .dl-header h1 {
58
- color: #ea4647;
59
- font-size: 2.4rem;
60
- font-weight: 800;
61
- margin: 0.5rem 0 0.15rem;
62
- letter-spacing: -0.02em;
 
 
 
63
  }
64
  .dl-header .tagline {
65
- color: #94a3b8;
66
- font-size: 1.05rem;
67
  margin: 0;
68
  }
69
  .dl-header .sub {
70
- color: #64748b;
71
  font-size: 0.85rem;
72
  margin: 0.2rem 0 0;
73
  }
74
 
75
  /* μ„Ήμ…˜ 제λͺ© */
76
  .dl-section {
77
- color: #ea4647;
78
- font-weight: 700;
79
- font-size: 1.15rem;
80
  border-bottom: 2px solid #ea4647;
81
  padding-bottom: 0.35rem;
82
  margin: 1.5rem 0 0.8rem;
@@ -84,76 +205,97 @@ st.markdown("""
84
 
85
  /* κΈ°μ—…μΉ΄λ“œ */
86
  .dl-card {
87
- background: #0f1219;
88
  border: 1px solid #1e2433;
89
- border-radius: 10px;
90
- padding: 1.2rem 1.5rem;
91
  margin: 1rem 0;
 
 
 
 
 
 
 
 
 
92
  }
93
  .dl-card h2 {
94
- color: #f1f5f9;
95
- font-size: 1.4rem;
96
- margin: 0 0 0.8rem;
 
97
  }
98
  .dl-card .meta {
99
  display: flex;
100
- gap: 2rem;
101
  flex-wrap: wrap;
102
  }
103
  .dl-card .meta-item {
104
  display: flex;
105
  flex-direction: column;
 
106
  }
107
  .dl-card .meta-label {
108
- color: #64748b;
109
- font-size: 0.75rem;
110
  text-transform: uppercase;
111
- letter-spacing: 0.05em;
 
112
  }
113
  .dl-card .meta-value {
114
- color: #e2e8f0;
115
- font-size: 1.1rem;
116
  font-weight: 600;
 
117
  }
118
 
119
  /* μ•ˆλ‚΄ ν…μŠ€νŠΈ */
120
  .dl-guide {
121
- color: #64748b;
122
  font-size: 0.88rem;
123
  text-align: center;
124
  margin: 0.2rem 0 0.8rem;
125
  }
126
 
127
- /* 데이터 ν…Œμ΄λΈ” β€” column_config둜 μ²˜λ¦¬ν•˜λ―€λ‘œ μ΅œμ†Œν•œλ§Œ */
128
- [data-testid="stDataFrame"] {
129
- font-variant-numeric: tabular-nums;
130
- }
131
-
132
  /* ν‘Έν„° */
133
  .dl-footer {
134
  text-align: center;
135
  padding: 2rem 0 1rem;
136
  border-top: 1px solid #1e2433;
137
- margin-top: 2rem;
138
- color: #475569;
139
  font-size: 0.85rem;
140
  }
141
  .dl-footer a {
142
- color: #94a3b8;
143
  text-decoration: none;
144
- margin: 0 0.5rem;
 
145
  }
146
  .dl-footer a:hover {
147
- color: #ea4647;
148
  }
149
 
150
- /* 빈 μƒνƒœ μ•ˆλ‚΄ */
151
  .dl-empty {
152
  text-align: center;
153
- color: #475569;
154
- padding: 2rem;
155
  font-size: 1rem;
156
  }
 
 
 
 
 
 
 
 
 
 
 
 
157
  </style>
158
  """, unsafe_allow_html=True)
159
 
@@ -339,6 +481,7 @@ _warmup()
339
  # ── 헀더 ──────────────────────────────────────────────
340
 
341
  st.markdown(f"""
 
342
  <div class="dl-header">
343
  <img src="{_LOGO_URL}" width="88" height="88" alt="DartLab">
344
  <h1>DartLab</h1>
 
34
 
35
  st.markdown("""
36
  <style>
37
+ /* ══════════════════════════════════════════════════
38
+ dartlab 닀크 ν…Œλ§ˆ β€” 라이트 λͺ¨λ“œ κ°•μ œ μ˜€λ²„λΌμ΄λ“œ
39
+ λžœλ”© νŽ˜μ΄μ§€ 색상 체계: #050811 / #0f1219 / #ea4647
40
+ ══════════════════════════════════════════════════ */
41
+
42
+ /* μ „μ—­ λ°°κ²½ κ°•μ œ */
43
+ html, body, [data-testid="stAppViewContainer"],
44
+ [data-testid="stApp"], .main, .block-container {
45
+ background-color: #050811 !important;
46
+ color: #f1f5f9 !important;
47
  }
48
  [data-testid="stHeader"] {
49
+ background: #050811 !important;
50
  }
51
  [data-testid="stSidebar"] {
52
+ background: #0f1219 !important;
53
  }
54
 
55
+ /* μž…λ ₯ ν•„λ“œ β€” 닀크 κ°•μ œ */
56
+ input, textarea, [data-testid="stTextInput"] input,
57
+ [data-baseweb="input"] input,
58
+ [data-baseweb="textarea"] textarea {
59
+ background-color: #0f1219 !important;
60
+ color: #f1f5f9 !important;
61
+ border-color: #1e2433 !important;
62
+ caret-color: #ea4647 !important;
63
+ }
64
+ [data-baseweb="input"],
65
+ [data-baseweb="base-input"] {
66
+ background-color: #0f1219 !important;
67
+ border-color: #1e2433 !important;
68
+ }
69
+
70
+ /* μ…€λ ‰νŠΈλ°•μŠ€/λ“œλ‘­λ‹€μš΄ */
71
+ [data-baseweb="select"] > div {
72
+ background-color: #0f1219 !important;
73
+ border-color: #1e2433 !important;
74
+ color: #f1f5f9 !important;
75
+ }
76
+ [data-baseweb="popover"] {
77
+ background-color: #0f1219 !important;
78
+ border-color: #1e2433 !important;
79
+ }
80
+ [data-baseweb="menu"] {
81
+ background-color: #0f1219 !important;
82
+ }
83
+ [data-baseweb="menu"] li {
84
+ color: #f1f5f9 !important;
85
+ }
86
+ [data-baseweb="menu"] li:hover {
87
+ background-color: #1a1f2b !important;
88
+ }
89
+
90
+ /* λΌλ””μ˜€ λ²„νŠΌ */
91
+ [data-testid="stRadio"] label {
92
+ color: #f1f5f9 !important;
93
+ }
94
+ [data-testid="stRadio"] [data-baseweb="radio"] {
95
+ background-color: transparent !important;
96
+ }
97
+
98
+ /* DataFrame 닀크 κ°•μ œ */
99
+ [data-testid="stDataFrame"] {
100
+ font-variant-numeric: tabular-nums;
101
+ }
102
+ [data-testid="stDataFrame"] [data-testid="glideDataEditor"],
103
+ [data-testid="stDataFrame"] canvas {
104
+ background-color: #0f1219 !important;
105
+ }
106
+
107
+ /* λ²„νŠΌ */
108
+ [data-testid="stBaseButton-primary"] {
109
+ background-color: #ea4647 !important;
110
+ color: #fff !important;
111
+ border: none !important;
112
+ font-weight: 600 !important;
113
+ }
114
+ [data-testid="stBaseButton-primary"]:hover {
115
+ background-color: #c83232 !important;
116
+ }
117
+ [data-testid="stBaseButton-secondary"],
118
+ [data-testid="stDownloadButton"] button {
119
+ background-color: #0f1219 !important;
120
+ color: #f1f5f9 !important;
121
+ border: 1px solid #1e2433 !important;
122
+ }
123
+ [data-testid="stDownloadButton"] button:hover {
124
+ border-color: #ea4647 !important;
125
+ color: #ea4647 !important;
126
+ }
127
+
128
+ /* Expander */
129
+ [data-testid="stExpander"] {
130
+ background-color: #0f1219 !important;
131
+ border-color: #1e2433 !important;
132
+ }
133
+ [data-testid="stExpander"] summary {
134
+ color: #f1f5f9 !important;
135
+ }
136
+ [data-testid="stExpander"] [data-testid="stMarkdownContainer"] {
137
+ color: #f1f5f9 !important;
138
+ }
139
+
140
+ /* Chat */
141
+ [data-testid="stChatMessage"] {
142
+ background-color: #0f1219 !important;
143
+ border-color: #1e2433 !important;
144
+ }
145
+ [data-testid="stChatInput"] {
146
+ background-color: #0f1219 !important;
147
+ border-color: #1e2433 !important;
148
+ }
149
+ [data-testid="stChatInput"] textarea {
150
+ background-color: #0f1219 !important;
151
+ color: #f1f5f9 !important;
152
+ }
153
+
154
+ /* κΈ°λ³Έ ν…μŠ€νŠΈ */
155
+ p, span, label, h1, h2, h3, h4, h5, h6,
156
+ [data-testid="stMarkdownContainer"],
157
+ [data-testid="stMarkdownContainer"] p {
158
+ color: #f1f5f9 !important;
159
+ }
160
+ [data-testid="stCaption"], .stCaption {
161
+ color: #64748b !important;
162
+ }
163
+
164
+ /* ── μ»€μŠ€ν…€ μ»΄ν¬λ„ŒνŠΈ ── */
165
+
166
  /* 헀더 */
167
  .dl-header {
168
  text-align: center;
169
+ padding: 2rem 0 1.2rem;
170
  }
171
  .dl-header img {
172
  border-radius: 50%;
173
+ box-shadow: 0 0 48px rgba(234,70,71,0.25);
174
  }
175
  .dl-header h1 {
176
+ background: linear-gradient(135deg, #ea4647, #f87171, #ea4647);
177
+ -webkit-background-clip: text;
178
+ -webkit-text-fill-color: transparent;
179
+ background-clip: text;
180
+ font-size: 2.6rem !important;
181
+ font-weight: 800 !important;
182
+ margin: 0.6rem 0 0.15rem !important;
183
+ letter-spacing: -0.03em;
184
  }
185
  .dl-header .tagline {
186
+ color: #94a3b8 !important;
187
+ font-size: 1.08rem;
188
  margin: 0;
189
  }
190
  .dl-header .sub {
191
+ color: #64748b !important;
192
  font-size: 0.85rem;
193
  margin: 0.2rem 0 0;
194
  }
195
 
196
  /* μ„Ήμ…˜ 제λͺ© */
197
  .dl-section {
198
+ color: #ea4647 !important;
199
+ font-weight: 700 !important;
200
+ font-size: 1.15rem !important;
201
  border-bottom: 2px solid #ea4647;
202
  padding-bottom: 0.35rem;
203
  margin: 1.5rem 0 0.8rem;
 
205
 
206
  /* κΈ°μ—…μΉ΄λ“œ */
207
  .dl-card {
208
+ background: linear-gradient(135deg, #0f1219 0%, #0a0d16 100%);
209
  border: 1px solid #1e2433;
210
+ border-radius: 12px;
211
+ padding: 1.4rem 1.8rem;
212
  margin: 1rem 0;
213
+ position: relative;
214
+ overflow: hidden;
215
+ }
216
+ .dl-card::before {
217
+ content: '';
218
+ position: absolute;
219
+ top: 0; left: 0; right: 0;
220
+ height: 3px;
221
+ background: linear-gradient(90deg, #ea4647, #f87171, #fb923c);
222
  }
223
  .dl-card h2 {
224
+ color: #f1f5f9 !important;
225
+ font-size: 1.5rem !important;
226
+ margin: 0 0 1rem !important;
227
+ font-weight: 700;
228
  }
229
  .dl-card .meta {
230
  display: flex;
231
+ gap: 2.5rem;
232
  flex-wrap: wrap;
233
  }
234
  .dl-card .meta-item {
235
  display: flex;
236
  flex-direction: column;
237
+ gap: 0.15rem;
238
  }
239
  .dl-card .meta-label {
240
+ color: #64748b !important;
241
+ font-size: 0.72rem;
242
  text-transform: uppercase;
243
+ letter-spacing: 0.08em;
244
+ font-weight: 500;
245
  }
246
  .dl-card .meta-value {
247
+ color: #e2e8f0 !important;
248
+ font-size: 1.15rem;
249
  font-weight: 600;
250
+ font-family: 'JetBrains Mono', 'Fira Code', monospace;
251
  }
252
 
253
  /* μ•ˆλ‚΄ ν…μŠ€νŠΈ */
254
  .dl-guide {
255
+ color: #64748b !important;
256
  font-size: 0.88rem;
257
  text-align: center;
258
  margin: 0.2rem 0 0.8rem;
259
  }
260
 
 
 
 
 
 
261
  /* ν‘Έν„° */
262
  .dl-footer {
263
  text-align: center;
264
  padding: 2rem 0 1rem;
265
  border-top: 1px solid #1e2433;
266
+ margin-top: 2.5rem;
267
+ color: #475569 !important;
268
  font-size: 0.85rem;
269
  }
270
  .dl-footer a {
271
+ color: #94a3b8 !important;
272
  text-decoration: none;
273
+ margin: 0 0.6rem;
274
+ transition: color 0.2s;
275
  }
276
  .dl-footer a:hover {
277
+ color: #ea4647 !important;
278
  }
279
 
280
+ /* 빈 μƒνƒœ */
281
  .dl-empty {
282
  text-align: center;
283
+ color: #475569 !important;
284
+ padding: 3rem 1rem;
285
  font-size: 1rem;
286
  }
287
+
288
+ /* νžˆμ–΄λ‘œ κ·ΈλΌλ””μ–ΈνŠΈ λ°°κ²½ 효과 (λžœλ”© λŠλ‚Œ) */
289
+ .dl-hero-glow {
290
+ position: fixed;
291
+ top: 0; left: 50%;
292
+ transform: translateX(-50%);
293
+ width: 600px;
294
+ height: 400px;
295
+ background: radial-gradient(ellipse at top, rgba(234,70,71,0.06) 0%, transparent 60%);
296
+ pointer-events: none;
297
+ z-index: 0;
298
+ }
299
  </style>
300
  """, unsafe_allow_html=True)
301
 
 
481
  # ── 헀더 ──────────────────────────────────────────────
482
 
483
  st.markdown(f"""
484
+ <div class="dl-hero-glow"></div>
485
  <div class="dl-header">
486
  <img src="{_LOGO_URL}" width="88" height="88" alt="DartLab">
487
  <h1>DartLab</h1>