Made SquaresDark theme really dark.

Due to that, e-mails with incorrect background/color settings are unreadable.
So a new feature in the settings is there to remove colors from messages.
Not perfect yet, but it works.

dev/Settings/User/General.js

@@ -39,6 +39,7 @@ export class GeneralUserSettings {
 		this.isDesktopNotificationDenied = NotificationStore.isDesktopNotificationDenied;
 
 		this.showImages = SettingsStore.showImages;
+		this.removeColors = SettingsStore.removeColors;
 		this.useCheckboxesInList = SettingsStore.useCheckboxesInList;
 		this.threadsAllowed = AppStore.threadsAllowed;
 		this.useThreads = SettingsStore.useThreads;
@@ -125,6 +126,7 @@ export class GeneralUserSettings {
 			this.editorDefaultType.subscribe(Remote.saveSettingsHelper('EditorDefaultType', null, f0));
 			this.messagesPerPage.subscribe(Remote.saveSettingsHelper('MPP', null, f1));
 			this.showImages.subscribe(Remote.saveSettingsHelper('ShowImages', v=>v?'1':'0'));
+			this.removeColors.subscribe(Remote.saveSettingsHelper('RemoveColors', v=>v?'1':'0'));
 
 			this.useCheckboxesInList.subscribe(Remote.saveSettingsHelper('UseCheckboxesInList', v=>v?'1':'0'));
 

dev/Stores/User/Message.js

@@ -47,7 +47,24 @@ const
 	findEmailAndLinks = html => html
 		.replace(url, '$1<a href="$2" target="_blank">$2</a>')
 		.replace(email, '$1<a href="mailto:$2">$2</a>'),
-	isChecked = item => item.checked();
+	isChecked = item => item.checked(),
+
+	// Removes background and color
+	// Many e-mails incorrectly only define one, not both
+	// And in dark theme mode this kills the readability
+	removeColors = html => {
+		let l;
+		do {
+			l = html.length;
+			html = html
+				.replace(/(<[^>]+);?background(-color)?\s*:[^;"']+/gi, '$1')
+				.replace(/(<[^>]+[^-]);?color\s*:[^;"']+/gi, '$1')
+				.replace(/(<[^>]+[^-])\sbgcolor="[^"]+"/gi, '$1')
+				.replace(/(<[^>]+[^-])\scolor="[^"]+"/gi, '$1');
+			//.replace(/<\/?font[^>]+>/gmi, '')
+		} while (l != html.length)
+		return html;
+	};
 
 doc.body.append(hcont);
 
@@ -499,12 +516,13 @@ class MessageUserStore {
 						message.fetchDataFromDom();
 						messagesDom.append(textBody);
 					} else {
-						let isHtml = false;
-						if (json.Html) {
-							isHtml = true;
+						let isHtml = !!json.Html;
+						if (isHtml) {
 							resultHtml = json.Html.toString();
+							if (SettingsStore.removeColors()) {
+								resultHtml = removeColors(resultHtml);
+							}
 						} else if (json.Plain) {
-							isHtml = false;
 							resultHtml = plainToHtml(json.Plain.toString());
 
 							if ((message.isPgpSigned() || message.isPgpEncrypted()) && PgpStore.capaOpenPGP()) {
@@ -534,7 +552,6 @@ class MessageUserStore {
 								resultHtml = '<pre>' + resultHtml + '</pre>';
 							}
 						} else {
-							isHtml = false;
 							resultHtml = '<pre>' + resultHtml + '</pre>';
 						}
 
@@ -552,7 +569,7 @@ class MessageUserStore {
 
 						message.body = body;
 
-						message.isHtml(!!isHtml);
+						message.isHtml(isHtml);
 						message.hasImages(!!json.HasExternals);
 
 						messagesDom.append(body);

dev/Stores/User/Settings.js

@@ -27,6 +27,7 @@ class SettingsUserStore {
 
 		ko.addObservablesTo(this, {
 			showImages: false,
+			removeColors: false,
 			useCheckboxesInList: true,
 			allowDraftAutosave: true,
 			useThreads: false,
@@ -58,6 +59,7 @@ class SettingsUserStore {
 		this.messagesPerPage(settingsGet('MPP'));
 
 		this.showImages(!!settingsGet('ShowImages'));
+		this.removeColors(!!settingsGet('RemoveColors'));
 		this.useCheckboxesInList(!!(ThemeStore.isMobile() || settingsGet('UseCheckboxesInList')));
 		this.allowDraftAutosave(!!settingsGet('AllowDraftAutosave'));
 		this.useThreads(!!settingsGet('UseThreads'));

dev/Styles/MessageList.less

@@ -307,7 +307,6 @@ html.rl-no-preview-pane {
 			}
 
 			.subjectParent {
-				color: #000;
 				overflow: hidden;
 				text-overflow: ellipsis;
 				white-space: nowrap;
@@ -316,7 +315,7 @@ html.rl-no-preview-pane {
 			.subjectParent .emptySubjectText {
 				display: none;
 				font-style: italic;
-				color: #999;
+				opacity: 0.5;
 			}
 
 			&.emptySubject .subjectParent {

dev/Styles/MessageView.less

@@ -206,6 +206,7 @@
 
 		.messageItem {
 
+			color: #000;
 			position: absolute;
 			top: 0;
 			bottom: 0;
@@ -347,8 +348,6 @@
 
 			.bodyText {
 
-				color: #000;
-
 				.b-text-part {
 
 					height: 100%;

dev/Styles/Ui.less

@@ -70,20 +70,23 @@
 	.e-page {
 
 		display: inline-block;
-		color: #999;
+		opacity: 0.5;
 		text-decoration: none;
 		font-size: 22px;
 		padding: 3px;
 		cursor: pointer;
 
-		&:hover .e-page-number {
-			color: #555;
+		&:hover {
+			opacity: 0.8;
+		}
+
+		&.current {
+			opacity: 1;
 		}
 
 		&.current .e-page-number {
-			font-size: 25px;
-			color: #333;
-			border-bottom: 2px solid #000;
+			font-size: 115%;
+			text-decoration: underline;
 		}
 	}
 }

dev/View/User/MailBox/MessageView.js

@@ -300,8 +300,7 @@ class MessageViewMailBoxUserView extends AbstractViewRight {
 
 	detectDomBackgroundColor(dom) {
 		let color = '';
-
-		if (dom) {
+		if (dom && !SettingsStore.removeColors()) {
 			let limit = 5,
 				aC = dom;
 			while (!color && aC && limit--) {
@@ -317,7 +316,6 @@ class MessageViewMailBoxUserView extends AbstractViewRight {
 
 			color = isTransparent(color) ? '' : color;
 		}
-
 		return color;
 	}