css: Add new app variable css for rendered markdown tables.

Add a css rule in app_variable.css to be used in rendered_markdown.css specifically for table borders. This change makes it easier to manage style of tables in messages / chat. Fixes zulip#29856.
PieterCK · Apr 30, 2024 · f33acad · f33acad
1 parent 2457a8b
commit f33acad
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/web/styles/app_variables.css b/web/styles/app_variables.css
@@ -489,6 +489,9 @@
     --color-background-emoji-picker-emoji-reacted: hsl(195deg 50% 95%);
     --color-border-emoji-picker-emoji-reacted: hsl(195deg 52% 79%);
     --color-background-emoji-picker-emoji-reacted-focus: hsl(195deg 55% 88%);
+
+    /* Rendered markdown table color */
+    --border-rendered-markdown-tr-th-td: 1px solid hsl(0deg 0% 80%);
 }
 
 %dark-theme {

diff --git a/web/styles/rendered_markdown.css b/web/styles/rendered_markdown.css
@@ -126,13 +126,13 @@
     }
 
     & tr th {
-        border: 1px solid hsl(0deg 0% 80%);
+        border: var(--border-rendered-markdown-tr-th-td);
         padding: 4px;
         text-align: left;
     }
 
     & tr td {
-        border: 1px solid hsl(0deg 0% 80%);
+        border: var(--border-rendered-markdown-tr-th-td);
         padding: 4px;
     }