From d425a0c9e5ee85ce3f8ba98bdd5fe96c14f976ba Mon Sep 17 00:00:00 2001
From: hedy <hedy@tilde.cafe>
Date: Wed, 17 Jan 2024 20:44:39 +0800
Subject: Dark: For content pages using transparent images...

...which are unreadable in dark mode, use `has-dark-mode-background`
class.

    ![](/img.png){: class="has-dark-mode-background" }

Like this. And it will be given a nice light gray background and a
subtle padding & border.
---
 pydis_site/static/css/content/page.css | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

(limited to 'pydis_site/static/css')

diff --git a/pydis_site/static/css/content/page.css b/pydis_site/static/css/content/page.css
index 903b2134..b174e8d7 100644
--- a/pydis_site/static/css/content/page.css
+++ b/pydis_site/static/css/content/page.css
@@ -114,10 +114,6 @@ li img {
     margin-top: 0.5em;
 }
 
-[data-theme="dark"] hr {
-    background-color: #4c515a;
-}
-
 .dropdown-menu {
     min-width: 15rem;
 }
@@ -126,3 +122,13 @@ a.dropdown-item {
     white-space: normal;
     padding-right: 0;
 }
+
+[data-theme="dark"] hr {
+    background-color: #4c515a;
+}
+
+[data-theme="dark"] .has-dark-mode-background {
+    background-color: #EDEDED;
+    border-radius: .1rem;
+    padding: .3rem;
+}
-- 
cgit v1.2.3