From b640934b0fb8923d1bf5fedd75a68af7d00910df Mon Sep 17 00:00:00 2001 From: JimhHan <50871214+JimhHan@users.noreply.github.com> Date: Thu, 8 Apr 2021 20:58:14 +0800 Subject: [PATCH] Tweak dark mode --- docs/.vuepress/theme/styles/default/_color.scss | 10 +++++----- docs/.vuepress/theme/styles/default/_variables.scss | 6 +++--- docs/.vuepress/theme/styles/default/home.scss | 6 +++--- docs/.vuepress/theme/styles/default/layout.scss | 5 +++-- 4 files changed, 14 insertions(+), 13 deletions(-) diff --git a/docs/.vuepress/theme/styles/default/_color.scss b/docs/.vuepress/theme/styles/default/_color.scss index 134b137c3..a8ce3722c 100644 --- a/docs/.vuepress/theme/styles/default/_color.scss +++ b/docs/.vuepress/theme/styles/default/_color.scss @@ -1,6 +1,6 @@ $accentLightColor: #2e73ea; $textLightColor: #2c3e50; -$borderLightColor: #eaecef; +$borderLightColor: #d3d5d9; $codeBgLightColor: #282c34; $arrowBgLightColor: #ccc; $tipLightColor: #42b983; @@ -18,9 +18,9 @@ $tableBackgroundLightColor: #f6f8fa; $metaItemLightColor: #767676; $dangerBgLightColor: #ffe6e6; $warningBgLightColor: rgba(255, 229, 100, 0.3); -$miniCodeBgLightColor: rgba(27, 31, 35, 0.05); +$miniCodeBgLightColor: rgba(95, 101, 106, 0.1); -$accentDarkColor: #2a6add; +$accentDarkColor: #407ce8; $textDarkColor: #c0bebe; $borderDarkColor: #4e4e4e; $codeBgDarkColor: #282c34; @@ -29,11 +29,11 @@ $tipDarkColor: #42b983; $tipBackgroundDarkColor: #373a3f; $warningDarkColor: #e7c000; $dangerDarkColor: #cc0000; -$badgeTipDarkColor: #1b4632; +$badgeTipDarkColor: #18411a; $badgeWarningDarkColor: #e4be04; $badgeDangerDarkColor: #b00606; $backgroundDarkColor: #25272a; -$kbdBackgroundDarkColor: #444; +$kbdBackgroundDarkColor: #3c3c3c; $kbdBorderDarkColor: #666b6f; $tableBorderDarkColor: #666b6f; $tableBackgroundDarkColor: #5b5b5b; diff --git a/docs/.vuepress/theme/styles/default/_variables.scss b/docs/.vuepress/theme/styles/default/_variables.scss index 095e2bdb4..f03e66b50 100644 --- a/docs/.vuepress/theme/styles/default/_variables.scss +++ b/docs/.vuepress/theme/styles/default/_variables.scss @@ -58,9 +58,9 @@ html { --miniCodeBgColor: #{$miniCodeBgLightColor}; --textColorLighten10: #{lighten($textLightColor, 10%)}; - --textColorLighten25: #{lighten($textLightColor, 23%)}; - --textColorLighten40: #{lighten($textLightColor, 40%)}; + --textColorLighten25: #{lighten($textLightColor, 20%)}; + --textColorLighten40: #{lighten($textLightColor, 30%)}; --accentColorLighten8: #{lighten($accentLightColor, 8%)}; - --accentColorLighten10: #{lighten($accentLightColor, 10%)}; + --accentColorLighten10: #{lighten($accentLightColor, 12%)}; --accentColorLighten30: #{lighten($accentLightColor, 30%)}; } diff --git a/docs/.vuepress/theme/styles/default/home.scss b/docs/.vuepress/theme/styles/default/home.scss index dea964607..4efc8016a 100644 --- a/docs/.vuepress/theme/styles/default/home.scss +++ b/docs/.vuepress/theme/styles/default/home.scss @@ -36,16 +36,16 @@ .feature { h2 { - color: var(--textColorLighten25); + color: var(--textColorLighten10); } p { - color: var(--textColorLighten25); + color: var(--textColorLighten10); } } .footer { border-top: 1px solid var(--borderColor); - color: var(--textColorLighten25); + color: var(--textColorLighten10); } } diff --git a/docs/.vuepress/theme/styles/default/layout.scss b/docs/.vuepress/theme/styles/default/layout.scss index 0b0b390db..864b8dec5 100644 --- a/docs/.vuepress/theme/styles/default/layout.scss +++ b/docs/.vuepress/theme/styles/default/layout.scss @@ -8,11 +8,12 @@ .sidebar { background-color: var(--backgroundColor); border-right: 1px solid var(--borderColor); - scrollbar-color: var(--accentColor) var(--borderColor); + scrollbar-color: var(--accentColorLighten8) var(--borderColor); + &::-webkit-scrollbar-track { background-color: var(--borderColor); } &::-webkit-scrollbar-thumb { - background-color: var(--accentColor); + background-color: var(--accentColorLighten8); } }