před 8 roky · 2e4076bb75
--- a/src/web/Manager.js
+++ b/src/web/Manager.js
@@ -154,6 +154,7 @@ Manager.prototype.initialiseEventListeners = function() {
 
				     this.addDynamicListener(".option-item input[type=number]", "keyup", this.options.numberChange, this.options);
			
 
				     this.addDynamicListener(".option-item input[type=number]", "change", this.options.numberChange, this.options);
			
 
				     this.addDynamicListener(".option-item select", "change", this.options.selectChange, this.options);
			
 
				+    document.getElementById("theme").addEventListener("change", this.options.themeChange.bind(this.options));
			
 
				 
			
 
				     // Misc
			
 
				     document.getElementById("alert-close").addEventListener("click", this.app.alertCloseClick.bind(this.app));
			
--- a/src/web/OptionsWaiter.js
+++ b/src/web/OptionsWaiter.js
@@ -131,4 +131,14 @@ OptionsWaiter.prototype.setWordWrap = function() {
 
				     }
			
 
				 };
			
 
				 
			
 
				+
			
 
				+/**
			
 
				+ * Changes the theme by setting the class of the <html> element.
			
 
				+ */
			
 
				+OptionsWaiter.prototype.themeChange = function (e) {
			
 
				+    var themeClass = e.target.value;
			
 
				+
			
 
				+    document.querySelector(":root").className = themeClass;
			
 
				+};
			
 
				+
			
 
				 export default OptionsWaiter;
			
--- a/src/web/html/index.html
+++ b/src/web/html/index.html
@@ -211,6 +211,13 @@
 
				                     </div>
			
 
				                     <div class="modal-body" id="options-body">
			
 
				                         <p style="font-weight: bold">Please note that these options will persist between sessions.</p>
			
 
				+                        <div class="option-item">
			
 
				+                            <select option="theme" id="theme">
			
 
				+                                <option value="classic">Classic</option>
			
 
				+                                <option value="dark">Dark</option>
			
 
				+                            </select>
			
 
				+                            <label for="theme"> Theme </label>
			
 
				+                        </div>
			
 
				                         <div class="option-item">
			
 
				                             <input type="checkbox" option="update_url" id="update_url" checked />
			
 
				                             <label for="update_url"> Update the URL when the input or recipe changes </label>
			
--- a/src/web/index.js
+++ b/src/web/index.js
@@ -46,6 +46,7 @@ var main = function() {
 
				         errorTimeout      : 4000,
			
 
				         autoBakeThreshold : 200,
			
 
				         attemptHighlight  : true,
			
 
				+        theme             : "classic",
			
 
				     };
			
 
				 
			
 
				     document.removeEventListener("DOMContentLoaded", main, false);
			
--- a/src/web/stylesheets/themes/_dark.css
+++ b/src/web/stylesheets/themes/_dark.css
@@ -14,6 +14,7 @@ popovers
 
				 toggle-string dropdowns
			
 
				 alerts
			
 
				 loading-file background
			
 
				+option text for inputs is invisible
			
 
				 */
			
 
				 
			
 
				 :root.dark {