Merge branch 'main' into docs/dark-theme

3 files changed, 10 insertions, 9 deletions

diff --git a/pydis_site/apps/content/resources/guides/pydis-guides/contributing.md b/pydis_site/apps/content/resources/guides/pydis-guides/contributing.md
index b36c0afd..5dc6408c 100644
--- a/pydis_site/apps/content/resources/guides/pydis-guides/contributing.md
+++ b/pydis_site/apps/content/resources/guides/pydis-guides/contributing.md
@@ -9,8 +9,8 @@ Our projects on Python Discord are open source and [available on GitHub](https:/
 <!-- Project cards -->
 <div class="columns is-multiline is-centered is-3 is-variable">
   <div class="column is-one-third-desktop is-half-tablet">
-    <div class="card github-card">
-      <div class="card-header">
+    <div class="card github-card has-background-white">
+      <div class="card-header has-background-white">
         <div class="card-header-title is-centered">
           <a class="is-size-5" href="https://github.com/python-discord/sir-lancebot">
             <i class="fab fa-github"></i>&ensp;<strong >Sir Lancebot</strong>
@@ -22,11 +22,11 @@ Our projects on Python Discord are open source and [available on GitHub](https:/
           Sir Lancebot has a collection of self-contained, for-fun features. If you're new to Discord bots or contributing, this is a great place to start!
         </div>
       </div>
-      <div class="card-footer">
+      <div class="card-footer has-background-white">
         <a href="https://github.com/python-discord/sir-lancebot/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc" class="card-footer-item"><i class="fas fa-exclamation-circle"></i>&ensp;Issues</a>
         <a href="https://github.com/python-discord/sir-lancebot/pulls?q=is%3Apr+is%3Aopen+sort%3Aupdated-desc" class="card-footer-item"><i class="fas fa-code-merge"></i>&ensp;PRs</a>
       </div>
-      <div class="card-footer">
+      <div class="card-footer has-background-white">
         <a href="/pages/guides/pydis-guides/contributing/sir-lancebot" class="card-footer-item"><i class="fas fa-cogs"></i>&ensp;Setup and Configuration Guide</a>
       </div>
     </div>
diff --git a/pydis_site/apps/content/resources/guides/pydis-guides/how-to-contribute-a-page.md b/pydis_site/apps/content/resources/guides/pydis-guides/how-to-contribute-a-page.md
index f1ef7d29..8470a6c1 100644
--- a/pydis_site/apps/content/resources/guides/pydis-guides/how-to-contribute-a-page.md
+++ b/pydis_site/apps/content/resources/guides/pydis-guides/how-to-contribute-a-page.md
@@ -85,7 +85,6 @@ Pages, which include guides, articles, and other static content,...
 - **toc:** A number representing the smallest heading tag to show in the table of contents.
     See: [Table of Contents](#table-of-contents)
 
-
 ## Working with dark mode
 
 If your article includes images, you can apply a few classes for a better experience for readers using dark mode.
@@ -109,6 +108,8 @@ If you can provide two images, suited for each of the light and dark modes speci
 
 This way, when the reader is in light mode, only `image_light.png` is shown, and when the reader is in dark mode, only `image_dark.png` is shown.
 
+All images with `light-image` class are hidden in dark mode and all images with `dark-image` class are hidden in light mode.
+
 ## Extended Markdown
 
 Apart from standard Markdown, certain additions are available:
diff --git a/pydis_site/apps/content/resources/guides/python-guides/mutability.md b/pydis_site/apps/content/resources/guides/python-guides/mutability.md
index 185dc87c..e180fd16 100644
--- a/pydis_site/apps/content/resources/guides/python-guides/mutability.md
+++ b/pydis_site/apps/content/resources/guides/python-guides/mutability.md
@@ -30,11 +30,11 @@ It just returns a new one.
 Let's examine what's going on here.
 At first, the variable `s` refers to some object, the string `'hello'`.
 
-![s refers to the string "hello"](/static/images/content/mutability/s_refers_hello.png)
+![s refers to the string "hello"](/static/images/content/mutability/s_refers_hello.png){: class="has-dark-mode-background" }
 
 When you call `s.upper()`, a new string, which contains the characters `'HELLO'`, gets created.
 
-![s.upper creates "HELLO"](/static/images/content/mutability/s_upper_creates_HELLO.png)
+![s.upper creates "HELLO"](/static/images/content/mutability/s_upper_creates_HELLO.png){: class="has-dark-mode-background" }
 
 This happens even if you just call `s.upper()` without any assignment, on its own line:
 ```python
@@ -44,12 +44,12 @@ In this case, a new object will be created and discarded right away.
 
 Then the assignment part comes in: the name `s` gets disconnected from `'hello'`, and gets connected to `'HELLO'`.
 
-![s gets assigned to "HELLO"](/static/images/content/mutability/s_gets_assigned_to_HELLO.png)
+![s gets assigned to "HELLO"](/static/images/content/mutability/s_gets_assigned_to_HELLO.png){: class="has-dark-mode-background" }
 
 Now we can say that `'HELLO'` is stored in the `s` variable.
 
 Then, because no variables refer to the _object_ `'hello'`, it gets eaten by the garbage collector.
 
-!["hello" Gets Eaten](/static/images/content/mutability/hello_gets_eaten.png)
+!["hello" Gets Eaten](/static/images/content/mutability/hello_gets_eaten.png){: class="has-dark-mode-background" }
 
 It means that the memory reserved for that object will be freed. If that didn't happen, the 'garbage' would accumulate over time and fill up all the RAM.