Skip to content

Commit 0116210

Browse files
committed
style(css): Refine argument name styling with monokai background
- Use monokai background (#272822) for both light and dark modes - Add dark mode media query for prefers-color-scheme support - Adjust padding to .325rem .6rem and border-radius to .2rem - Add width: fit-content to .argparse-argument-name - Set headerlink color to #9ca0a5 in light mode for dark background - Remove color-mix override (same background for both modes now)
1 parent 40eddab commit 0116210

1 file changed

Lines changed: 19 additions & 9 deletions

File tree

docs/_static/css/argparse-highlight.css

Lines changed: 19 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -279,26 +279,32 @@ pre.argparse-usage {
279279

280280
/*
281281
* Light mode overrides
282-
* Furo's default inline code background is too dark in light mode.
282+
* Use monokai background (#272822) to match code blocks.
283283
*/
284284
body:not([data-theme="dark"]) {
285-
--color-inline-code-background: #eeeeee;
285+
--color-inline-code-background: #272822;
286+
}
287+
288+
/*
289+
* Dark mode overrides (respects prefers-color-scheme)
290+
* Use monokai background (#272822) to match code blocks.
291+
*/
292+
@media (prefers-color-scheme: dark) {
293+
body:not([data-theme="light"]) {
294+
--color-inline-code-background: #272822;
295+
}
286296
}
287297

288298
/*
289299
* Background styling for argument names - subtle background like code.literal
290300
* This provides visual weight and hierarchy for argument definitions.
291-
* Light mode uses a lighter tint (50% white mix) for better contrast.
292301
*/
293302
.argparse-argument-name {
294303
background: var(--color-inline-code-background);
295-
border-radius: .2em;
296-
padding: .1em .3em;
304+
border-radius: .2rem;
305+
padding: .325rem .6rem;
297306
font-family: var(--font-stack--monospace);
298-
}
299-
300-
body:not([data-theme="dark"]) .argparse-argument-name {
301-
background: color-mix(in srgb, var(--color-inline-code-background), white 50%);
307+
width: fit-content;
302308
}
303309

304310
/*
@@ -321,6 +327,10 @@ body:not([data-theme="dark"]) .argparse-argument-name {
321327
text-decoration: none;
322328
}
323329

330+
body:not([data-theme="dark"]) .argparse-argument-name .headerlink {
331+
color: #9ca0a5;
332+
}
333+
324334
.argparse-argument-name:hover .headerlink {
325335
visibility: visible;
326336
}

0 commit comments

Comments
 (0)