New: Added Color-Impaired mode to UI settings.

src/NzbDrone.Api/Config/UiConfigResource.cs

@@ -14,5 +14,7 @@ namespace NzbDrone.Api.Config
         public String LongDateFormat { get; set; }
         public String TimeFormat { get; set; }
         public Boolean ShowRelativeDates { get; set; }
+
+        public Boolean EnableColorImpairedMode { get; set; }
     }
 }

src/NzbDrone.Core/Configuration/ConfigService.cs

@@ -282,6 +282,13 @@ namespace NzbDrone.Core.Configuration
             set { SetValue("ShowRelativeDates", value); }
         }
 
+        public Boolean EnableColorImpairedMode
+        {
+            get { return GetValueBoolean("EnableColorImpairedMode", false); }
+
+            set { SetValue("EnableColorImpairedMode", value); }
+        }
+
         public bool CleanupMetadataImages
         {
             get { return GetValueBoolean("CleanupMetadataImages", true); }

src/NzbDrone.Core/Configuration/IConfigService.cs

@@ -55,6 +55,7 @@ namespace NzbDrone.Core.Configuration
         String LongDateFormat { get; set; }
         String TimeFormat { get; set; }
         Boolean ShowRelativeDates { get; set; }
+        Boolean EnableColorImpairedMode { get; set; }
 
         //Internal
         Boolean CleanupMetadataImages { get; set; }

src/UI/Calendar/calendar.less

@@ -3,6 +3,7 @@
 @import "../Content/Bootstrap/buttons";
 @import "../Shared/Styles/clickable";
 @import "../Content/variables";
+@import "../Content/mixins";
 @import "../Content/Overrides/bootstrap";
 
 .calendar {
@@ -147,6 +148,8 @@
   .primary {
     border-color     : @btn-primary-bg;
     background-color : @btn-primary-bg;
+
+    .color-impaired-background-gradient(90deg, @btn-primary-bg);
   }
 
   .info {
@@ -162,11 +165,15 @@
   .warning {
     border-color     : @btn-warning-bg;
     background-color : @btn-warning-bg;
+
+    .color-impaired-background-gradient(90deg, @btn-warning-bg);
   }
 
   .danger {
     border-color     : @btn-danger-bg;
     background-color : @btn-danger-bg;
+
+    .color-impaired-background-gradient(90deg, @btn-danger-bg);
   }
 
   .success {
@@ -187,11 +194,15 @@
   .premiere {
     border-color     : @droneTeal;
     background-color : @droneTeal;
+
+    .color-impaired-background-gradient(90deg, @droneTeal);
   }
 
   .unmonitored {
     border-color     : grey;
     background-color : grey;
+
+    .color-impaired-background-gradient(45deg, grey);
   }
 
   .chart {

src/UI/Content/mixins.less

@@ -8,4 +8,14 @@
   -moz-user-select    : none;
   -webkit-user-select : none;
   -ms-user-select     : none;
-}
+}
+
+.color-impaired-background-gradient(@angle, @color) {
+  .color-impaired-mode & {
+    background : repeating-linear-gradient(@angle,
+      darken(@color, 3%),
+      darken(@color, 3%) 6px,
+      @color 6px,
+      @color 12px);
+  }
+}

src/UI/Settings/UI/UiViewTemplate.hbs

@@ -94,4 +94,31 @@
             </div>
         </div>
     </fieldset>
+
+    <fieldset>
+        <legend>Style</legend>
+
+        <div class="form-group">
+            <label class="col-sm-3 control-label">Enable Color-Impaired mode</label>
+
+            <div class="col-sm-8">
+                <div class="input-group">
+                    <label class="checkbox toggle well">
+                        <input type="checkbox" name="enableColorImpairedMode" />
+
+                        <p>
+                            <span>Yes</span>
+                            <span>No</span>
+                        </p>
+
+                        <div class="btn btn-primary slide-button"/>
+                    </label>
+
+                    <span class="help-inline-checkbox">
+                        <i class="icon-sonarr-form-info" title="Altered style to allow color-impaired users to better distinguish color coded information"/>
+                    </span>
+                </div>
+            </div>
+        </div>
+    </fieldset>
 </div>

src/UI/Shared/UiSettingsController.js

@@ -0,0 +1,26 @@
+var $ = require('jquery');
+var _ = require('underscore');
+var UiSettingsModel = require('./UiSettingsModel');
+
+var Controller = {
+
+    appInitializer : function() {
+
+        UiSettingsModel.on('sync', this._updateUiSettings);
+
+        this._updateUiSettings();
+    },
+
+    _updateUiSettings: function() {
+
+        if (UiSettingsModel.get('enableColorImpairedMode')) {
+            $('body').addClass('color-impaired-mode');
+        } else {
+            $('body').removeClass('color-impaired-mode');
+        }
+    }
+};
+
+_.bindAll(Controller, 'appInitializer');
+
+module.exports = Controller;

src/UI/main.js

@@ -11,6 +11,7 @@ var ModalController = require('./Shared/Modal/ModalController');
 var ControlPanelController = require('./Shared/ControlPanel/ControlPanelController');
 var serverStatusModel = require('./System/StatusModel');
 var Tooltip = require('./Shared/Tooltip');
+var UiSettingsController = require('./Shared/UiSettingsController');
 
 require('./jQuery/ToTheTop');
 require('./Instrumentation/StringFormat');
@@ -44,6 +45,8 @@ app.addInitializer(function() {
     $('body').addClass('started');
 });
 
+app.addInitializer(UiSettingsController.appInitializer);
+
 app.addInitializer(function() {
     var footerText = serverStatusModel.get('version');
     if (serverStatusModel.get('branch') !== 'master') {