optimzations for dark mode

numero2 · Nov 28, 2024 · 0fdaf5f · 0fdaf5f
1 parent 8bc50e2
commit 0fdaf5f
Show file tree

Hide file tree

Showing 4 changed files with 81 additions and 5 deletions.
diff --git a/src/Resources/public/backend.css b/src/Resources/public/backend.css
@@ -94,3 +94,12 @@ fieldset[data-contao--toggle-fieldset-id-value="twitter_legend"] legend button:b
   background: url("/bundles/opengraph3/icon-twitter.svg") no-repeat scroll 50% 50%;
   background-size: contain;
 }
+
+html[data-color-scheme="dark"] fieldset[data-contao--toggle-fieldset-id-value="opengraph_legend"] legend button:before {
+  background-image: url("/bundles/opengraph3/icon-ogp_1c.svg");
+}
+
+html[data-color-scheme="dark"] fieldset[data-contao--toggle-fieldset-id-value="opengraph_legend"] legend button:before,
+html[data-color-scheme="dark"] fieldset[data-contao--toggle-fieldset-id-value="twitter_legend"] legend button:before {
+  filter: brightness(0) invert(50%) sepia(24%) saturate(224%) hue-rotate(184deg) brightness(91%) contrast(90%);
+}
diff --git a/src/Resources/public/backend.scss b/src/Resources/public/backend.scss
@@ -87,4 +87,16 @@ fieldset[data-contao--toggle-fieldset-id-value="twitter_legend"] legend button,
         background: url('/bundles/opengraph3/icon-twitter.svg') no-repeat scroll 50% 50%;
         background-size: contain;
     }
+}
+
+html[data-color-scheme="dark"] {
+
+    fieldset[data-contao--toggle-fieldset-id-value="opengraph_legend"] legend button:before {
+        background-image: url('/bundles/opengraph3/icon-ogp_1c.svg');
+    }
+
+    fieldset[data-contao--toggle-fieldset-id-value="opengraph_legend"] legend button:before,
+    fieldset[data-contao--toggle-fieldset-id-value="twitter_legend"] legend button:before {
+        filter: brightness(0) invert(50%) sepia(24%) saturate(224%) hue-rotate(184deg) brightness(91%) contrast(90%);
+    }
 }
diff --git a/src/Resources/public/icon-ogp_1c.svg b/src/Resources/public/icon-ogp_1c.svg
diff --git a/src/Resources/public/icon-twitter.svg b/src/Resources/public/icon-twitter.svg