From 93e09f11dd567739a4a9e39e95c0cb3b5d1c927a Mon Sep 17 00:00:00 2001
From: Baptiste Augrain <daiyam@zokugun.org>
Date: Thu, 30 Jan 2020 19:31:31 +0100
Subject: [PATCH] fix UI theme for SplitEditor and CreateFromURL modal

---
 browser/components/MarkdownSplitEditor.styl   |  26 ++--
 .../modals/CreateMarkdownFromURLModal.styl    | 121 ++++--------------
 2 files changed, 34 insertions(+), 113 deletions(-)

diff --git a/browser/components/MarkdownSplitEditor.styl b/browser/components/MarkdownSplitEditor.styl
index d716c85f..49bd927a 100644
--- a/browser/components/MarkdownSplitEditor.styl
+++ b/browser/components/MarkdownSplitEditor.styl
@@ -16,22 +16,14 @@
     z-index 10
     cursor col-resize
 
-body[data-theme="dark"]
-  .root
-    .slider
-      border-left 1px solid $ui-dark-borderColor
+apply-theme(theme)
+  body[data-theme={theme}]
+    .root
+      .slider
+        border-left 1px solid get-theme-var(theme, 'borderColor')
 
-body[data-theme="solarized-dark"]
-  .root
-    .slider
-      border-left 1px solid $ui-solarized-dark-borderColor
+for theme in 'dark' 'dracula' 'solarized-dark'
+  apply-theme(theme)
 
-body[data-theme="monokai"]
-  .root
-    .slider
-      border-left 1px solid $ui-monokai-borderColor
-
-body[data-theme="dracula"]
-  .root
-    .slider
-      border-left 1px solid $ui-dracula-borderColor
+for theme in $themes
+  apply-theme(theme)
\ No newline at end of file
diff --git a/browser/main/modals/CreateMarkdownFromURLModal.styl b/browser/main/modals/CreateMarkdownFromURLModal.styl
index 5e59e465..8aca1505 100644
--- a/browser/main/modals/CreateMarkdownFromURLModal.styl
+++ b/browser/main/modals/CreateMarkdownFromURLModal.styl
@@ -51,110 +51,39 @@
   font-size 14px
   colorPrimaryButton()
 
-body[data-theme="dark"]
-  .root
-    modalDark()
-    width 500px
-    height 270px
-    overflow hidden
-    position relative
-
-  .header
-    background-color transparent
-    border-color $ui-dark-borderColor
-    color $ui-dark-text-color
-
-  .control-folder-label
-    color $ui-dark-text-color
-
-  .control-folder-input
-    border 1px solid $ui-input--create-folder-modal
-    color white
-
-   .description
-    color $ui-inactive-text-color
-
-  .control-confirmButton
-    colorDarkPrimaryButton()
-
-body[data-theme="solarized-dark"]
-  .root
-    modalSolarizedDark()
-    width 500px
-    height 270px
-    overflow hidden
-    position relative
-
-  .header
-    background-color transparent
-    border-color $ui-dark-borderColor
-    color $ui-solarized-dark-text-color
-
-  .control-folder-label
-    color $ui-solarized-dark-text-color
-
-  .control-folder-input
-    border 1px solid $ui-input--create-folder-modal
-    color white
-
-   .description
-    color $ui-inactive-text-color
-
-  .control-confirmButton
-    colorSolarizedDarkPrimaryButton()
-
 .error
   text-align center
   color #F44336
 
-body[data-theme="monokai"]
-  .root
-    modalMonokai()
-    width 500px
-    height 270px
-    overflow hidden
-    position relative
+apply-theme(theme)
+  body[data-theme={theme}]
+    .root
+      background-color transparent
+      width 500px
+      height 270px
+      overflow hidden
+      position relative
 
-  .header
-    background-color transparent
-    border-color $ui-dark-borderColor
-    color $ui-monokai-text-color
+    .header
+      background-color transparent
+      border-color get-theme-var(theme, 'borderColor')
+      color get-theme-var(theme, 'text-color')
 
-  .control-folder-label
-    color $ui-monokai-text-color
+    .control-folder-label
+      color get-theme-var(theme, 'text-color')
 
-  .control-folder-input
-    border 1px solid $ui-input--create-folder-modal
-    color white
+    .control-folder-input
+      border 1px solid $ui-input--create-folder-modal
+      color white
 
-   .description
-    color $ui-inactive-text-color
+    .description
+      color $ui-inactive-text-color
 
-  .control-confirmButton
-    colorMonokaiPrimaryButton()
+    .control-confirmButton
+      colorThemedPrimaryButton(theme)
 
-body[data-theme="dracula"]
-  .root
-    modalDracula()
-    width 500px
-    height 270px
-    overflow hidden
-    position relative
+for theme in 'dark' 'dracula' 'solarized-dark'
+  apply-theme(theme)
 
-  .header
-    background-color transparent
-    border-color $ui-dracula-borderColor
-    color $ui-dracula-text-color
-
-  .control-folder-label
-    color $ui-dracula-text-color
-
-  .control-folder-input
-    border 1px solid $ui-input--create-folder-modal
-    color white
-
-   .description
-    color $ui-inactive-text-color
-
-  .control-confirmButton
-    colorDraculaPrimaryButton()
+for theme in $themes
+  apply-theme(theme)
\ No newline at end of file