From d425a0c9e5ee85ce3f8ba98bdd5fe96c14f976ba Mon Sep 17 00:00:00 2001 From: hedy 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. --- .../content/resources/guides/python-guides/mutability.md | 8 ++++---- pydis_site/static/css/content/page.css | 14 ++++++++++---- 2 files changed, 14 insertions(+), 8 deletions(-) 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. 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