From 5437bcf7217fc1c818fc18908a93dde6833e0850 Mon Sep 17 00:00:00 2001 From: Shihaam Abdul Rahman Date: Sun, 22 Mar 2026 00:13:40 +0500 Subject: [PATCH] add cc, dark theme and hide default values --- app.js | 19 ++++++++-------- index.html | 27 ++++++++++++----------- styles.css | 65 ++++++++++++++++++++++++++++++++++++++++++++---------- 3 files changed, 77 insertions(+), 34 deletions(-) diff --git a/app.js b/app.js index 36edf68..f999689 100644 --- a/app.js +++ b/app.js @@ -29,7 +29,7 @@ const toDateInput = document.getElementById('toDate'); const modelNumberInput = document.getElementById('modelNumber'); const chassisNumberInput = document.getElementById('chassisNumber'); const engineSerialInput = document.getElementById('engineSerial'); -const staticValueInput = document.getElementById('staticValue'); +const engineCapacityInput = document.getElementById('engineCapacity'); // Preview Elements const previewRegNumber = document.getElementById('previewRegNumber'); @@ -40,7 +40,7 @@ const previewToDate = document.getElementById('previewToDate'); const previewModelNumber = document.getElementById('previewModelNumber'); const previewChassisNumber = document.getElementById('previewChassisNumber'); const previewEngineSerial = document.getElementById('previewEngineSerial'); -const previewStaticValue = document.getElementById('previewStaticValue'); +const previewEngineCapacity = document.getElementById('previewEngineCapacity'); const previewGarageInfo = document.getElementById('previewGarageInfo'); const garageLogo = document.getElementById('garageLogo'); @@ -96,6 +96,7 @@ function setupEventListeners() { modelNumberInput.addEventListener('input', updatePreview); chassisNumberInput.addEventListener('input', updatePreview); engineSerialInput.addEventListener('input', updatePreview); + engineCapacityInput.addEventListener('input', updatePreview); garageSelect.addEventListener('change', updatePreview); // Auto-uppercase for certain fields @@ -125,18 +126,18 @@ function updatePreview() { const garage = garageTemplates[garageSelect.value]; // Update registration number - const regNumber = regNumberInput.value || 'A0F7930'; + const regNumber = regNumberInput.value || 'X0X0000'; previewRegNumber.textContent = formatRegNumber(regNumber); // Update dates - previewFromDate.textContent = formatDateForDisplay(fromDateInput.value) || '21-03-2026'; - previewToDate.textContent = formatDateForDisplay(toDateInput.value) || '20-03-2027'; + previewFromDate.textContent = formatDateForDisplay(fromDateInput.value) || 'DD-MM-YYYY'; + previewToDate.textContent = formatDateForDisplay(toDateInput.value) || 'DD-MM-YYYY'; // Update vehicle info - previewModelNumber.textContent = modelNumberInput.value || '55S400-010C'; - previewChassisNumber.textContent = chassisNumberInput.value || 'MH355S004DK117181'; - previewEngineSerial.textContent = engineSerialInput.value || '55S-118388'; - previewStaticValue.textContent = staticValueInput.value || '135.000'; + previewModelNumber.textContent = modelNumberInput.value || 'XXXX-XXXXX'; + previewChassisNumber.textContent = chassisNumberInput.value || 'XXXXXXXXXXXXXXXXX'; + previewEngineSerial.textContent = engineSerialInput.value || 'XXX-XXXXXX'; + previewEngineCapacity.textContent = engineCapacityInput.value || '000.000'; // Update garage info if (garage) { diff --git a/index.html b/index.html index e1610d9..6861862 100644 --- a/index.html +++ b/index.html @@ -3,6 +3,8 @@ + + Roadworthiness Sticker Generator @@ -84,12 +86,11 @@ placeholder="e.g., 55S-118388" required> - +
- - - Static value + +
@@ -111,24 +112,24 @@
- A 0 F 7 9 3 0 + X 0 X 0 0 0 0
- 1162603748 + 0000000000
- From: 21-03-2026 + From: DD-MM-YYYY
- To: 20-03-2027 + To: DD-MM-YYYY
-
55S400-010C
-
MH355S004DK117181
-
55S-118388
-
135.000
+
XXXX-XXXXX
+
XXXXXXXXXXXXXXXXX
+
XXX-XXXXXX
+
000.000