From 7c0db7058c5bee1a631d0d1d98d12ef2ff9f08bb Mon Sep 17 00:00:00 2001
From: ansuz <ansuz@transitiontech.ca>
Date: Tue, 9 Feb 2021 13:03:25 +0530
Subject: [PATCH] address some dark mode edge cases in markdown

---
 .../src/less2/include/colortheme-dark.less    |  2 ++
 .../src/less2/include/colortheme.less         |  2 ++
 .../src/less2/include/markdown.less           | 31 +++++++++++++++++--
 3 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/customize.dist/src/less2/include/colortheme-dark.less b/customize.dist/src/less2/include/colortheme-dark.less
index dc9dc4ae5..9a4af39b8 100644
--- a/customize.dist/src/less2/include/colortheme-dark.less
+++ b/customize.dist/src/less2/include/colortheme-dark.less
@@ -207,6 +207,8 @@
 // Rendered Markdown
 @cp_markdown-bg: @cryptpad_color_grey_900;
 @cp_markdown-border: @cryptpad_color_grey_700;
+@cp_markdown-contrast-fg: white; // XXX
+@cp_markdown-contrast-bg: @cryptpad_color_grey; // XXX
 
 // Avatar
 @cp_avatar-bg: @cryptpad_color_grey_700;
diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less
index 72edc8753..fc252f876 100644
--- a/customize.dist/src/less2/include/colortheme.less
+++ b/customize.dist/src/less2/include/colortheme.less
@@ -206,6 +206,8 @@
 // Rendered Markdown
 @cp_markdown-bg: @cryptpad_color_lighter_grey;
 @cp_markdown-border: @cryptpad_color_grey;
+@cp_markdown-contrast-fg: @cryptpad_text_col; // XXX
+@cp_markdown-contrast-bg: transparent; // XXX
 
 // Avatar
 @cp_avatar-bg: @cryptpad_color_grey;
diff --git a/customize.dist/src/less2/include/markdown.less b/customize.dist/src/less2/include/markdown.less
index 50a2ab45e..1bc271122 100644
--- a/customize.dist/src/less2/include/markdown.less
+++ b/customize.dist/src/less2/include/markdown.less
@@ -148,6 +148,31 @@
             .tools_unselectable();
         }
     }
+
+    // XXX apply the styles below in modals-ui-elements.less
+
+    pre.mermaid[mermaid-source^="pie"] { // XXX
+        g.legend text, text.pieTitleText {
+            fill: @cp_markdown-contrast-fg;
+        }
+    }
+
+    pre.mermaid[mermaid-source^="gantt"] { // XXX
+        background-color: @cp_markdown-contrast-bg;
+        background-color: #444;
+        text.titleText {
+            fill: @cp_markdown-contrast-fg;
+        }
+    }
+
+    /* make sure markmap text shows up in dark mode */
+    pre.markmap svg { // XXX
+       color: @cp_markdown-contrast-fg;
+    }
+
+    pre.mathjax { // XXX
+        background-color: @cp_markdown-contrast-bg;
+    }
 }
 
 .markdown_preformatted-code () {
@@ -160,6 +185,7 @@
         padding-left: .25vw;
         overflow-x: auto;
         overflow-y: hidden;
+        background-color: @cp_markdown-contrast-bg; // XXX
     }
 }
 
@@ -168,11 +194,10 @@
         border-collapse: collapse;
         tr {
             th {
-                border: 1px solid @cryptpad_color_black;
                 padding: 15px;
             }
-            td {
-                border: 1px solid @cryptpad_color_black;
+            th, td {
+                border: 1px solid @cp_markdown-border; // XXX
             }
         }
     }