From 24f85debbbcdd98b8f68d67b004304b83d8992c7 Mon Sep 17 00:00:00 2001 From: Bartosz Kaszubowski Date: Wed, 1 Jun 2022 20:54:04 +0200 Subject: [PATCH 1/4] fix Prism CodeBlock appearance after the update --- website/src/css/customTheme.scss | 22 +++++++++------------- 1 file changed, 9 insertions(+), 13 deletions(-) diff --git a/website/src/css/customTheme.scss b/website/src/css/customTheme.scss index b6234a71c5f..16dc3de9148 100644 --- a/website/src/css/customTheme.scss +++ b/website/src/css/customTheme.scss @@ -256,7 +256,7 @@ hr { border-bottom: 2px solid var(--ifm-table-border-color); } - div[class^="codeBlockContainer"] { + div[class*="codeBlockContainer"] { &, & pre { margin-bottom: 0; @@ -292,21 +292,22 @@ hr { background-color: var(--light); } - div[class^="codeBlockContainer"] { + div[class*="codeBlockContainer"] { box-shadow: none; margin-bottom: 1rem; } - div[class^="codeBlockContent"] { + div[class*="codeBlockContent"] { display: inline-grid; min-width: 100%; + background-color: var(--dark); } - div[class^="codeBlockLines"] { + div[class*="codeBlockLines"] { font-size: 80%; } - div[class^="codeBlockTitle"] { + div[class*="codeBlockTitle"] { color: var(--subtle) !important; background-color: var(--ifm-table-border-color) !important; } @@ -360,11 +361,6 @@ html[data-theme="dark"] { background-color: var(--ifm-menu-color-background-active); } - div[class^="codeBlockTitle"], - div[class^="codeBlockLines"] { - background-color: var(--deepdark) !important; - } - .prism-code { @extend %scrollbar-style-dark; } @@ -411,7 +407,7 @@ html[data-theme="dark"] article .badge { /* Home page */ .homepage { - div[class^="codeBlockContainer"] { + div[class*="codeBlockContainer"] { margin-bottom: 0; overflow: visible; @@ -1675,11 +1671,11 @@ html[data-theme="dark"] .docsRating { grid-template-rows: 1fr; grid-template-areas: ". ."; - div[class^="codeBlockContainer"] { + div[class*="codeBlockContainer"] { overflow: auto; } - div[class^="codeBlockLines"] { + div[class*="codeBlockLines"] { white-space: pre-wrap; } } From 213b11fd10ab4cdbc5ac826ac9f9cd14db468d3a Mon Sep 17 00:00:00 2001 From: Bartosz Kaszubowski Date: Wed, 1 Jun 2022 21:13:37 +0200 Subject: [PATCH 2/4] fix sidebar active category shift --- website/src/css/customTheme.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/website/src/css/customTheme.scss b/website/src/css/customTheme.scss index 16dc3de9148..ffa7974c83e 100644 --- a/website/src/css/customTheme.scss +++ b/website/src/css/customTheme.scss @@ -759,7 +759,6 @@ aside[class^="theme-doc-sidebar-container"] { a[class*="menu__link--sublist-caret"] { font-size: 16px !important; font-weight: 700 !important; - padding: 5px 12px !important; color: var(--ifm-color-content-secondary) !important; &:after { From 929e91a9e0461594236c296448904cdd49a89d01 Mon Sep 17 00:00:00 2001 From: Bartosz Kaszubowski Date: Wed, 1 Jun 2022 21:35:49 +0200 Subject: [PATCH 3/4] few more sidebar styles fixes --- website/src/css/customTheme.scss | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/website/src/css/customTheme.scss b/website/src/css/customTheme.scss index ffa7974c83e..9c493f5c8ef 100644 --- a/website/src/css/customTheme.scss +++ b/website/src/css/customTheme.scss @@ -791,6 +791,14 @@ aside[class^="theme-doc-sidebar-container"] { margin-top: 6px; } + .menu__list-item-collapsible:hover { + background: none !important; + + .menu__link--sublist-caret:hover { + background: var(--ifm-menu-color-background-hover) !important; + } + } + @media only screen and (max-width: 1120px) { --doc-sidebar-width: 240px; } @@ -874,10 +882,13 @@ aside[class^="theme-doc-sidebar-container"] { border-left-width: 4px; border-left-style: solid; border-left-color: var(--ifm-menu-color-active) !important; - padding-left: 8px !important; background: var(--ifm-code-background); } + a[href].menu__link.menu__link--active { + padding-left: 8px !important; + } + .menu__list-item-collapsible { .menu__link--active { border-left-color: transparent !important; From 5fe1f30268fb9c69c8e660e6f2df815a4b97431a Mon Sep 17 00:00:00 2001 From: Bartosz Kaszubowski Date: Wed, 1 Jun 2022 21:52:46 +0200 Subject: [PATCH 4/4] spacing and one more content shift fix --- website/src/css/customTheme.scss | 26 ++++++++++++++++---------- 1 file changed, 16 insertions(+), 10 deletions(-) diff --git a/website/src/css/customTheme.scss b/website/src/css/customTheme.scss index 9c493f5c8ef..f9fccc1fc2e 100644 --- a/website/src/css/customTheme.scss +++ b/website/src/css/customTheme.scss @@ -686,7 +686,7 @@ So we need to "revert" some CSS vars to not enforce dark mode .menu__list-item a { color: var(--ifm-color-emphasis-700); - padding: 5px 12px; + padding: 4px 12px; } .menu__list-item-collapsible a[class*="menuLinkText"] { @@ -847,7 +847,7 @@ aside[class^="theme-doc-sidebar-container"] { .menu__link--sublist { font-size: 15px; font-weight: 600; - padding: 5px 12px !important; + padding: 4px 12px !important; color: var(--light); &:after { @@ -860,7 +860,7 @@ aside[class^="theme-doc-sidebar-container"] { .menu__link { line-height: 20px; font-size: 13px; - padding: 5px 12px !important; + padding: 4px 12px !important; font-weight: 300; color: var(--ifm-font-color-base); } @@ -869,24 +869,25 @@ aside[class^="theme-doc-sidebar-container"] { font-size: 14px !important; } - .menu__list .menu__link { - padding: 5px 12px 5px 16px !important; - } - .menu__list .menu__link--active { padding-left: 12px !important; } } .menu__link.menu__link--active { - border-left-width: 4px; - border-left-style: solid; border-left-color: var(--ifm-menu-color-active) !important; - background: var(--ifm-code-background); + border-left-width: 0; } a[href].menu__link.menu__link--active { + background: var(--ifm-code-background); padding-left: 8px !important; + border-left-width: 4px; + border-left-style: solid; + } + + a[href="#"].menu__link.menu__link--active { + border-left-width: 0; } .menu__list-item-collapsible { @@ -898,6 +899,11 @@ aside[class^="theme-doc-sidebar-container"] { font-weight: 600; font-size: 15px; color: var(--subtle); + padding-left: 8px !important; + + .menu__link { + padding-left: 12px !important; + } } }