From d08e0d3882dda12f9e6318301c2ed4bbe3ef57dd Mon Sep 17 00:00:00 2001
From: Mechiel Lukkien <mechiel@ueber.net>
Date: Mon, 3 Feb 2025 18:28:48 +0100
Subject: [PATCH] webmail: fix dark mode

broken in v0.0.14, probably when introducing the css variables.
i had noticed this issue at the time, and thought i fixed it, but clearly not.

for issue #278, reported by gdunstone
---
 webmail/lib.ts     | 10 +++++-----
 webmail/msg.js     |  8 ++++----
 webmail/text.js    |  8 ++++----
 webmail/webmail.js |  8 ++++----
 4 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/webmail/lib.ts b/webmail/lib.ts
index 3c53252..59bd3eb 100644
--- a/webmail/lib.ts
+++ b/webmail/lib.ts
@@ -7,17 +7,17 @@
 //   Makes it easier to look through a DOM, and easier to change the style of all
 //   instances of a class.
 
-// We keep the default/regular styles and dark-mode styles in separate stylesheets.
-const cssStyle = dom.style(attr.type('text/css'))
-document.head.prepend(cssStyle)
-const styleSheet = cssStyle.sheet!
-
 const cssStyleDark = dom.style(attr.type('text/css'))
 document.head.prepend(cssStyleDark)
 const styleSheetDark = cssStyleDark.sheet!
 styleSheetDark.insertRule('@media (prefers-color-scheme: dark) {}')
 const darkModeRule = styleSheetDark.cssRules[0] as CSSMediaRule
 
+// We keep the default/regular styles and dark-mode styles in separate stylesheets.
+const cssStyle = dom.style(attr.type('text/css'))
+document.head.prepend(cssStyle)
+const styleSheet = cssStyle.sheet!
+
 let cssRules: { [selector: string]: string} = {} // For ensuring a selector has a single definition.
 // Ensure a selector has the given style properties. If a style value is an array,
 // it must have 2 elements. The first is the default value, the second used for a
diff --git a/webmail/msg.js b/webmail/msg.js
index bf888ef..44b7ffa 100644
--- a/webmail/msg.js
+++ b/webmail/msg.js
@@ -1062,15 +1062,15 @@ var api;
 // - To use class names for styling, instead of the the many inline styles.
 //   Makes it easier to look through a DOM, and easier to change the style of all
 //   instances of a class.
-// We keep the default/regular styles and dark-mode styles in separate stylesheets.
-const cssStyle = dom.style(attr.type('text/css'));
-document.head.prepend(cssStyle);
-const styleSheet = cssStyle.sheet;
 const cssStyleDark = dom.style(attr.type('text/css'));
 document.head.prepend(cssStyleDark);
 const styleSheetDark = cssStyleDark.sheet;
 styleSheetDark.insertRule('@media (prefers-color-scheme: dark) {}');
 const darkModeRule = styleSheetDark.cssRules[0];
+// We keep the default/regular styles and dark-mode styles in separate stylesheets.
+const cssStyle = dom.style(attr.type('text/css'));
+document.head.prepend(cssStyle);
+const styleSheet = cssStyle.sheet;
 let cssRules = {}; // For ensuring a selector has a single definition.
 // Ensure a selector has the given style properties. If a style value is an array,
 // it must have 2 elements. The first is the default value, the second used for a
diff --git a/webmail/text.js b/webmail/text.js
index e4d7225..82f0d25 100644
--- a/webmail/text.js
+++ b/webmail/text.js
@@ -1062,15 +1062,15 @@ var api;
 // - To use class names for styling, instead of the the many inline styles.
 //   Makes it easier to look through a DOM, and easier to change the style of all
 //   instances of a class.
-// We keep the default/regular styles and dark-mode styles in separate stylesheets.
-const cssStyle = dom.style(attr.type('text/css'));
-document.head.prepend(cssStyle);
-const styleSheet = cssStyle.sheet;
 const cssStyleDark = dom.style(attr.type('text/css'));
 document.head.prepend(cssStyleDark);
 const styleSheetDark = cssStyleDark.sheet;
 styleSheetDark.insertRule('@media (prefers-color-scheme: dark) {}');
 const darkModeRule = styleSheetDark.cssRules[0];
+// We keep the default/regular styles and dark-mode styles in separate stylesheets.
+const cssStyle = dom.style(attr.type('text/css'));
+document.head.prepend(cssStyle);
+const styleSheet = cssStyle.sheet;
 let cssRules = {}; // For ensuring a selector has a single definition.
 // Ensure a selector has the given style properties. If a style value is an array,
 // it must have 2 elements. The first is the default value, the second used for a
diff --git a/webmail/webmail.js b/webmail/webmail.js
index 7b6fff8..7fd2866 100644
--- a/webmail/webmail.js
+++ b/webmail/webmail.js
@@ -1062,15 +1062,15 @@ var api;
 // - To use class names for styling, instead of the the many inline styles.
 //   Makes it easier to look through a DOM, and easier to change the style of all
 //   instances of a class.
-// We keep the default/regular styles and dark-mode styles in separate stylesheets.
-const cssStyle = dom.style(attr.type('text/css'));
-document.head.prepend(cssStyle);
-const styleSheet = cssStyle.sheet;
 const cssStyleDark = dom.style(attr.type('text/css'));
 document.head.prepend(cssStyleDark);
 const styleSheetDark = cssStyleDark.sheet;
 styleSheetDark.insertRule('@media (prefers-color-scheme: dark) {}');
 const darkModeRule = styleSheetDark.cssRules[0];
+// We keep the default/regular styles and dark-mode styles in separate stylesheets.
+const cssStyle = dom.style(attr.type('text/css'));
+document.head.prepend(cssStyle);
+const styleSheet = cssStyle.sheet;
 let cssRules = {}; // For ensuring a selector has a single definition.
 // Ensure a selector has the given style properties. If a style value is an array,
 // it must have 2 elements. The first is the default value, the second used for a