Add toggle to disable universal dark mode

10 files changed, 197 insertions, 94 deletions

diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
index a826479ad..2be5c4ed7 100644
--- a/src/components/settings/settings/EditSettingsForm.js
+++ b/src/components/settings/settings/EditSettingsForm.js
@@ -79,6 +79,10 @@ const messages = defineMessages({
     id: 'settings.app.headlineAppearance',
     defaultMessage: '!!!Appearance',
   },
+  universalDarkModeInfo: {
+    id: 'settings.app.universalDarkModeInfo',
+    defaultMessage: '!!!Universal Dark Mode tries to dynamically generate dark mode styles for services that are otherwise not currently supported.',
+  },
   accentColorInfo: {
     id: 'settings.app.accentColorInfo',
     defaultMessage: '!!!Write your accent color in a CSS-compatible format. (Default: #7367f0)',
@@ -156,6 +160,7 @@ export default @observer class EditSettingsForm extends Component {
     server: PropTypes.string.isRequired,
     noUpdates: PropTypes.bool.isRequired,
     hibernationEnabled: PropTypes.bool.isRequired,
+    isDarkmodeEnabled: PropTypes.bool.isRequired,
     openProcessManager: PropTypes.func.isRequired,
   };
 
@@ -192,6 +197,7 @@ export default @observer class EditSettingsForm extends Component {
       server,
       noUpdates,
       hibernationEnabled,
+      isDarkmodeEnabled,
       openProcessManager,
     } = this.props;
     const { intl } = this.context;
@@ -377,6 +383,22 @@ export default @observer class EditSettingsForm extends Component {
             <Toggle field={form.$('showDisabledServices')} />
             <Toggle field={form.$('showMessageBadgeWhenMuted')} />
             <Toggle field={form.$('darkMode')} />
+            {isDarkmodeEnabled && (
+              <>
+                <Toggle field={form.$('universalDarkMode')} />
+                <p
+                  className="settings__message"
+                  style={{
+                    borderTop: 0, marginTop: 0, paddingTop: 0, marginBottom: '2rem',
+                  }}
+                >
+                  <span>
+                    { intl.formatMessage(messages.universalDarkModeInfo) }
+                  </span>
+                </p>
+              </>
+            )}
+
             <Input
               placeholder="Accent Color"
               onChange={e => this.submit(e)}
diff --git a/src/config.js b/src/config.js
index d9ef67530..ae07ab0de 100644
--- a/src/config.js
+++ b/src/config.js
@@ -76,6 +76,7 @@ export const DEFAULT_APP_SETTINGS = {
   hibernationStrategy: 300,
   noUpdates: false,
   showServiceNavigationBar: false,
+  universalDarkMode: true,
   accentColor: '#7367f0',
 };
 
diff --git a/src/containers/settings/EditSettingsScreen.js b/src/containers/settings/EditSettingsScreen.js
index 7b0633f79..e5dd2d4fc 100644
--- a/src/containers/settings/EditSettingsScreen.js
+++ b/src/containers/settings/EditSettingsScreen.js
@@ -98,6 +98,10 @@ const messages = defineMessages({
     id: 'settings.app.form.darkMode',
     defaultMessage: '!!!Dark Mode',
   },
+  universalDarkMode: {
+    id: 'settings.app.form.universalDarkMode',
+    defaultMessage: '!!!Enable universal Dark Mode',
+  },
   accentColor: {
     id: 'settings.app.form.accentColor',
     defaultMessage: '!!!Accent color',
@@ -176,6 +180,7 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
         enableGPUAcceleration: settingsData.enableGPUAcceleration,
         showDisabledServices: settingsData.showDisabledServices,
         darkMode: settingsData.darkMode,
+        universalDarkMode: settingsData.universalDarkMode,
         accentColor: settingsData.accentColor,
         showMessageBadgeWhenMuted: settingsData.showMessageBadgeWhenMuted,
         enableSpellchecking: settingsData.enableSpellchecking,
@@ -345,6 +350,11 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
           value: settings.all.app.darkMode,
           default: DEFAULT_APP_SETTINGS.darkMode,
         },
+        universalDarkMode: {
+          label: intl.formatMessage(messages.universalDarkMode),
+          value: settings.all.app.universalDarkMode,
+          default: DEFAULT_APP_SETTINGS.universalDarkMode,
+        },
         accentColor: {
           label: intl.formatMessage(messages.accentColor),
           value: settings.all.app.accentColor,
@@ -435,6 +445,7 @@ export default @inject('stores', 'actions') @observer class EditSettingsScreen e
           lockingFeatureEnabled={lockingFeatureEnabled}
           noUpdates={this.props.stores.settings.app.noUpdates}
           hibernationEnabled={this.props.stores.settings.app.hibernate}
+          isDarkmodeEnabled={this.props.stores.settings.app.darkMode}
           openProcessManager={() => this.openProcessManager()}
         />
       </ErrorBoundary>
diff --git a/src/i18n/locales/defaultMessages.json b/src/i18n/locales/defaultMessages.json
index f9afe6213..6f380af3b 100644
--- a/src/i18n/locales/defaultMessages.json
+++ b/src/i18n/locales/defaultMessages.json
@@ -2657,185 +2657,198 @@
         }
       },
       {
-        "defaultMessage": "!!!Write your accent color in a CSS-compatible format. (Default: #7367f0)",
+        "defaultMessage": "!!!Universal Dark Mode tries to dynamically generate dark mode styles for services that are otherwise not currently supported.",
         "end": {
           "column": 3,
           "line": 85
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
+        "id": "settings.app.universalDarkModeInfo",
+        "start": {
+          "column": 25,
+          "line": 82
+        }
+      },
+      {
+        "defaultMessage": "!!!Write your accent color in a CSS-compatible format. (Default: #7367f0)",
+        "end": {
+          "column": 3,
+          "line": 89
+        },
+        "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.accentColorInfo",
         "start": {
           "column": 19,
-          "line": 82
+          "line": 86
         }
       },
       {
         "defaultMessage": "!!!Advanced",
         "end": {
           "column": 3,
-          "line": 89
+          "line": 93
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.headlineAdvanced",
         "start": {
           "column": 20,
-          "line": 86
+          "line": 90
         }
       },
       {
         "defaultMessage": "!!!Help us to translate Ferdi into your language.",
         "end": {
           "column": 3,
-          "line": 93
+          "line": 97
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.translationHelp",
         "start": {
           "column": 19,
-          "line": 90
+          "line": 94
         }
       },
       {
         "defaultMessage": "!!!Cache",
         "end": {
           "column": 3,
-          "line": 97
+          "line": 101
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.subheadlineCache",
         "start": {
           "column": 20,
-          "line": 94
+          "line": 98
         }
       },
       {
         "defaultMessage": "!!!Ferdi cache is currently using {size} of disk space.",
         "end": {
           "column": 3,
-          "line": 101
+          "line": 105
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.cacheInfo",
         "start": {
           "column": 13,
-          "line": 98
+          "line": 102
         }
       },
       {
         "defaultMessage": "!!!Clear cache",
         "end": {
           "column": 3,
-          "line": 105
+          "line": 109
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.buttonClearAllCache",
         "start": {
           "column": 23,
-          "line": 102
+          "line": 106
         }
       },
       {
         "defaultMessage": "!!!Check for updates",
         "end": {
           "column": 3,
-          "line": 109
+          "line": 113
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.buttonSearchForUpdate",
         "start": {
           "column": 25,
-          "line": 106
+          "line": 110
         }
       },
       {
         "defaultMessage": "!!!Restart & install update",
         "end": {
           "column": 3,
-          "line": 113
+          "line": 117
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.buttonInstallUpdate",
         "start": {
           "column": 23,
-          "line": 110
+          "line": 114
         }
       },
       {
         "defaultMessage": "!!!Is searching for update",
         "end": {
           "column": 3,
-          "line": 117
+          "line": 121
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.updateStatusSearching",
         "start": {
           "column": 25,
-          "line": 114
+          "line": 118
         }
       },
       {
         "defaultMessage": "!!!Update available, downloading...",
         "end": {
           "column": 3,
-          "line": 121
+          "line": 125
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.updateStatusAvailable",
         "start": {
           "column": 25,
-          "line": 118
+          "line": 122
         }
       },
       {
         "defaultMessage": "!!!You are using the latest version of Ferdi",
         "end": {
           "column": 3,
-          "line": 125
+          "line": 129
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.updateStatusUpToDate",
         "start": {
           "column": 24,
-          "line": 122
+          "line": 126
         }
       },
       {
         "defaultMessage": "!!!Current version:",
         "end": {
           "column": 3,
-          "line": 129
+          "line": 133
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.currentVersion",
         "start": {
           "column": 18,
-          "line": 126
+          "line": 130
         }
       },
       {
         "defaultMessage": "!!!Changes require restart",
         "end": {
           "column": 3,
-          "line": 133
+          "line": 137
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.restartRequired",
         "start": {
           "column": 29,
-          "line": 130
+          "line": 134
         }
       },
       {
         "defaultMessage": "!!!Official translations are English & German. All other languages are community based translations.",
         "end": {
           "column": 3,
-          "line": 137
+          "line": 141
         },
         "file": "src/components/settings/settings/EditSettingsForm.js",
         "id": "settings.app.languageDisclaimer",
         "start": {
           "column": 22,
-          "line": 134
+          "line": 138
         }
       }
     ],
@@ -4032,120 +4045,133 @@
         }
       },
       {
-        "defaultMessage": "!!!Accent color",
+        "defaultMessage": "!!!Enable universal Dark Mode",
         "end": {
           "column": 3,
           "line": 104
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
+        "id": "settings.app.form.universalDarkMode",
+        "start": {
+          "column": 21,
+          "line": 101
+        }
+      },
+      {
+        "defaultMessage": "!!!Accent color",
+        "end": {
+          "column": 3,
+          "line": 108
+        },
+        "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.accentColor",
         "start": {
           "column": 15,
-          "line": 101
+          "line": 105
         }
       },
       {
         "defaultMessage": "!!!Display disabled services tabs",
         "end": {
           "column": 3,
-          "line": 108
+          "line": 112
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.showDisabledServices",
         "start": {
           "column": 24,
-          "line": 105
+          "line": 109
         }
       },
       {
         "defaultMessage": "!!!Show unread message badge when notifications are disabled",
         "end": {
           "column": 3,
-          "line": 112
+          "line": 116
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.showMessagesBadgesWhenMuted",
         "start": {
           "column": 29,
-          "line": 109
+          "line": 113
         }
       },
       {
         "defaultMessage": "!!!Enable spell checking",
         "end": {
           "column": 3,
-          "line": 116
+          "line": 120
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.enableSpellchecking",
         "start": {
           "column": 23,
-          "line": 113
+          "line": 117
         }
       },
       {
         "defaultMessage": "!!!Enable GPU Acceleration",
         "end": {
           "column": 3,
-          "line": 120
+          "line": 124
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.enableGPUAcceleration",
         "start": {
           "column": 25,
-          "line": 117
+          "line": 121
         }
       },
       {
         "defaultMessage": "!!!Include beta versions",
         "end": {
           "column": 3,
-          "line": 124
+          "line": 128
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.beta",
         "start": {
           "column": 8,
-          "line": 121
+          "line": 125
         }
       },
       {
         "defaultMessage": "!!!Disable updates",
         "end": {
           "column": 3,
-          "line": 128
+          "line": 132
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.noUpdates",
         "start": {
           "column": 13,
-          "line": 125
+          "line": 129
         }
       },
       {
         "defaultMessage": "!!!Enable Franz Todos",
         "end": {
           "column": 3,
-          "line": 132
+          "line": 136
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.enableTodos",
         "start": {
           "column": 15,
-          "line": 129
+          "line": 133
         }
       },
       {
         "defaultMessage": "!!!Keep all workspaces loaded",
         "end": {
           "column": 3,
-          "line": 136
+          "line": 140
         },
         "file": "src/containers/settings/EditSettingsScreen.js",
         "id": "settings.app.form.keepAllWorkspacesLoaded",
         "start": {
           "column": 27,
-          "line": 133
+          "line": 137
         }
       }
     ],
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json
index d3dabc364..e1ee6f824 100644
--- a/src/i18n/locales/en-US.json
+++ b/src/i18n/locales/en-US.json
@@ -247,6 +247,7 @@
   "settings.app.form.showMessagesBadgesWhenMuted": "Show unread message badge when notifications are disabled",
   "settings.app.form.showServiceNavigationBar": "Always show service navigation bar",
   "settings.app.form.todoServer": "Todo Server",
+  "settings.app.form.universalDarkMode": "Enable universal Dark Mode",
   "settings.app.headline": "Settings",
   "settings.app.headlineAdvanced": "Advanced",
   "settings.app.headlineAppearance": "Appearance",
@@ -266,6 +267,7 @@
   "settings.app.subheadlineCache": "Cache",
   "settings.app.todoServerInfo": "This server will be used for the \"Ferdi Todo\" feature. (default: https://app.franztodos.com)",
   "settings.app.translationHelp": "Help us to translate Ferdi into your language.",
+  "settings.app.universalDarkModeInfo": "Universal Dark Mode tries to dynamically generate dark mode styles for services that are otherwise not currently supported.",
   "settings.app.updateStatusAvailable": "Update available, downloading...",
   "settings.app.updateStatusSearching": "Is searching for update",
   "settings.app.updateStatusUpToDate": "You are using the latest version of Ferdi",
diff --git a/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json b/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json
index 16d8e7816..70c4fb87f 100644
--- a/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json
+++ b/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json
@@ -182,15 +182,28 @@
     }
   },
   {
+    "id": "settings.app.universalDarkModeInfo",
+    "defaultMessage": "!!!Universal Dark Mode tries to dynamically generate dark mode styles for services that are otherwise not currently supported.",
+    "file": "src/components/settings/settings/EditSettingsForm.js",
+    "start": {
+      "line": 82,
+      "column": 25
+    },
+    "end": {
+      "line": 85,
+      "column": 3
+    }
+  },
+  {
     "id": "settings.app.accentColorInfo",
     "defaultMessage": "!!!Write your accent color in a CSS-compatible format. (Default: #7367f0)",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 82,
+      "line": 86,
       "column": 19
     },
     "end": {
-      "line": 85,
+      "line": 89,
       "column": 3
     }
   },
@@ -199,11 +212,11 @@
     "defaultMessage": "!!!Advanced",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 86,
+      "line": 90,
       "column": 20
     },
     "end": {
-      "line": 89,
+      "line": 93,
       "column": 3
     }
   },
@@ -212,11 +225,11 @@
     "defaultMessage": "!!!Help us to translate Ferdi into your language.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 90,
+      "line": 94,
       "column": 19
     },
     "end": {
-      "line": 93,
+      "line": 97,
       "column": 3
     }
   },
@@ -225,11 +238,11 @@
     "defaultMessage": "!!!Cache",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 94,
+      "line": 98,
       "column": 20
     },
     "end": {
-      "line": 97,
+      "line": 101,
       "column": 3
     }
   },
@@ -238,11 +251,11 @@
     "defaultMessage": "!!!Ferdi cache is currently using {size} of disk space.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 98,
+      "line": 102,
       "column": 13
     },
     "end": {
-      "line": 101,
+      "line": 105,
       "column": 3
     }
   },
@@ -251,11 +264,11 @@
     "defaultMessage": "!!!Clear cache",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 102,
+      "line": 106,
       "column": 23
     },
     "end": {
-      "line": 105,
+      "line": 109,
       "column": 3
     }
   },
@@ -264,11 +277,11 @@
     "defaultMessage": "!!!Check for updates",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 106,
+      "line": 110,
       "column": 25
     },
     "end": {
-      "line": 109,
+      "line": 113,
       "column": 3
     }
   },
@@ -277,11 +290,11 @@
     "defaultMessage": "!!!Restart & install update",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 110,
+      "line": 114,
       "column": 23
     },
     "end": {
-      "line": 113,
+      "line": 117,
       "column": 3
     }
   },
@@ -290,11 +303,11 @@
     "defaultMessage": "!!!Is searching for update",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 114,
+      "line": 118,
       "column": 25
     },
     "end": {
-      "line": 117,
+      "line": 121,
       "column": 3
     }
   },
@@ -303,11 +316,11 @@
     "defaultMessage": "!!!Update available, downloading...",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 118,
+      "line": 122,
       "column": 25
     },
     "end": {
-      "line": 121,
+      "line": 125,
       "column": 3
     }
   },
@@ -316,11 +329,11 @@
     "defaultMessage": "!!!You are using the latest version of Ferdi",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 122,
+      "line": 126,
       "column": 24
     },
     "end": {
-      "line": 125,
+      "line": 129,
       "column": 3
     }
   },
@@ -329,11 +342,11 @@
     "defaultMessage": "!!!Current version:",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 126,
+      "line": 130,
       "column": 18
     },
     "end": {
-      "line": 129,
+      "line": 133,
       "column": 3
     }
   },
@@ -342,11 +355,11 @@
     "defaultMessage": "!!!Changes require restart",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 130,
+      "line": 134,
       "column": 29
     },
     "end": {
-      "line": 133,
+      "line": 137,
       "column": 3
     }
   },
@@ -355,11 +368,11 @@
     "defaultMessage": "!!!Official translations are English & German. All other languages are community based translations.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 134,
+      "line": 138,
       "column": 22
     },
     "end": {
-      "line": 137,
+      "line": 141,
       "column": 3
     }
   }
diff --git a/src/i18n/messages/src/containers/settings/EditSettingsScreen.json b/src/i18n/messages/src/containers/settings/EditSettingsScreen.json
index bd5efb82e..5ec8fdba7 100644
--- a/src/i18n/messages/src/containers/settings/EditSettingsScreen.json
+++ b/src/i18n/messages/src/containers/settings/EditSettingsScreen.json
@@ -234,15 +234,28 @@
     }
   },
   {
+    "id": "settings.app.form.universalDarkMode",
+    "defaultMessage": "!!!Enable universal Dark Mode",
+    "file": "src/containers/settings/EditSettingsScreen.js",
+    "start": {
+      "line": 101,
+      "column": 21
+    },
+    "end": {
+      "line": 104,
+      "column": 3
+    }
+  },
+  {
     "id": "settings.app.form.accentColor",
     "defaultMessage": "!!!Accent color",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 101,
+      "line": 105,
       "column": 15
     },
     "end": {
-      "line": 104,
+      "line": 108,
       "column": 3
     }
   },
@@ -251,11 +264,11 @@
     "defaultMessage": "!!!Display disabled services tabs",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 105,
+      "line": 109,
       "column": 24
     },
     "end": {
-      "line": 108,
+      "line": 112,
       "column": 3
     }
   },
@@ -264,11 +277,11 @@
     "defaultMessage": "!!!Show unread message badge when notifications are disabled",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 109,
+      "line": 113,
       "column": 29
     },
     "end": {
-      "line": 112,
+      "line": 116,
       "column": 3
     }
   },
@@ -277,11 +290,11 @@
     "defaultMessage": "!!!Enable spell checking",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 113,
+      "line": 117,
       "column": 23
     },
     "end": {
-      "line": 116,
+      "line": 120,
       "column": 3
     }
   },
@@ -290,11 +303,11 @@
     "defaultMessage": "!!!Enable GPU Acceleration",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 117,
+      "line": 121,
       "column": 25
     },
     "end": {
-      "line": 120,
+      "line": 124,
       "column": 3
     }
   },
@@ -303,11 +316,11 @@
     "defaultMessage": "!!!Include beta versions",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 121,
+      "line": 125,
       "column": 8
     },
     "end": {
-      "line": 124,
+      "line": 128,
       "column": 3
     }
   },
@@ -316,11 +329,11 @@
     "defaultMessage": "!!!Disable updates",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 125,
+      "line": 129,
       "column": 13
     },
     "end": {
-      "line": 128,
+      "line": 132,
       "column": 3
     }
   },
@@ -329,11 +342,11 @@
     "defaultMessage": "!!!Enable Franz Todos",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 129,
+      "line": 133,
       "column": 15
     },
     "end": {
-      "line": 132,
+      "line": 136,
       "column": 3
     }
   },
@@ -342,11 +355,11 @@
     "defaultMessage": "!!!Keep all workspaces loaded",
     "file": "src/containers/settings/EditSettingsScreen.js",
     "start": {
-      "line": 133,
+      "line": 137,
       "column": 27
     },
     "end": {
-      "line": 136,
+      "line": 140,
       "column": 3
     }
   }
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js
index 9e952a6b1..185a6f0ae 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.js
@@ -112,6 +112,11 @@ export default class ServicesStore extends Store {
       () => this.stores.settings.app.darkMode,
       () => this._shareSettingsWithServiceProcess(),
     );
+
+    reaction(
+      () => this.stores.settings.app.universalDarkMode,
+      () => this._shareSettingsWithServiceProcess(),
+    );
   }
 
   @computed get all() {
diff --git a/src/webview/recipe.js b/src/webview/recipe.js
index 6068e6c4a..d18d16082 100644
--- a/src/webview/recipe.js
+++ b/src/webview/recipe.js
@@ -43,6 +43,8 @@ class RecipeController {
     'get-service-id': 'serviceIdEcho',
   };
 
+  universalDarkModeInjected = false;
+
   constructor() {
     this.initialize();
   }
@@ -127,11 +129,12 @@ class RecipeController {
 
       if (darkModeExists) {
         injectDarkModeStyle(this.settings.service.recipe.path);
-      } else if (!ignoreList.includes(window.location.host)) {
+      } else if (this.settings.app.universalDarkMode && !ignoreList.includes(window.location.host)) {
         // Use darkreader instead
         enableDarkMode({}, {
           css: customDarkModeCss[window.location.host] || '',
         });
+        this.universalDarkModeInjected = true;
       }
     } else {
       debug('Remove dark mode');
@@ -140,8 +143,15 @@ class RecipeController {
         removeDarkModeStyle();
       } else {
         disableDarkMode();
+        this.universalDarkModeInjected = false;
       }
     }
+
+    // Remove dark reader if (universal) dark mode was just disabled
+    if (this.universalDarkModeInjected && (!this.settings.app.darkMode || !this.settings.app.universalDarkMode)) {
+      disableDarkMode();
+      this.universalDarkModeInjected = false;
+    }
   }
 
   updateAppSettings(event, data) {
diff --git a/src/webview/spellchecker.js b/src/webview/spellchecker.js
index 27380676d..1cb449110 100644
--- a/src/webview/spellchecker.js
+++ b/src/webview/spellchecker.js
@@ -96,7 +96,7 @@ export function isEnabled() {
 
 export function disable() {
   if (isEnabled()) {
-    webFrame.setSpellCheckProvider(currentDict, true, { spellCheck: () => true });
+    webFrame.setSpellCheckProvider(currentDict, { spellCheck: () => true });
     _isEnabled = false;
     currentDict = null;
   }