From e4490939eaa0c1a5ada9c1fd8f09f8bf4d6076dd Mon Sep 17 00:00:00 2001
From: cydia2001 <cydia2001@duck.com>
Date: Wed, 11 Mar 2026 01:44:59 +0000
Subject: [PATCH] fix: restore dark mode body image backgrounds

Apply light gray backgrounds to body images in dark themes for both English and Chinese mdBook themes while explicitly excluding homepage frontpage images.
---
 books/zh/theme/dark-mode-images.css | 20 ++++++++++++++-----
 tests/test_dark_mode_images_css.py  | 30 +++++++++++++++++++++++++++++
 theme/dark-mode-images.css          | 16 +++++++++++----
 3 files changed, 57 insertions(+), 9 deletions(-)
 create mode 100644 tests/test_dark_mode_images_css.py

diff --git a/books/zh/theme/dark-mode-images.css b/books/zh/theme/dark-mode-images.css
index d0b209a..c5805c1 100644
--- a/books/zh/theme/dark-mode-images.css
+++ b/books/zh/theme/dark-mode-images.css
@@ -1,6 +1,16 @@
-html.light img[src$=".png"],
-html.light img[src$=".jpg"],
-html.light img[src$=".jpeg"],
-html.light img[src$=".gif"] {
-  background-color: #fff;
+/* 暗色模式下仅为正文图片添加浅灰色背景，提高透明背景图片的可读性 */
+.navy .content main img,
+.coal .content main img,
+.ayu .content main img {
+  background-color: #e8e8e8;
+  border-radius: 4px;
+  padding: 8px;
+}
+
+/* 首页 frontpage 图片保持透明，不添加正文图像底色。 */
+.navy .openmlsys-frontpage img,
+.coal .openmlsys-frontpage img,
+.ayu .openmlsys-frontpage img {
+  background-color: transparent !important;
+  padding: 0 !important;
 }
diff --git a/tests/test_dark_mode_images_css.py b/tests/test_dark_mode_images_css.py
new file mode 100644
index 0000000..7d6ba70
--- /dev/null
+++ b/tests/test_dark_mode_images_css.py
@@ -0,0 +1,30 @@
+from __future__ import annotations
+
+import unittest
+from pathlib import Path
+
+
+REPO_ROOT = Path(__file__).resolve().parents[1]
+
+
+class DarkModeImagesCssTests(unittest.TestCase):
+    def test_both_theme_css_files_style_dark_mode_body_images_only(self) -> None:
+        css_paths = [
+            REPO_ROOT / "theme" / "dark-mode-images.css",
+            REPO_ROOT / "books" / "zh" / "theme" / "dark-mode-images.css",
+        ]
+
+        for css_path in css_paths:
+            css = css_path.read_text(encoding="utf-8")
+
+            self.assertIn(".navy .content main img", css, css_path.as_posix())
+            self.assertIn(".coal .content main img", css, css_path.as_posix())
+            self.assertIn(".ayu .content main img", css, css_path.as_posix())
+            self.assertIn("background-color: #e8e8e8;", css, css_path.as_posix())
+            self.assertIn(".openmlsys-frontpage img", css, css_path.as_posix())
+            self.assertIn("background-color: transparent !important;", css, css_path.as_posix())
+            self.assertIn("padding: 0 !important;", css, css_path.as_posix())
+
+
+if __name__ == "__main__":
+    unittest.main()
diff --git a/theme/dark-mode-images.css b/theme/dark-mode-images.css
index 43917b8..e28960b 100644
--- a/theme/dark-mode-images.css
+++ b/theme/dark-mode-images.css
@@ -1,8 +1,16 @@
-/* 暗色模式下为图片添加浅灰色背景，提高透明背景图片的可读性 */
-.navy img,
-.coal img,
-.ayu img {
+/* 暗色模式下仅为正文图片添加浅灰色背景，提高透明背景图片的可读性 */
+.navy .content main img,
+.coal .content main img,
+.ayu .content main img {
     background-color: #e8e8e8;
     border-radius: 4px;
     padding: 8px;
 }
+
+/* 首页 frontpage 图片保持透明，不添加正文图像底色。 */
+.navy .openmlsys-frontpage img,
+.coal .openmlsys-frontpage img,
+.ayu .openmlsys-frontpage img {
+    background-color: transparent !important;
+    padding: 0 !important;
+}