From 0a57450815587d91019417bf3940bb99757a17ed Mon Sep 17 00:00:00 2001
From: Daniel van Noord <danielvannoord@me.com>
Date: Mon, 25 Jan 2021 22:39:03 +0100
Subject: [PATCH] Fix colour settings not displaying #504

---
 CookieMonster.js | 12 +++++++-----
 src/Disp.js      | 12 +++++++-----
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/CookieMonster.js b/CookieMonster.js
index bed6c54..9891323 100644
--- a/CookieMonster.js
+++ b/CookieMonster.js
@@ -3242,22 +3242,24 @@ CM.Disp.CreatePrefOption = function(config) {
 		return div;
 	}
 	else if (CM.ConfigData[config].type == "color") {
+		var div = document.createElement('div');
 		for (var i = 0; i < CM.Disp.colors.length; i++) {
-			var div = document.createElement('div');
-			div.className = 'listing';
+			var innerDiv = document.createElement('div');
+			innerDiv.className = 'listing';
 			var input = document.createElement('input');
 			input.id = CM.ConfigPrefix + 'Color' + CM.Disp.colors[i];
 			input.className = 'option';
 			input.style.width = '65px';
 			input.setAttribute('value', CM.Options.Colors[CM.Disp.colors[i]]);
-			div.appendChild(input);
+			innerDiv.appendChild(input);
 			eval('var change = function() {CM.Options.Colors[\'' + CM.Disp.colors[i] + '\'] = l(CM.ConfigPrefix + \'Color\' + \'' + CM.Disp.colors[i] + '\').value; CM.Disp.UpdateColors(); CM.Config.SaveConfig();}');
 			var jscolorpicker = new jscolor.color(input, {hash: true, caps: false, pickerZIndex: 1000000, pickerPosition: 'right', onImmediateChange: change});
 			var label = document.createElement('label');
 			label.textContent = CM.ConfigData.Colors.desc[CM.Disp.colors[i]];
-			div.appendChild(label);
-			return div;
+			innerDiv.appendChild(label);
+			div.appendChild(innerDiv)
 		}
+		return div
 	}
 	else if (CM.ConfigData[config].type == "numscale") {
 		var div = document.createElement('div');
diff --git a/src/Disp.js b/src/Disp.js
index f2f7fbd..be181a0 100644
--- a/src/Disp.js
+++ b/src/Disp.js
@@ -2061,22 +2061,24 @@ CM.Disp.CreatePrefOption = function(config) {
 		return div;
 	}
 	else if (CM.ConfigData[config].type == "color") {
+		var div = document.createElement('div');
 		for (var i = 0; i < CM.Disp.colors.length; i++) {
-			var div = document.createElement('div');
-			div.className = 'listing';
+			var innerDiv = document.createElement('div');
+			innerDiv.className = 'listing';
 			var input = document.createElement('input');
 			input.id = CM.ConfigPrefix + 'Color' + CM.Disp.colors[i];
 			input.className = 'option';
 			input.style.width = '65px';
 			input.setAttribute('value', CM.Options.Colors[CM.Disp.colors[i]]);
-			div.appendChild(input);
+			innerDiv.appendChild(input);
 			eval('var change = function() {CM.Options.Colors[\'' + CM.Disp.colors[i] + '\'] = l(CM.ConfigPrefix + \'Color\' + \'' + CM.Disp.colors[i] + '\').value; CM.Disp.UpdateColors(); CM.Config.SaveConfig();}');
 			var jscolorpicker = new jscolor.color(input, {hash: true, caps: false, pickerZIndex: 1000000, pickerPosition: 'right', onImmediateChange: change});
 			var label = document.createElement('label');
 			label.textContent = CM.ConfigData.Colors.desc[CM.Disp.colors[i]];
-			div.appendChild(label);
-			return div;
+			innerDiv.appendChild(label);
+			div.appendChild(innerDiv)
 		}
+		return div
 	}
 	else if (CM.ConfigData[config].type == "numscale") {
 		var div = document.createElement('div');