From 5beb752ce219b656d46edbb8833a985f56ebbcc6 Mon Sep 17 00:00:00 2001
From: reuixiy <reuixiy@gmail.com>
Date: Mon, 4 Nov 2019 22:18:43 +0800
Subject: [PATCH] feat: new image filter for dark mode
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

decrease brightness only instead of invert color

https://blog.fsky7.com/archives/46/

BREAKING CHANGE: `darkImage` option is removed

You can delete `darkImage` in config.toml or post’s Front Matter now.
---
 README.md                   | 1 -
 README.zh-cn.md             | 5 -----
 assets/scss/main.scss       | 3 +++
 exampleSite/config.toml     | 7 -------
 layouts/partials/style.html | 4 ----
 5 files changed, 3 insertions(+), 17 deletions(-)

diff --git a/README.md b/README.md
index 848fbecc..31c3f886 100644
--- a/README.md
+++ b/README.md
@@ -164,7 +164,6 @@ motto | author’s description | string, Markdown supported, theme only
 avatar | author’s avatar | string, URL, theme only
 twitter | author’s twitter id | string, theme only
 facebook | author’s facebook id | string, theme only
-darkImage | dark image? | boolean, override `darkImage` in `config.toml`, theme only
 smallCaps | small caps? | boolean, override `enableSmallCaps` in `config.toml`, theme only
 dropCap | drop cap? | boolean, override `enableDropCap` in `config.toml`, theme only
 dropCapAfterHr | drop cap after every horizontal rule tag? | boolean, override `enableDropCapAfterHr` in `config.toml`, theme only
diff --git a/README.zh-cn.md b/README.zh-cn.md
index c1e7842f..bbea03ac 100644
--- a/README.zh-cn.md
+++ b/README.zh-cn.md
@@ -522,10 +522,6 @@ defaultTheme = "light"
 hideThemeToggle = false
 # 是否在首页隐藏模式切换开关
 hideThemeToggleInHome = false
-# 是否深色化图片
-# 对白底的黑白图片效果较好，对于彩色图片效果较差，建议在这里设置为 `false`
-# 如果你的某篇需要，可以在该文章的 Front Matter 中设置为 `true`
-darkImage = false
 
 # 网页应用
 # 前往 https://realfavicongenerator.net/ 生成相关图标和文件
@@ -939,7 +935,6 @@ motto | author’s description | string, Markdown supported, theme only
 avatar | author’s avatar | string, URL, theme only
 twitter | author’s twitter id | string, theme only
 facebook | author’s facebook id | string, theme only
-darkImage | dark image? | boolean, override `darkImage` in `config.toml`, theme only
 smallCaps | small caps? | boolean, override `enableSmallCaps` in `config.toml`, theme only
 dropCap | drop cap? | boolean, override `enableDropCap` in `config.toml`, theme only
 dropCapAfterHr | drop cap after every horizontal rule tag? | boolean, override `enableDropCapAfterHr` in `config.toml`, theme only
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
index 3d457f3c..b3aec272 100644
--- a/assets/scss/main.scss
+++ b/assets/scss/main.scss
@@ -100,6 +100,9 @@
         position: relative;
         z-index: 4;
     }
+    html[data-theme='dark'] .post img {
+        filter: brightness(50%);
+    }
 {{ end }}
 
 {{ if and .Site.IsMultiLingual .Site.Params.enableLangToggle }}
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index e662d7df..6d18dd9b 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -491,13 +491,6 @@ defaultTheme = "light"
 # has enabled Dark Mode (`prefers-color-scheme: dark`).
 hideThemeToggle = false
 hideThemeToggleInHome = false
-# Useful for black and white images on a white background.
-# Bad for color images. I suggest you set `true` in post’s
-# Front Matter instead of here, unless all your images are
-# black and white on a white background. Also, you can set
-# `true` here and set `false` in Front Matter which will
-# override what you have set here.
-darkImage = true
 
 # Web App
 # https://realfavicongenerator.net/
diff --git a/layouts/partials/style.html b/layouts/partials/style.html
index d60da29a..13f36d66 100644
--- a/layouts/partials/style.html
+++ b/layouts/partials/style.html
@@ -15,10 +15,6 @@
     {{- if or (and .IsHome .Site.Params.hideThemeToggleInHome) (and (not .IsHome) .Site.Params.hideThemeToggle) -}}
         {{- .Scratch.Add "style" "#theme-toggle {display:none}" -}}
     {{- end -}}
-
-    {{- if .Params.darkImage | default .Site.Params.darkImage -}}
-        {{- .Scratch.Add "style" "html[data-theme='dark'] .post img {filter:invert(85%) hue-rotate(180deg)}" -}}
-    {{- end -}}
 {{- end -}}
 
 {{- if and .Site.IsMultiLingual .Site.Params.enableLangToggle -}}