Merge pull request #26 from iMattPro/tweaks

Improve color picker coding
phpbb-extensions · Jan 13, 2025 · 190a9fc · 190a9fc
2 parents 1d53559 + 726ad77
commit 190a9fc
Showing 2 changed files with 8 additions and 11 deletions.
diff --git a/adm/style/acp_pwakit.html b/adm/style/acp_pwakit.html
@@ -51,9 +51,9 @@ <h3>{{ lang('WARNING') }}</h3>
 	<fieldset>
 		<legend>{{ lang('ACP_PWA_KIT_LEGEND_ICONS') }}</legend>
 		<dl>
-			<dt><label for="pwa_upload">{{ lang('ACP_PWA_IMG_UPLOAD') ~ lang('COLON') }}</label><br /><span>{{ lang('ACP_PWA_IMG_UPLOAD_EXPLAIN', PWA_IMAGES_DIR) }}</span></dt>
+			<dt><label for="pwa_upload">{{ lang('ACP_PWA_IMG_UPLOAD') ~ lang('COLON') }}</label><br><span>{{ lang('ACP_PWA_IMG_UPLOAD_EXPLAIN', PWA_IMAGES_DIR) }}</span></dt>
 			<dd>
-				<input type="file" accept="image/*" class="inputbox autowidth" id="pwa_upload" name="pwa_upload" />
+				<input type="file" accept="image/*" class="inputbox autowidth" id="pwa_upload" name="pwa_upload">
 				<button class="button2 pwakit-button" id="upload" name="upload" value="{{ lang('ACP_PWA_IMG_UPLOAD_BTN') }}">{{ Icon('font', 'upload', lang('ACP_PWA_IMG_UPLOAD_BTN')) }}</button>
 				<button class="button2 pwakit-button" id="resync" name="resync" value="{{ lang('ACP_PWA_IMG_RESYNC_BTN') }}">{{ Icon('font', 'sync', lang('ACP_PWA_IMG_RESYNC_BTN')) }}</button>
 			</dd>

diff --git a/styles/all/template/acp.js b/styles/all/template/acp.js
@@ -2,11 +2,12 @@ document.addEventListener('DOMContentLoaded', () => {
 	const DEFAULT_COLOR = '#000000';
 	const HEX_REGEX = /^#([A-Fa-f0-9]{6})$/;
 
-	const setupColorField = (textId, pickerId) => {
-		const colorText = document.getElementById(textId);
-		const colorPicker = document.getElementById(pickerId);
+	const colorPickers = document.querySelectorAll('input[type="color"]');
 
-		if (!colorText || !colorPicker) {
+	colorPickers.forEach(colorPicker => {
+		const colorText = colorPicker.previousElementSibling;
+
+		if (!colorText || colorText.type !== 'text') {
 			return;
 		}
 
@@ -32,9 +33,5 @@ document.addEventListener('DOMContentLoaded', () => {
 		});
 
 		syncColors(colorText, colorPicker);
-	};
-
-	['theme', 'bg'].forEach(type =>
-		setupColorField(`pwa_${type}_color`, `pwa_${type}_color_picker`)
-	);
+	});
 });