From c3241f7e091827417d336c4a75e8227a8a8205ea Mon Sep 17 00:00:00 2001 From: Scott Lowe Date: Thu, 23 Jan 2025 21:58:48 -1000 Subject: [PATCH 1/4] DOC: Add custom CSS to tweak colour scheme In line with BIOSCAN Browser Style Guide https://bioscan-browser.netlify.app/style-guide --- docs/source/_static/css/custom.css | 46 ++++++++++++++++++++++++++++++ docs/source/conf.py | 5 ++++ 2 files changed, 51 insertions(+) create mode 100644 docs/source/_static/css/custom.css diff --git a/docs/source/_static/css/custom.css b/docs/source/_static/css/custom.css new file mode 100644 index 0000000..9d195fb --- /dev/null +++ b/docs/source/_static/css/custom.css @@ -0,0 +1,46 @@ +@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap'); + +body { + font-family: "Source Sans 3",Lato,proxima-nova,Helvetica Neue,Arial,sans-serif; +} + +.rst-content .toctree-wrapper>p.caption, +h1, +h2, +h3, +h4, +h5, +h6, +legend { + font-family:Montserrat,Roboto Slab,ff-tisa-web-pro,Georgia,Arial,sans-serif +} + +.highlight pre { + font-family: "Source Code Pro",SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,Courier,monospace; +} + +.caption-text { + color: #10b981; +} +.wy-side-nav-search { + background-color: #047857; +} +vertical p.caption { + color: #0ea5e9; +} +a { + color: #075985; + text-underline-offset: 4px; +} +a:hover { + text-decoration-line: underline; +} + +html.writer-html5 .rst-content dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.citation):not(.glossary):not(.simple) > dt { + background-color: #e6f9f3; + color: #108866; + border-top-color: #6fccb2; +} +.rst-content .viewcode-link { + color: #0ea5e9; +} diff --git a/docs/source/conf.py b/docs/source/conf.py index ddf92bc..153bc3d 100644 --- a/docs/source/conf.py +++ b/docs/source/conf.py @@ -200,6 +200,11 @@ def setup(app): # so a file named "default.css" will overwrite the builtin "default.css". html_static_path = ["_static"] +# Custom stylesheet path, within _static +html_css_files = [ + "css/custom.css", +] + # Custom sidebar templates, must be a dictionary that maps document names # to template names. # From 4366068b71cbbd930151b581b2d3986bdb5a25e1 Mon Sep 17 00:00:00 2001 From: Anna Viklund Date: Thu, 30 Jan 2025 12:45:10 -1000 Subject: [PATCH 2/4] DOC: Update custom.css to improve look Further in line with bioscan-browser styles. --- docs/source/_static/css/custom.css | 163 +++++++++++++++++++++++++---- 1 file changed, 142 insertions(+), 21 deletions(-) diff --git a/docs/source/_static/css/custom.css b/docs/source/_static/css/custom.css index 9d195fb..ef57936 100644 --- a/docs/source/_static/css/custom.css +++ b/docs/source/_static/css/custom.css @@ -1,10 +1,27 @@ -@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap'); +@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap"); +/* Color scheme */ body { - font-family: "Source Sans 3",Lato,proxima-nova,Helvetica Neue,Arial,sans-serif; + --color-white: #fff; + --color-gray-50: #f9fafb; + --color-gray-200: #e5e7eb; + --color-gray-500: #6b7280; + --color-gray-800: #1f2937; + --color-gray-700: #374151; + --color-emerald-50: #ecfdf5; + --color-emerald-500: #10b981; + --color-emerald-700: #047857; + --color-sky-500: #0ea5e9; + --color-sky-800: #075985; +} + +/* Typography */ +body { + color: var(--color-gray-800); + font-family: "Source Sans 3", Lato, sans-serif; + font-weight: 400; } -.rst-content .toctree-wrapper>p.caption, h1, h2, h3, @@ -12,35 +29,139 @@ h4, h5, h6, legend { - font-family:Montserrat,Roboto Slab,ff-tisa-web-pro,Georgia,Arial,sans-serif + color: var(--color-sky-800); + font-family: "Montserrat", Roboto Slab, serif; + font-weight: 700; } .highlight pre { - font-family: "Source Code Pro",SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,Courier,monospace; + font-family: "Source Code Pro", SFMono-Regular, monospace; + font-weight: 400; +} + +a { + color: var(--color-sky-800) !important; + font-weight: 500; + text-underline-offset: 4px; + + &:hover { + text-decoration: underline; + } +} + +footer { + color: var(--color-gray-500); +} + +.wy-menu-vertical p.caption { + color: var(--color-gray-500); +} + +.wy-nav-top, +.wy-nav-top a, +.wy-side-nav-search a { + color: var(--color-white) !important; + text-decoration: none; } -.caption-text { - color: #10b981; +/* Layout blocks */ +.wy-nav-side { + background-color: var(--color-gray-800); + border-right: 1px solid var(--color-gray-200); } + .wy-side-nav-search { - background-color: #047857; + background-color: var(--color-emerald-500); } -vertical p.caption { - color: #0ea5e9; + +.wy-nav-top { + background-color: var(--color-emerald-500); } -a { - color: #075985; - text-underline-offset: 4px; + +.wy-nav-content { + background: var(--color-white); + border-right: 1px solid var(--color-gray-200); + overflow: auto; +} + +.wy-nav-content-wrap { + background-color: var(--color-gray-50); } -a:hover { - text-decoration-line: underline; + +/* Text input */ +.wy-side-nav-search input[type="text"] { + background-color: var(--color-white); + border-radius: 4px; + border: 1px solid var(--color-gray-200); + box-shadow: none; + color: var(--color-gray-500); + padding: 0.5rem 0.75rem; + + &::placeholder { + color: var(--color-gray-500); + } +} + +/* Button */ +.btn-neutral { + background-color: var(--color-white) !important; + border-radius: 4px; + border: 1px solid var(--color-gray-200); + box-shadow: none; + color: var(--color-gray-800) !important; + padding: 0.5rem 0.75rem; + + &:hover { + background-color: var(--color-gray-200) !important; + text-decoration: none; + } + + &:visited { + color: var(--color-gray-800) !important; + } } -html.writer-html5 .rst-content dl[class]:not(.option-list):not(.field-list):not(.footnote):not(.citation):not(.glossary):not(.simple) > dt { - background-color: #e6f9f3; - color: #108866; - border-top-color: #6fccb2; +/* Separators */ +hr, +#search-results li { + border-color: var(--color-gray-200) !important; } -.rst-content .viewcode-link { - color: #0ea5e9; + +/* Tree navigation */ +.wy-menu-vertical { + a { + background-color: transparent !important; + border: none !important; + color: var(--color-white) !important; + + &:hover { + background-color: var(--color-gray-700); + } + } + + button { + color: var(--color-white) !important; + } + + li.current { + background-color: var(--color-gray-700); + } +} + +/* Code blocks */ +.rst-content div[class^="highlight"] { + background-color: var(--color-gray-50); + border-radius: 4px; + border: 1px solid var(--color-gray-200); +} + +html.writer-html5 + .rst-content + dl[class]:not(.option-list):not(.field-list):not(.footnote):not( + .citation + ):not(.glossary):not(.simple) + > dt { + background-color: var(--color-emerald-50); + border-top-color: var(--color-emerald-500); + color: var(--color-emerald-700); } From b5b54840727f522d02272e0afbee8d50bf3acda9 Mon Sep 17 00:00:00 2001 From: Scott Lowe Date: Thu, 6 Feb 2025 23:50:26 -0800 Subject: [PATCH 3/4] DOC: Update colour of [source] link in API pages --- docs/source/_static/css/custom.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/source/_static/css/custom.css b/docs/source/_static/css/custom.css index ef57936..364442a 100644 --- a/docs/source/_static/css/custom.css +++ b/docs/source/_static/css/custom.css @@ -165,3 +165,7 @@ html.writer-html5 border-top-color: var(--color-emerald-500); color: var(--color-emerald-700); } + +.rst-content .viewcode-link { + color: var(--color-emerald-500); +} From 94b540c38e04019782468ed1541f96d4234dd781 Mon Sep 17 00:00:00 2001 From: Scott Lowe Date: Thu, 6 Feb 2025 23:51:02 -0800 Subject: [PATCH 4/4] DOC: Make RTD version dropdown higher contrast --- docs/source/_static/css/custom.css | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/docs/source/_static/css/custom.css b/docs/source/_static/css/custom.css index 364442a..ae4e02f 100644 --- a/docs/source/_static/css/custom.css +++ b/docs/source/_static/css/custom.css @@ -102,6 +102,15 @@ footer { } } +.wy-side-nav-search > div.switch-menus > div.version-switch select { + color: hsla(0,0%,100%,.5); + font-family: "Source Sans 3", Lato, sans-serif; + + &:hover { + color: hsla(0,0%,100%,.6); + } +} + /* Button */ .btn-neutral { background-color: var(--color-white) !important;