html要素にもダークモードクラスを適用してスクロール背景を修正

claude · claude · commit dddaed24252b · 2026-01-13T11:48:34.000Z
- :rootにデフォルトの--color-baseと--background-color-Aを設定
- html要素にも dark-mode/light-mode クラスを追加するよう修正
- index.htmlに初期クラスとしてdark-modeを追加
diff --git a/css/root.css b/css/root.css
@@ -130,7 +130,9 @@
 }
 
 :root {
-  
+  --color-base: #212121;
+  --background-color-A: #212121;
+
   --nav-height:                           calc(100vh - 96vh);
   --main-height:                          calc(100vh - 4vh);
   --left_area-height:                     calc(100vh - 5vh);
diff --git a/index.html b/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="dark-mode">
 
 <head>
     <title>Manga Editor Desu! Pro Edition: The Premier Standalone Manga Editing Platform</title>
diff --git a/js/ui/util/mode-change.js b/js/ui/util/mode-change.js
@@ -142,6 +142,8 @@ const logo=$('navbar-logo');
 
 document.body.classList.remove('light-mode');
 document.body.classList.add('dark-mode');
+document.documentElement.classList.remove('light-mode');
+document.documentElement.classList.add('dark-mode');
 localStorage.setItem('mode','dark-mode');
 logo.src='02_images_svg/Logo/black_mode_logo.webp';
 
@@ -158,6 +160,7 @@ function initializeMode() {
 // const mode = localStorage.getItem('mode') || 'dark-mode';
 const mode='dark-mode';
 document.body.classList.add(mode);
+document.documentElement.classList.add(mode);
 const logo=$('navbar-logo');
 if (mode==='dark-mode') {
 $('mode-toggle').checked=true;
