From 6709ec3836c56cf697fe408987ecb2c9c7f9540c Mon Sep 17 00:00:00 2001 From: Samreen0192 Date: Fri, 22 May 2026 10:15:08 +0100 Subject: [PATCH 1/6] Added T-shirt order form project --- Form-Controls/index.html | 145 ++++++++++++++++++++++++++++++++------- 1 file changed, 121 insertions(+), 24 deletions(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 74b591ffc..fcff4c762 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -1,27 +1,124 @@ - - - - My form exercise - - - - -
-

Product Pick

-
-
-
- - -
-
- - + + + + T-Shirt Order Form + + + + + + +
+

T-Shirt Order Form

+ +
+ + + +
+ +
+ + + +
+ +
+ + + +
+ +
+ + + +
+ + + +
+ + From 8f01d67fdb361ec54ae95546d1734ba6f3d04236 Mon Sep 17 00:00:00 2001 From: Samreen0192 Date: Mon, 25 May 2026 11:00:15 +0100 Subject: [PATCH 2/6] improved --- Form-Controls/index.html | 173 ++++++++++++++------------------------- Form-Controls/style.css | 59 +++++++++++++ 2 files changed, 121 insertions(+), 111 deletions(-) create mode 100644 Form-Controls/style.css diff --git a/Form-Controls/index.html b/Form-Controls/index.html index fcff4c762..fcf379199 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -3,122 +3,73 @@ + T-Shirt Order Form - + -
-

T-Shirt Order Form

- -
- - - -
- -
- - - -
- -
- - - -
- -
- - - -
- - - -
+
+ +
+

T-Shirt Order Form

+ +
+ + + +
+ +
+ + + +
+ +
+ + + +
+ +
+ + + +
+ + + +
+ +
- + \ No newline at end of file diff --git a/Form-Controls/style.css b/Form-Controls/style.css new file mode 100644 index 000000000..bdff5c812 --- /dev/null +++ b/Form-Controls/style.css @@ -0,0 +1,59 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: Arial, sans-serif; + background-color: #f3f3f3; + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; +} + +form { + background-color: white; + padding: 30px; + border-radius: 10px; + width: 350px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); +} + +h1 { + text-align: center; + margin-bottom: 20px; +} + +.form-group { + margin-bottom: 15px; +} + +label { + display: block; + margin-bottom: 5px; + font-weight: bold; +} + +input, +select { + width: 100%; + padding: 10px; + border: 1px solid #ccc; + border-radius: 5px; +} + +button { + width: 100%; + padding: 10px; + background-color: black; + color: white; + border: none; + border-radius: 5px; + cursor: pointer; +} + +button:hover { + background-color: #333; +} \ No newline at end of file From d5600242a121986161d7ac7eff2f0e98231ace72 Mon Sep 17 00:00:00 2001 From: Samreen0192 Date: Mon, 1 Jun 2026 21:46:52 +0100 Subject: [PATCH 3/6] Complete T-shirt order form --- Form-Controls/README.md | 26 +++++++++++++------------- Form-Controls/index.html | 7 +++++-- Form-Controls/style.css | 12 ++++-------- Module-Onboarding | 1 + Wireframe/README.md | 34 +++++++++++++++++----------------- 5 files changed, 40 insertions(+), 40 deletions(-) create mode 160000 Module-Onboarding diff --git a/Form-Controls/README.md b/Form-Controls/README.md index 86f623d89..cee110a44 100644 --- a/Form-Controls/README.md +++ b/Form-Controls/README.md @@ -34,18 +34,18 @@ Do not write a form action for this project. Let's write out our testable criteria. Check each one off as you complete it. -- [ ] I have only used HTML and CSS. -- [ ] I have not used any JavaScript. +- [✓] I have only used HTML and CSS. +- [✓] I have not used any JavaScript. ### HTML -- [ ] My form is semantic HTML. -- [ ] All inputs have associated labels. -- [ ] My Lighthouse Accessibility score is 100. -- [ ] I require a valid name. -- [ ] I require a valid email. -- [ ] I require one colour from a defined set of 3 colours. -- [ ] I require one size from a defined set of 6 sizes. +- [✓] My form is semantic HTML. +- [✓] All inputs have associated labels. +- [✓] My Lighthouse Accessibility score is 100. +- [✓] I require a valid name. +- [✓] I require a valid email. +- [✓] I require one colour from a defined set of 3 colours. +- [✓] I require one size from a defined set of 6 sizes. ### Developers must adhere to professional standards. @@ -54,10 +54,10 @@ Let's write out our testable criteria. Check each one off as you complete it. These practices reflect the level of quality expected in professional work. They ensure your code is reliable, maintainable, and presents a polished, credible experience to users. -- [ ] My HTML code has no errors or warnings when validated using https://validator.w3.org/ -- [ ] My code is consistently formatted -- [ ] My page content is free of typos and grammatical mistakes -- [ ] I commit often and push regularly to GitHub +- [✓] My HTML code has no errors or warnings when validated using https://validator.w3.org/ +- [✓] My code is consistently formatted +- [✓] My page content is free of typos and grammatical mistakes +- [✓] I commit often and push regularly to GitHub ## Resources - [MDN: Form controls](https://developer.mozilla.org/en-US/docs/Learn/Forms) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index fcf379199..f597aa52e 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -6,13 +6,17 @@ T-Shirt Order Form + +
-

T-Shirt Order Form

@@ -68,7 +72,6 @@

T-Shirt Order Form

-
diff --git a/Form-Controls/style.css b/Form-Controls/style.css index bdff5c812..9c4824202 100644 --- a/Form-Controls/style.css +++ b/Form-Controls/style.css @@ -1,16 +1,16 @@ * { + box-sizing: border-box; margin: 0; padding: 0; - box-sizing: border-box; } body { font-family: Arial, sans-serif; - background-color: #f3f3f3; + background-color: #f4f4f4; + min-height: 100vh; display: flex; justify-content: center; align-items: center; - min-height: 100vh; } form { @@ -18,7 +18,6 @@ form { padding: 30px; border-radius: 10px; width: 350px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); } h1 { @@ -40,17 +39,14 @@ input, select { width: 100%; padding: 10px; - border: 1px solid #ccc; - border-radius: 5px; } button { width: 100%; padding: 10px; + border: none; background-color: black; color: white; - border: none; - border-radius: 5px; cursor: pointer; } diff --git a/Module-Onboarding b/Module-Onboarding new file mode 160000 index 000000000..c44123d68 --- /dev/null +++ b/Module-Onboarding @@ -0,0 +1 @@ +Subproject commit c44123d682bd435b63f5494103678de8fb6bb371 diff --git a/Wireframe/README.md b/Wireframe/README.md index aa85ec80b..68b842a44 100644 --- a/Wireframe/README.md +++ b/Wireframe/README.md @@ -4,12 +4,12 @@ -- [ ] Use semantic HTML tags to structure the webpage -- [ ] Create three articles, each including an image, title, summary, and a link -- [ ] Check a webpage against a wireframe layout -- [ ] Test web code using [Lighthouse](https://programming.codeyourfuture.io/guides/testing/lighthouse) -- [ ] Use version control by committing often and pushing regularly to GitHub -- [ ] Develop the habit of writing clean, well-structured, and error-free code +- [✓] Use semantic HTML tags to structure the webpage +- [✓] Create three articles, each including an image, title, summary, and a link +- [✓] Check a webpage against a wireframe layout +- [✓] Test web code using [Lighthouse](https://programming.codeyourfuture.io/guides/testing/lighthouse) +- [✓] Use version control by committing often and pushing regularly to GitHub +- [✓] Develop the habit of writing clean, well-structured, and error-free code ## Task @@ -27,13 +27,13 @@ There are some provided HTML and CSS files you can use to get started. You can u ## Acceptance Criteria -- [ ] Semantic HTML tags are used to structure the webpage. -- [ ] The page scores 100 for Accessibility in the Lighthouse audit. -- [ ] The webpage is styled using a linked .css file. -- [ ] The webpage is properly committed and pushed to a branch on GitHub. -- [ ] The articles section contains three distinct articles, each with its own unique image, title, summary, and link. -- [ ] The page footer is fixed to the bottom of the viewport. -- [ ] The page layout closely match the wireframe. +- [✓] Semantic HTML tags are used to structure the webpage. +- [✓] The page scores 100 for Accessibility in the Lighthouse audit. +- [✓] The webpage is styled using a linked .css file. +- [✓] The webpage is properly committed and pushed to a branch on GitHub. +- [✓] The articles section contains three distinct articles, each with its own unique image, title, summary, and link. +- [✓] The page footer is fixed to the bottom of the viewport. +- [✓] The page layout closely match the wireframe. ### Developers must adhere to professional standards. @@ -42,10 +42,10 @@ There are some provided HTML and CSS files you can use to get started. You can u These practices reflect the level of quality expected in professional work. They ensure your code is reliable, maintainable, and presents a polished, credible experience to users. -- [ ] My HTML code has no errors or warnings when validated using https://validator.w3.org/ -- [ ] My code is consistently formatted -- [ ] My page content is free of typos and grammatical mistakes -- [ ] I commit often and push regularly to GitHub +- [✓] My HTML code has no errors or warnings when validated using https://validator.w3.org/ +- [✓] My code is consistently formatted +- [✓] My page content is free of typos and grammatical mistakes +- [✓] I commit often and push regularly to GitHub ## Resources From d261537c6f405cd0d708f307cfd1a8c486ecae4f Mon Sep 17 00:00:00 2001 From: Samreen0192 Date: Mon, 1 Jun 2026 21:56:53 +0100 Subject: [PATCH 4/6] Fix HTML structure and separate CSS properly --- Form-Controls/index.html | 4 ---- 1 file changed, 4 deletions(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index f597aa52e..719700335 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -22,7 +22,6 @@

T-Shirt Order Form

- T-Shirt Order Form
- T-Shirt Order Form
- From c2fc5e4d016c7f0dcb66ada3e0b6f294a61a6100 Mon Sep 17 00:00:00 2001 From: Samreen0192 Date: Mon, 1 Jun 2026 22:03:25 +0100 Subject: [PATCH 5/6] Remove nested repo causing Netlify submodule error --- Module-Onboarding | 1 - 1 file changed, 1 deletion(-) delete mode 160000 Module-Onboarding diff --git a/Module-Onboarding b/Module-Onboarding deleted file mode 160000 index c44123d68..000000000 --- a/Module-Onboarding +++ /dev/null @@ -1 +0,0 @@ -Subproject commit c44123d682bd435b63f5494103678de8fb6bb371 From 82e9a1d1273be8f9be24881c3ab5fb2894fc8728 Mon Sep 17 00:00:00 2001 From: Samreen0192 Date: Mon, 1 Jun 2026 22:07:04 +0100 Subject: [PATCH 6/6] Improve SEO and fix HTML structure --- Form-Controls/index.html | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 719700335..0230c44ef 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -6,10 +6,8 @@ T-Shirt Order Form - + +