Skip to content

Commit e0caab7

Browse files
glitch003glitch003
committed
dark mode fixes
1 parent 6c253a1 commit e0caab7

File tree

2 files changed

+49
-39
lines changed

2 files changed

+49
-39
lines changed

‎docs/snippets/CurrentPricesTable.jsx‎

Lines changed: 27 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ export const CurrentPricesTable = ({ priceData }) => {
9191
return (
9292
<div style={{ marginTop: '20px', marginBottom: '20px', paddingLeft: '4px' }}>
9393
{litKeyPriceUSD && (
94-
<p style={{ marginBottom: '20px', fontSize: '0.9em', color: '#666' }}>
94+
<p style={{ marginBottom: '20px', fontSize: '0.9em', color: 'var(--mint-text-secondary, #666)' }}>
9595
<strong>LITKEY Price:</strong> ${litKeyPriceUSD.toFixed(4)} USD
9696
{usagePercent !== null && (
9797
<span style={{ marginLeft: '20px' }}>
@@ -114,13 +114,14 @@ export const CurrentPricesTable = ({ priceData }) => {
114114
}}
115115
>
116116
<thead>
117-
<tr style={{ backgroundColor: '#f5f5f5' }}>
117+
<tr style={{ backgroundColor: 'var(--mint-bg-secondary, #f5f5f5)' }}>
118118
<th
119119
style={{
120120
padding: '8px 6px 8px 8px',
121121
textAlign: 'left',
122-
border: '1px solid #ddd',
122+
border: '1px solid var(--mint-border, #ddd)',
123123
fontSize: '0.9em',
124+
color: 'var(--mint-text, inherit)',
124125
}}
125126
>
126127
Product
@@ -129,8 +130,9 @@ export const CurrentPricesTable = ({ priceData }) => {
129130
style={{
130131
padding: '8px 10px',
131132
textAlign: 'right',
132-
border: '1px solid #ddd',
133+
border: '1px solid var(--mint-border, #ddd)',
133134
fontSize: '0.9em',
135+
color: 'var(--mint-text, inherit)',
134136
}}
135137
>
136138
Current Price
@@ -139,8 +141,9 @@ export const CurrentPricesTable = ({ priceData }) => {
139141
style={{
140142
padding: '8px 10px',
141143
textAlign: 'right',
142-
border: '1px solid #ddd',
144+
border: '1px solid var(--mint-border, #ddd)',
143145
fontSize: '0.9em',
146+
color: 'var(--mint-text, inherit)',
144147
}}
145148
>
146149
Base Price
@@ -149,8 +152,9 @@ export const CurrentPricesTable = ({ priceData }) => {
149152
style={{
150153
padding: '8px 10px',
151154
textAlign: 'right',
152-
border: '1px solid #ddd',
155+
border: '1px solid var(--mint-border, #ddd)',
153156
fontSize: '0.9em',
157+
color: 'var(--mint-text, inherit)',
154158
}}
155159
>
156160
Max Price
@@ -177,7 +181,7 @@ export const CurrentPricesTable = ({ priceData }) => {
177181
<td
178182
style={{
179183
padding: '8px 6px 8px 8px',
180-
border: '1px solid #ddd',
184+
border: '1px solid var(--mint-border, #ddd)',
181185
fontWeight: '500',
182186
fontSize: '0.9em',
183187
}}
@@ -188,7 +192,7 @@ export const CurrentPricesTable = ({ priceData }) => {
188192
style={{
189193
padding: '8px 10px',
190194
textAlign: 'right',
191-
border: '1px solid #ddd',
195+
border: '1px solid var(--mint-border, #ddd)',
192196
fontFamily: 'monospace',
193197
fontWeight: '600',
194198
fontSize: '0.85em',
@@ -200,7 +204,7 @@ export const CurrentPricesTable = ({ priceData }) => {
200204
style={{
201205
padding: '8px 10px',
202206
textAlign: 'right',
203-
border: '1px solid #ddd',
207+
border: '1px solid var(--mint-border, #ddd)',
204208
fontFamily: 'monospace',
205209
fontSize: '0.85em',
206210
}}
@@ -211,7 +215,7 @@ export const CurrentPricesTable = ({ priceData }) => {
211215
style={{
212216
padding: '8px 10px',
213217
textAlign: 'right',
214-
border: '1px solid #ddd',
218+
border: '1px solid var(--mint-border, #ddd)',
215219
fontFamily: 'monospace',
216220
fontSize: '0.85em',
217221
}}
@@ -226,15 +230,15 @@ export const CurrentPricesTable = ({ priceData }) => {
226230
<td
227231
style={{
228232
padding: '8px 6px 8px 8px',
229-
border: '1px solid #ddd',
233+
border: '1px solid var(--mint-border, #ddd)',
230234
fontWeight: '500',
231235
fontSize: '0.9em',
232236
}}
233237
>
234238
PKP Minting{' '}
235239
<span
236240
style={{
237-
color: '#666',
241+
color: 'var(--mint-text-secondary, #666)',
238242
fontSize: '0.85em',
239243
fontWeight: 'normal',
240244
fontStyle: 'italic',
@@ -247,7 +251,7 @@ export const CurrentPricesTable = ({ priceData }) => {
247251
style={{
248252
padding: '8px 10px',
249253
textAlign: 'right',
250-
border: '1px solid #ddd',
254+
border: '1px solid var(--mint-border, #ddd)',
251255
fontFamily: 'monospace',
252256
fontWeight: '600',
253257
fontSize: '0.85em',
@@ -264,7 +268,7 @@ export const CurrentPricesTable = ({ priceData }) => {
264268
style={{
265269
padding: '8px 10px',
266270
textAlign: 'right',
267-
border: '1px solid #ddd',
271+
border: '1px solid var(--mint-border, #ddd)',
268272
fontFamily: 'monospace',
269273
fontSize: '0.85em',
270274
}}
@@ -280,7 +284,7 @@ export const CurrentPricesTable = ({ priceData }) => {
280284
style={{
281285
padding: '8px 10px',
282286
textAlign: 'right',
283-
border: '1px solid #ddd',
287+
border: '1px solid var(--mint-border, #ddd)',
284288
fontFamily: 'monospace',
285289
fontSize: '0.85em',
286290
}}
@@ -313,13 +317,14 @@ export const CurrentPricesTable = ({ priceData }) => {
313317
}}
314318
>
315319
<thead>
316-
<tr style={{ backgroundColor: '#f5f5f5' }}>
320+
<tr style={{ backgroundColor: 'var(--mint-bg-secondary, #f5f5f5)' }}>
317321
<th
318322
style={{
319323
padding: '8px 10px',
320324
textAlign: 'left',
321-
border: '1px solid #ddd',
325+
border: '1px solid var(--mint-border, #ddd)',
322326
fontSize: '0.9em',
327+
color: 'var(--mint-text, inherit)',
323328
}}
324329
>
325330
Component
@@ -328,8 +333,9 @@ export const CurrentPricesTable = ({ priceData }) => {
328333
style={{
329334
padding: '8px 10px',
330335
textAlign: 'right',
331-
border: '1px solid #ddd',
336+
border: '1px solid var(--mint-border, #ddd)',
332337
fontSize: '0.9em',
338+
color: 'var(--mint-text, inherit)',
333339
}}
334340
>
335341
Price
@@ -355,13 +361,13 @@ export const CurrentPricesTable = ({ priceData }) => {
355361
<td
356362
style={{
357363
padding: '8px 10px',
358-
border: '1px solid #ddd',
364+
border: '1px solid var(--mint-border, #ddd)',
359365
fontSize: '0.9em',
360366
}}
361367
>
362368
{componentName}
363369
{measurementName && (
364-
<span style={{ color: '#666', marginLeft: '5px' }}>
370+
<span style={{ color: 'var(--mint-text-secondary, #666)', marginLeft: '5px' }}>
365371
{measurementName}
366372
</span>
367373
)}
@@ -370,7 +376,7 @@ export const CurrentPricesTable = ({ priceData }) => {
370376
style={{
371377
padding: '8px 10px',
372378
textAlign: 'right',
373-
border: '1px solid #ddd',
379+
border: '1px solid var(--mint-border, #ddd)',
374380
fontFamily: 'monospace',
375381
fontSize: '0.85em',
376382
}}

‎docs/snippets/ExampleLitActionCosts.jsx‎

Lines changed: 22 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -193,7 +193,7 @@ export const ExampleLitActionCosts = ({ priceData }) => {
193193
return (
194194
<div style={{ marginTop: '20px', marginBottom: '20px' }}>
195195
{litKeyPriceUSD && (
196-
<p style={{ marginBottom: '20px', fontSize: '0.9em', color: '#666' }}>
196+
<p style={{ marginBottom: '20px', fontSize: '0.9em', color: 'var(--mint-text-secondary, #666)' }}>
197197
<strong>LITKEY Price:</strong> ${litKeyPriceUSD.toFixed(4)} USD
198198
</p>
199199
)}
@@ -208,15 +208,15 @@ export const ExampleLitActionCosts = ({ priceData }) => {
208208
style={{
209209
marginBottom: '40px',
210210
padding: '20px',
211-
border: '1px solid #ddd',
211+
border: '1px solid var(--mint-border, #ddd)',
212212
borderRadius: '8px',
213-
backgroundColor: '#fafafa',
213+
backgroundColor: 'var(--mint-bg-secondary, #fafafa)',
214214
}}
215215
>
216216
<h3 style={{ marginTop: '0', marginBottom: '10px' }}>
217217
{example.title}
218218
</h3>
219-
<p style={{ marginBottom: '20px', color: '#666', fontSize: '0.9em' }}>
219+
<p style={{ marginBottom: '20px', color: 'var(--mint-text-secondary, #666)', fontSize: '0.9em' }}>
220220
{example.description}
221221
</p>
222222

@@ -236,12 +236,13 @@ export const ExampleLitActionCosts = ({ priceData }) => {
236236
}}
237237
>
238238
<thead>
239-
<tr style={{ backgroundColor: '#f5f5f5' }}>
239+
<tr style={{ backgroundColor: 'var(--mint-bg-tertiary, #f5f5f5)' }}>
240240
<th
241241
style={{
242242
padding: '8px 10px',
243243
textAlign: 'left',
244-
border: '1px solid #ddd',
244+
border: '1px solid var(--mint-border, #ddd)',
245+
color: 'var(--mint-text, inherit)',
245246
}}
246247
>
247248
Component
@@ -250,7 +251,8 @@ export const ExampleLitActionCosts = ({ priceData }) => {
250251
style={{
251252
padding: '8px 10px',
252253
textAlign: 'right',
253-
border: '1px solid #ddd',
254+
border: '1px solid var(--mint-border, #ddd)',
255+
color: 'var(--mint-text, inherit)',
254256
}}
255257
>
256258
Quantity
@@ -259,7 +261,8 @@ export const ExampleLitActionCosts = ({ priceData }) => {
259261
style={{
260262
padding: '8px 10px',
261263
textAlign: 'right',
262-
border: '1px solid #ddd',
264+
border: '1px solid var(--mint-border, #ddd)',
265+
color: 'var(--mint-text, inherit)',
263266
}}
264267
>
265268
Unit Price
@@ -268,7 +271,8 @@ export const ExampleLitActionCosts = ({ priceData }) => {
268271
style={{
269272
padding: '8px 10px',
270273
textAlign: 'right',
271-
border: '1px solid #ddd',
274+
border: '1px solid var(--mint-border, #ddd)',
275+
color: 'var(--mint-text, inherit)',
272276
}}
273277
>
274278
Total
@@ -281,7 +285,7 @@ export const ExampleLitActionCosts = ({ priceData }) => {
281285
<td
282286
style={{
283287
padding: '8px 10px',
284-
border: '1px solid #ddd',
288+
border: '1px solid var(--mint-border, #ddd)',
285289
}}
286290
>
287291
{item.component}
@@ -290,7 +294,7 @@ export const ExampleLitActionCosts = ({ priceData }) => {
290294
style={{
291295
padding: '8px 10px',
292296
textAlign: 'right',
293-
border: '1px solid #ddd',
297+
border: '1px solid var(--mint-border, #ddd)',
294298
fontFamily: 'monospace',
295299
}}
296300
>
@@ -300,7 +304,7 @@ export const ExampleLitActionCosts = ({ priceData }) => {
300304
style={{
301305
padding: '8px 10px',
302306
textAlign: 'right',
303-
border: '1px solid #ddd',
307+
border: '1px solid var(--mint-border, #ddd)',
304308
fontFamily: 'monospace',
305309
}}
306310
>
@@ -310,7 +314,7 @@ export const ExampleLitActionCosts = ({ priceData }) => {
310314
style={{
311315
padding: '8px 10px',
312316
textAlign: 'right',
313-
border: '1px solid #ddd',
317+
border: '1px solid var(--mint-border, #ddd)',
314318
fontFamily: 'monospace',
315319
fontWeight: '600',
316320
}}
@@ -319,11 +323,11 @@ export const ExampleLitActionCosts = ({ priceData }) => {
319323
</td>
320324
</tr>
321325
))}
322-
<tr style={{ backgroundColor: '#f0f0f0', fontWeight: '600' }}>
326+
<tr style={{ backgroundColor: 'var(--mint-bg-tertiary, #f0f0f0)', fontWeight: '600' }}>
323327
<td
324328
style={{
325329
padding: '8px 10px',
326-
border: '1px solid #ddd',
330+
border: '1px solid var(--mint-border, #ddd)',
327331
}}
328332
>
329333
<strong>Total</strong>
@@ -332,21 +336,21 @@ export const ExampleLitActionCosts = ({ priceData }) => {
332336
style={{
333337
padding: '8px 10px',
334338
textAlign: 'right',
335-
border: '1px solid #ddd',
339+
border: '1px solid var(--mint-border, #ddd)',
336340
}}
337341
></td>
338342
<td
339343
style={{
340344
padding: '8px 10px',
341345
textAlign: 'right',
342-
border: '1px solid #ddd',
346+
border: '1px solid var(--mint-border, #ddd)',
343347
}}
344348
></td>
345349
<td
346350
style={{
347351
padding: '8px 10px',
348352
textAlign: 'right',
349-
border: '1px solid #ddd',
353+
border: '1px solid var(--mint-border, #ddd)',
350354
fontFamily: 'monospace',
351355
}}
352356
>

0 commit comments

Comments
 (0)