From 39102437980d6fe6312e8e9a66d3840da77c1c2c Mon Sep 17 00:00:00 2001 From: "C.A.M. Gerlach" Date: Wed, 29 Jun 2022 01:24:26 -0500 Subject: [PATCH 1/4] Style: Fix basic style for other admonitions --- pep_sphinx_extensions/pep_theme/static/style.css | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/pep_sphinx_extensions/pep_theme/static/style.css b/pep_sphinx_extensions/pep_theme/static/style.css index 598ea46b063..140b73f2424 100644 --- a/pep_sphinx_extensions/pep_theme/static/style.css +++ b/pep_sphinx_extensions/pep_theme/static/style.css @@ -287,14 +287,12 @@ ul.breadcrumbs a { :root[data-colour_scheme="light"] #colour-scheme-cycler svg.colour-scheme-icon-when-light {display: initial} /* Admonitions rules */ -div.note, -div.warning { - padding: 0.5rem 0.75rem; - margin-top: 1rem; +div.admonition { + background-color: var(--colour-background-accent); margin-bottom: 1rem; + margin-top: 1rem; + padding: 0.5rem 0.75rem; } -div.note { - background-color: var(--colour-background-accent); } div.warning { background-color: var(--colour-warning); From 760fc61189184ae5d7eb4f9468e4314931320b06 Mon Sep 17 00:00:00 2001 From: "C.A.M. Gerlach" Date: Wed, 29 Jun 2022 01:27:31 -0500 Subject: [PATCH 2/4] Style: Add appropriate colors for each adomonition type --- .../pep_theme/static/style.css | 24 +++++++++++++++++-- 1 file changed, 22 insertions(+), 2 deletions(-) diff --git a/pep_sphinx_extensions/pep_theme/static/style.css b/pep_sphinx_extensions/pep_theme/static/style.css index 140b73f2424..3c086405479 100644 --- a/pep_sphinx_extensions/pep_theme/static/style.css +++ b/pep_sphinx_extensions/pep_theme/static/style.css @@ -32,14 +32,18 @@ /* Set master colours */ :root { --colour-background: var(--light, white) var(--dark, #011); - --colour-background-accent: var(--light, #eee) var(--dark, #333); + --colour-background-accent: var(--light, #ccc) var(--dark, #333); --colour-text: var(--light, #333) var(--dark, #ccc); --colour-links: var(--light, #0072aa) var(--dark, #8bf); --colour-scrollbar: var(--light, #ccc) var(--dark, #333); --colour-rule-strong: var(--light, #888) var(--dark, #777); --colour-rule-light: var(--light, #ddd) var(--dark, #222); --colour-inline-code: var(--light, #f8f8f8) var(--dark, #333); - --colour-warning: var(--light, #fee) var(--dark, #900); + --colour-error: var(--light, #faa) var(--dark, #800); + --colour-warning: var(--light, #fca) var(--dark, #840); + --colour-caution: var(--light, #ffa) var(--dark, #440); + --colour-attention: var(--light, #bcf) var(--dark, #034); + --colour-tip: var(--light, #bfc) var(--dark, #031); } img.invert-in-dark-mode { @@ -293,10 +297,26 @@ div.admonition { margin-top: 1rem; padding: 0.5rem 0.75rem; } + +div.danger, +div.error { + background-color: var(--colour-error); } div.warning { background-color: var(--colour-warning); } +div.caution { + background-color: var(--colour-caution); +} +div.attention, +div.important { + background-color: var(--colour-attention); +} +div.hint, +div.tip { + background-color: var(--colour-tip); +} + p.admonition-title { font-weight: bold; } From 84470a475fc72702fa75ebe78a1fad30ee734de2 Mon Sep 17 00:00:00 2001 From: "C.A.M. Gerlach" Date: Wed, 29 Jun 2022 14:56:02 -0500 Subject: [PATCH 3/4] Style: Increase contrast with text/links in admonition boxes --- pep_sphinx_extensions/pep_theme/static/style.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/pep_sphinx_extensions/pep_theme/static/style.css b/pep_sphinx_extensions/pep_theme/static/style.css index 3c086405479..b4c51b74422 100644 --- a/pep_sphinx_extensions/pep_theme/static/style.css +++ b/pep_sphinx_extensions/pep_theme/static/style.css @@ -34,15 +34,15 @@ --colour-background: var(--light, white) var(--dark, #011); --colour-background-accent: var(--light, #ccc) var(--dark, #333); --colour-text: var(--light, #333) var(--dark, #ccc); - --colour-links: var(--light, #0072aa) var(--dark, #8bf); + --colour-links: var(--light, #069) var(--dark, #8bf); --colour-scrollbar: var(--light, #ccc) var(--dark, #333); --colour-rule-strong: var(--light, #888) var(--dark, #777); --colour-rule-light: var(--light, #ddd) var(--dark, #222); --colour-inline-code: var(--light, #f8f8f8) var(--dark, #333); - --colour-error: var(--light, #faa) var(--dark, #800); - --colour-warning: var(--light, #fca) var(--dark, #840); + --colour-error: var(--light, #fcc) var(--dark, #800); + --colour-warning: var(--light, #fdb) var(--dark, #804000); --colour-caution: var(--light, #ffa) var(--dark, #440); - --colour-attention: var(--light, #bcf) var(--dark, #034); + --colour-attention: var(--light, #bdf) var(--dark, #034); --colour-tip: var(--light, #bfc) var(--dark, #031); } From 284ae32557fe86b642dc24042003c35f09e34cb5 Mon Sep 17 00:00:00 2001 From: "C.A.M. Gerlach" Date: Thu, 30 Jun 2022 18:16:10 -0500 Subject: [PATCH 4/4] Use higher-contrast link color in admonitions & adjust BGs accordingly --- pep_sphinx_extensions/pep_theme/static/style.css | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/pep_sphinx_extensions/pep_theme/static/style.css b/pep_sphinx_extensions/pep_theme/static/style.css index b4c51b74422..dfbec6cea98 100644 --- a/pep_sphinx_extensions/pep_theme/static/style.css +++ b/pep_sphinx_extensions/pep_theme/static/style.css @@ -35,15 +35,16 @@ --colour-background-accent: var(--light, #ccc) var(--dark, #333); --colour-text: var(--light, #333) var(--dark, #ccc); --colour-links: var(--light, #069) var(--dark, #8bf); + --colour-links-light: var(--light, #057) var(--dark, #acf); --colour-scrollbar: var(--light, #ccc) var(--dark, #333); --colour-rule-strong: var(--light, #888) var(--dark, #777); --colour-rule-light: var(--light, #ddd) var(--dark, #222); --colour-inline-code: var(--light, #f8f8f8) var(--dark, #333); - --colour-error: var(--light, #fcc) var(--dark, #800); - --colour-warning: var(--light, #fdb) var(--dark, #804000); - --colour-caution: var(--light, #ffa) var(--dark, #440); - --colour-attention: var(--light, #bdf) var(--dark, #034); - --colour-tip: var(--light, #bfc) var(--dark, #031); + --colour-error: var(--light, #faa) var(--dark, #800); + --colour-warning: var(--light, #fca) var(--dark, #840); + --colour-caution: var(--light, #ffa) var(--dark, #550); + --colour-attention: var(--light, #bdf) var(--dark, #045); + --colour-tip: var(--light, #bfc) var(--dark, #041); } img.invert-in-dark-mode { @@ -297,6 +298,9 @@ div.admonition { margin-top: 1rem; padding: 0.5rem 0.75rem; } +div.admonition a { + color: var(--colour-links-light); +} div.danger, div.error {