Implement #120v5.4.0-beta.1

1 files changed, 10 insertions, 0 deletions

diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
index b01368f69..a826479ad 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',
   },
+  accentColorInfo: {
+    id: 'settings.app.accentColorInfo',
+    defaultMessage: '!!!Write your accent color in a CSS-compatible format. (Default: #7367f0)',
+  },
   headlineAdvanced: {
     id: 'settings.app.headlineAdvanced',
     defaultMessage: '!!!Advanced',
@@ -373,6 +377,12 @@ export default @observer class EditSettingsForm extends Component {
             <Toggle field={form.$('showDisabledServices')} />
             <Toggle field={form.$('showMessageBadgeWhenMuted')} />
             <Toggle field={form.$('darkMode')} />
+            <Input
+              placeholder="Accent Color"
+              onChange={e => this.submit(e)}
+              field={form.$('accentColor')}
+            />
+            <p>{intl.formatMessage(messages.accentColorInfo)}</p>
 
             {/* Language */}
             <h2 id="language">{intl.formatMessage(messages.headlineLanguage)}</h2>