Add a dark color variant for diff sections
authorAlexander Ebert <ebert@woltlab.com>
Fri, 28 Jul 2023 13:14:37 +0000 (15:14 +0200)
committerAlexander Ebert <ebert@woltlab.com>
Fri, 28 Jul 2023 13:14:37 +0000 (15:14 +0200)
See https://www.woltlab.com/community/thread/300639-light-colored-headline-in-version-history-of-articles-in-dark-mode/

wcfsetup/install/files/style/ui/messageEditHistory.scss

index 96d0b05840ea0fa9762385e9ca6397848823ffe3..b7cbc1b3e17f0ec0c250f7df3e5625b3cc4f9c42 100644 (file)
@@ -4,6 +4,8 @@
        --diffAdded-color: #3c763d;
        --diffRemoved-background: #f2dede;
        --diffRemoved-color: #a94442;
+       --diffSection-background: #eceff1;
+       --diffSection-color: #2c3e50;
 
        @include screen-md-down {
                overflow: auto;
@@ -47,9 +49,9 @@
 
                        &.diffSection {
                                background-clip: padding-box;
-                               background-color: rgb(236, 239, 241);
+                               background-color: var(--diffSection-background);
                                border-bottom: 20px solid transparent;
-                               color: rgb(44, 62, 80);
+                               color: var(--diffSection-color);
                                padding: 10px;
                                text-align: center;
 
@@ -85,6 +87,8 @@ html[data-color-scheme="dark"] {
                --diffAdded-color: #4f9c51;
                --diffRemoved-background: #281010;
                --diffRemoved-color: #d95654;
+               --diffSection-background: #252e3d;
+               --diffSection-color: #959595;
        }
 }