Add option to enable/disable blur overlay

src/index.html

@@ -455,6 +455,9 @@
 					<label class="line">
 						<input type="checkbox" d-change="updateSetting" data-setting="replaceNewTab"> Replace new tab page
 					</label>
+					<label class="line">
+						<input type="checkbox" d-change="updateSetting" data-setting="useBlur"> Use blur overlay (needs restart)
+					</label>
 				</p>
 				<hr>
 

src/script.js

@@ -1588,6 +1588,11 @@ customEditorFontInput
 		$('[data-setting=editorCustomFont]').value = prefs.editorCustomFont;
 		$('[data-setting=autoSave]').checked = prefs.autoSave;
 		$('[data-setting=autoComplete]').checked = prefs.autoComplete;
+		$('[data-setting=useBlur]').checked = prefs.useBlur;
+
+		if (prefs.useBlur) {
+			document.body.classList.add('blur');
+		}
 	}
 
 	/**
@@ -2154,7 +2159,8 @@ customEditorFontInput
 				editorFont: 'FiraCode',
 				editorCustomFont: '',
 				autoSave: true,
-				autoComplete: true
+				autoComplete: true,
+				useBlur: true
 			},
 			function syncGetCallback(result) {
 				if (result.preserveLastCode && lastCode) {
@@ -2190,6 +2196,7 @@ customEditorFontInput
 				prefs.editorCustomFont = result.editorCustomFont;
 				prefs.autoSave = result.autoSave;
 				prefs.autoComplete = result.autoComplete;
+				prefs.useBlur = result.useBlur;
 
 				updateSettingsInUi();
 				scope.updateSetting();

src/style.css

@@ -117,7 +117,7 @@ select, input[type="text"], input[type="number"],  textarea {
 	will-change: -webkit-filter;
 	transition: 0.10s ease 0.2s;
 }
-.overlay-visible .main-container {
+.blur.overlay-visible .main-container {
 	transition-duration: 0.5s;
 	transition-delay: 0.4s;
 	-webkit-filter: blur(3px);