added code to darken images in dark mode. Easier on the eyes.

diff --git a/assets/sass/components/_image.scss b/assets/sass/components/_image.scss
index 6f7981c0bbe221ae9173c60948d836c32dfbb849..9636a0f464d1c33b7ff0ea3ef65a2ed6d3372997 100644 (file)
--- a/assets/sass/components/_image.scss
+++ b/assets/sass/components/_image.scss
@@ -65,7 +65,7 @@
                @include circle(200px, "block");\r
                @include box-shadow(-5px, 5px, 5px, _palette_light(fg-bold));\r
                @media screen and (prefers-color-scheme: dark) {\r
-                       @include box-shadow(-5px, 5px, 5px, _palette_dark(fg-bold));\r
+                       @include box-shadow(-5px, 5px, 5px, _palette_light(fg-bold));\r
                }\r
        }\r
 \r

diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index 37f5678e3c439409034b38fdfacf45bd506a8341..26fae48177439441d26b9bfeb8ec1febbd6372b0 100644 (file)
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -70,3 +70,12 @@
        @import 'layout/footer';
        @import 'layout/wrapper';
        @import 'layout/menu';
+
+// darken images in dark mode
+@media screen and (prefers-color-scheme: dark) {
+       $image-filter: grayscale(50%);
+
+       img:not([src*='.svg']) {
+         filter: $image-filter;
+       }
+}