From d8234140a62fc13c53dc07fd090b09967572b245 Mon Sep 17 00:00:00 2001 From: Thomas Heartman Date: Wed, 31 Jan 2024 16:19:22 +0900 Subject: [PATCH] docs: add dark mode for course banners --- website/src/css/custom.css | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/website/src/css/custom.css b/website/src/css/custom.css index 091b6b18b6..6f7c444af5 100644 --- a/website/src/css/custom.css +++ b/website/src/css/custom.css @@ -432,10 +432,13 @@ html[data-theme='dark'] .links-container { border: var(--ifm-global-border-width) solid var(--ifm-color-emphasis-200); padding: var(--banner-padding); border-radius: var(--ifm-global-radius); - background-color: #F1F0FC; background-position: top right; background-repeat: no-repeat; overflow: hidden; +} + +html[data-theme='light'] .course-banner-container { + background-color: #F1F0FC; color: var(--banner-font-color); } @@ -453,13 +456,22 @@ html[data-theme='dark'] .links-container { } .course-banner-container .level { - border: 2px solid var(--ifm-link-color); + border: 2px solid; border-radius: 60px; - color: var(--unleash-logo-purple); padding-inline: .5em; text-transform: capitalize; } +html[data-theme='light'] .course-banner-container .level { + border-color: var(--unleash-logo-purple); + color: var(--unleash-logo-purple); +} + +html[data-theme='dark'] .course-banner-container .level { + border-color: var(--ifm-link-color); + color: var(--ifm-link-color); +} + .course-banner-container p { font-size: 1.4em; }