From 0527d28fa406b7d04fa8639a7f549a0a84012b3a Mon Sep 17 00:00:00 2001 From: Lamla Kamana Date: Wed, 9 Sep 2026 12:07:05 +0200 Subject: [PATCH 1/7] Add name field with required and pattern validation --- Form-Controls/index.html | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 74b591ffc..8cfcfcd54 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -13,15 +13,24 @@

Product Pick

- + Requirements: + - Name: required, at least 2 non-space characters + - Email: required, valid email format + - Colour: required, choose 1 of 3 options + - Size: required, choose 1 of 6 sizes + - No form action needed for this project + --> +
+ + +
+
From db804ea70c1f2b76ea31306817a7c0501d1d24b5 Mon Sep 17 00:00:00 2001 From: Lamla Kamana Date: Wed, 9 Sep 2026 12:14:24 +0200 Subject: [PATCH 2/7] Add email field with required validation --- Form-Controls/index.html | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 8cfcfcd54..f3eb3bad7 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -25,6 +25,10 @@

Product Pick

+
+ + +
From b3a57622d0252a80fc8a58af29084a3c5235436b Mon Sep 17 00:00:00 2001 From: Lamla Kamana Date: Wed, 9 Sep 2026 12:21:37 +0200 Subject: [PATCH 3/7] Add clour field with radio buttons --- Form-Controls/index.html | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index f3eb3bad7..248cb3125 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -29,6 +29,21 @@

Product Pick

+
+ Colour + + + + + + +
From c9f584da4a10ceb378cc62926322e499b80df55e Mon Sep 17 00:00:00 2001 From: Lamla Kamana Date: Wed, 9 Sep 2026 12:26:08 +0200 Subject: [PATCH 4/7] Add with dropdown validation --- Form-Controls/index.html | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 248cb3125..801c58e27 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -44,6 +44,18 @@

Product Pick

Red +
+ + +
From 612d7a1477ee185cf24f853412a463d423ad34bf Mon Sep 17 00:00:00 2001 From: Lamla Kamana Date: Wed, 9 Sep 2026 20:54:13 +0200 Subject: [PATCH 5/7] Fix doctype and improve touch target sizing --- Form-Controls/index.html | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 801c58e27..1a11ccc5e 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -1,6 +1,24 @@ + My form exercise From ba0cad350002b702d48b44635201dd962ca8ec17 Mon Sep 17 00:00:00 2001 From: Lamla Kamana Date: Wed, 16 Sep 2026 13:10:28 +0200 Subject: [PATCH 6/7] Move CSS to external stylesheet per review feedback --- Form-Controls/index.html | 19 +------------------ Form-Controls/style.css | 16 ++++++++++++++++ 2 files changed, 17 insertions(+), 18 deletions(-) create mode 100644 Form-Controls/style.css diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 1a11ccc5e..b151890ec 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -1,29 +1,12 @@ - My form exercise +
diff --git a/Form-Controls/style.css b/Form-Controls/style.css new file mode 100644 index 000000000..bbfbc9b3c --- /dev/null +++ b/Form-Controls/style.css @@ -0,0 +1,16 @@ + input[type="radio"] { + width: 20px; + height: 20px; + margin: 8px; + } + + label { + display: inline-flex; + align-items: center; + padding: 6px 4px; + } + + button[type="submit"] { + padding: 10px 20px; + min-height: 44px; + } From 3bba3bac9faf95720c9467a526009ddfd701d1e6 Mon Sep 17 00:00:00 2001 From: Lamla Kamana Date: Wed, 16 Sep 2026 13:38:57 +0200 Subject: [PATCH 7/7] Fix indentation in Form-Controls/index.html --- Form-Controls/index.html | 74 +++++++++++++++++++++------------------- 1 file changed, 39 insertions(+), 35 deletions(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index b151890ec..4d9062927 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -1,4 +1,4 @@ - + @@ -6,7 +6,7 @@ My form exercise - +
@@ -22,42 +22,46 @@

Product Pick

- Size: required, choose 1 of 6 sizes - No form action needed for this project --> -
- - -
-
- - -
-
- Colour +
+ + +
+
+ + +
+
+ Colour - + - + - -
-
- - -
- + +
+
+ + +
+