v5.4.12

Fixed main nav background color in dark mode
closes https://github.com/TryGhost/Casper/issues/942
2025-07-12 16:56:06 +00:00 · 2023-06-20 12:09:25 +08:00 · 2023-06-20 12:09:08 +08:00 · 2023-05-09 13:30:12 +08:00 · 2023-05-09 13:27:37 +08:00 · 2023-04-21 09:49:57 +01:00
7 changed files with 19 additions and 13 deletions
--- a/assets/built/casper.js
+++ b/assets/built/casper.js
--- a/assets/built/casper.js.map
+++ b/assets/built/casper.js.map
--- a/assets/built/screen.css
+++ b/assets/built/screen.css
--- a/assets/built/screen.css.map
+++ b/assets/built/screen.css.map
--- a/assets/css/screen.css
+++ b/assets/css/screen.css
@ -63,6 +63,7 @@ production stylesheet in assets/built/screen.css
 /* ---------------------------------------------------------- */

 .viewport {
+    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
@ -2118,7 +2119,7 @@ html.dark-mode figcaption a {
    color: #fff;
 }

-html.dark-mode .gh-head {
+html.dark-mode body:not(.has-cover) .gh-head {
    background: var(--color-darkmode);
    color: #fff;
 }
@ -2286,8 +2287,9 @@ html.dark-mode .footer-cta-title {
 }

@media (max-width: 767px) {
-    html.dark-mode .gh-head-open #gh-head .gh-head-actions {
-        background-color: var(--color-darkmode);
+    html.dark-mode .gh-head-open:not(.has-cover) #gh-head,
+    html.dark-mode .gh-head-open:not(.has-cover) #gh-head .gh-head-actions {
+        background: var(--color-darkmode);
    }
 }

@ -2309,7 +2311,7 @@ html.dark-mode .footer-cta-title {
        color: #fff;
    }

-    html.auto-color .gh-head {
+    html.auto-color body:not(.has-cover) .gh-head {
        background: var(--color-darkmode);
        color: #fff;
    }
@ -2477,8 +2479,9 @@ html.dark-mode .footer-cta-title {
    }

    @media (max-width: 767px) {
-        html.auto-color .gh-head-open #gh-head .gh-head-actions {
-            background-color: var(--color-darkmode);
+        html.auto-color .gh-head-open:not(.has-cover) #gh-head,
+        html.auto-color .gh-head-open:not(.has-cover) #gh-head .gh-head-actions {
+            background: var(--color-darkmode);
        }
    }
 }
--- a/assets/js/dropdown.js
+++ b/assets/js/dropdown.js
@ -16,6 +16,7 @@
        });
    }

+    var windowClickListener;
    const makeDropdown = function () {
        if (mediaQuery.matches) return;
        const submenuItems = [];
@ -62,11 +63,12 @@
            document.body.classList.toggle('is-dropdown-open');
        });

-        window.addEventListener('click', function (e) {
+        windowClickListener = function (e) {
            if (!toggle.contains(e.target) && document.body.classList.contains('is-dropdown-open')) {
                document.body.classList.remove('is-dropdown-open');
            }
-        });
+        };
+        window.addEventListener('click', windowClickListener);
    }

    imagesLoaded(head, function () {
@ -75,6 +77,7 @@

    window.addEventListener('resize', function () {
        setTimeout(function () {
+            window.removeEventListener('click', windowClickListener);
            nav.innerHTML = navHTML;
            makeDropdown();
        }, 1);
--- a/package.json
+++ b/package.json
@ -2,7 +2,7 @@
    "name": "casper",
    "description": "A clean, minimal default theme for the Ghost publishing platform",
    "demo": "https://demo.ghost.io",
-    "version": "5.4.8",
+    "version": "5.4.12",
    "engines": {
        "ghost": ">=5.0.0"
    },
Author	SHA1	Message	Date
Sodbileg Gansukh	294b1e30e5	v5.4.12	2023-06-20 12:09:25 +08:00
Sodbileg Gansukh	aa8ca0794b	Fixed main nav background color in dark mode closes https://github.com/TryGhost/Casper/issues/942	2023-06-20 12:09:08 +08:00
Sodbileg Gansukh	ba0b3d08cc	v5.4.11	2023-05-09 13:30:12 +08:00
Sodbileg Gansukh	50d5727f77	Fixed mobile menu background in dark mode no issues - when there's no publication cover and the color scheme is in dark mode, the mobile menu had white background - this fixes the issue by adding explicit dark mode rules to the styles	2023-05-09 13:27:37 +08:00
Sodbileg Gansukh	23f7c30365	v5.4.10	2023-04-21 09:49:57 +01:00
Sodbileg Gansukh	8ff3c6fcf1	Fixed main nav to make it work with the announcement bar	2023-04-21 09:49:37 +01:00
Sodbileg Gansukh	5c7fb39df9	v5.4.9	2023-04-10 13:42:17 +08:00
Sodbileg Gansukh	4851606d9d	Rebuilt assets	2023-04-10 13:41:59 +08:00
Rob Leslie	afca9cb27e	Fix problem showing dropdown after window resize When the browser window is resized, a new click event listener is added to the window but the old one is not removed. The old one ends up preventing the newly-made dropdown from opening. Fix this by remembering the click event listener function added to the window, and remove it before making the new dropdown after a window resize.	2023-04-10 13:40:33 +08:00
Sodbileg Gansukh	b56bec2cb8	Fixed header action background color for smaller screens closes #934 - the accent color is used for the header background, so we don't need to add explicit dark mode color to the action on mobile screens	2023-04-10 13:24:11 +08:00