From e6fbee9f6dc65108971f75c11dedafdacb337e2f Mon Sep 17 00:00:00 2001 From: Alrzini2025 Date: Wed, 4 Feb 2026 10:26:18 +0000 Subject: [PATCH 1/7] I am doing Form by HTML --- Form-Controls/index.html | 49 +++++++++++++++++++++------------------- 1 file changed, 26 insertions(+), 23 deletions(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 65a866cdb..bb773c96a 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -1,27 +1,30 @@ - - - - My form exercise - - - - -
-

Product Pick

-
-
-
- - + -
-
- - - + + + + + + \ No newline at end of file From 39a70079d0c7c57d6bd9299b4ba863be20455353 Mon Sep 17 00:00:00 2001 From: Alrzini2025 Date: Sat, 7 Feb 2026 14:39:32 +0000 Subject: [PATCH 2/7] This is my coursework for Form Control --- Form-Controls/README.md | 14 ++++----- Form-Controls/index.html | 68 +++++++++++++++++++++++++++++++++++++--- 2 files changed, 70 insertions(+), 12 deletions(-) diff --git a/Form-Controls/README.md b/Form-Controls/README.md index bfcdf6c0b..cc7c94258 100644 --- a/Form-Controls/README.md +++ b/Form-Controls/README.md @@ -35,13 +35,13 @@ Let's write out our testable criteria. Check each one off as you complete it. ### HTML -- [ ] My form is semantic html. -- [ ] All inputs have associated labels. -- [ ] My Lighthouse Accessibility score is 100. -- [ ] I require a valid name. I have defined a valid name as a text string of two characters or more. -- [ ] 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. +- [x] My form is semantic html. +- [x] All inputs have associated labels. +- [x] My Lighthouse Accessibility score is 100. +- [x] I require a valid name. I have defined a valid name as a text string of two characters or more. +- [x] I require a valid email. +- [x] I require one colour from a defined set of 3 colours. +- [x] I require one size from a defined set of 6 sizes. ## Resources diff --git a/Form-Controls/index.html b/Form-Controls/index.html index bb773c96a..35e594dc9 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -11,14 +11,72 @@
-

Product Pick

+

T-Shirt Order

- - + +
+ Confirm Your Details + + + + + + + + +
+ + +
+ T-Shirt Colour + + + + + + +
+ + +
+ T-Shirt Size + + + +
+ +
From 40b453b3416be92f92e8e6207efdd6b13c79d5cc Mon Sep 17 00:00:00 2001 From: Alrzini2025 Date: Mon, 9 Feb 2026 17:13:19 +0000 Subject: [PATCH 3/7] chnage --- Wireframe/index.html | 97 ++++++++++++++++++++++++++++++++++++++++ Wireframe/style.css | 42 ++++++++++++++++- Wireframe/stylesheet.css | 77 +++++++++++++++++++++++++++++++ Wireframe/test1.HTML | 27 +++++++++++ 4 files changed, 242 insertions(+), 1 deletion(-) create mode 100644 Wireframe/stylesheet.css create mode 100644 Wireframe/test1.HTML diff --git a/Wireframe/index.html b/Wireframe/index.html index 0e014e535..4fe30ece1 100644 --- a/Wireframe/index.html +++ b/Wireframe/index.html @@ -1,5 +1,6 @@ +<<<<<<< Updated upstream @@ -31,3 +32,99 @@

Title

+======= + + + + + CYF sprint 1 + + + + +
+

My First Program

+ +

What is the purpose of a README file?

+
+
+ +
+
+ ReadMe +

+ The purpose of a README file is to explain what a project is and how to use it. Furthermore, it helps anyone + who + read the project understand the project quickly. +

+ +
+ +
+
+
+
+
+ +
+
+ ReadMe +

+

What is the purpose of a wireframe?

+

+ + + + + +
+
+
+
+ ReadMe +

+

What is a branch in Git?

+

+ + + + + + +
+ +
+ + + + + +>>>>>>> Stashed changes diff --git a/Wireframe/style.css b/Wireframe/style.css index be835b6c7..28717089a 100644 --- a/Wireframe/style.css +++ b/Wireframe/style.css @@ -62,7 +62,7 @@ https://developer.chrome.com/docs/devtools/css/grid https://gridbyexample.com/learn/ */ main { - display: grid; + /* display: grid; */ grid-template-columns: 1fr 1fr; gap: var(--space); > *:first-child { @@ -74,6 +74,46 @@ Setting the rules for how elements are placed in the article. Now laying out just the INSIDE of the repeated card/article design. Keeping things orderly and separate is the key to good, simple CSS. */ +<<<<<<< Updated upstream +======= +.Title { + text-align: center; + +} + +.article-boarding{ +border: 2px solid black; + border-radius: 5px; + margin: 0px 0px 0px 5px; + padding-bottom: 30px; + margin: auto; +} +.resize1{ + width: 500px; + align-content: center; + margin: auto; +} +.resize2{ + width: 500px; + height: 200px; + align-content: center; +} +.article-grid { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 20px; +} +.article-row { + display: flex; + gap: 20px; + grid-template-columns: 1fr 1fr; + height: 920px; +} + +.article-row article { + flex: 1; +} +>>>>>>> Stashed changes article { border: var(--line); padding-bottom: var(--space); diff --git a/Wireframe/stylesheet.css b/Wireframe/stylesheet.css new file mode 100644 index 000000000..55caa7fe3 --- /dev/null +++ b/Wireframe/stylesheet.css @@ -0,0 +1,77 @@ +body { + margin: 0; + font-family: Arial, sans-serif; + background: #f5f5f5; +} + +/* Centered header */ +.header { + text-align: center; + padding: 30px 10px; +} + +/* Main centered container */ +.container { + width: 90%; + max-width: 1000px; + margin: auto; +} + +/* Featured article */ +.featured { + border: 1px solid #333; + background: #fff; + margin-bottom: 30px; +} + +.featured img { + width: 100%; + height: 260px; + object-fit: cover; +} + +.content { + padding: 20px; +} + +/* Two-column section */ +.grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 25px; + margin-bottom: 40px; +} + +.card { + border: 1px solid #333; + background: #fff; +} + +.card img { + width: 100%; + height: 200px; + object-fit: cover; +} + +/* Button */ +button { + padding: 8px 14px; + border: 1px solid black; + background: white; + cursor: pointer; +} + +/* Footer */ +.footer { + text-align: center; + padding: 20px; + border-top: 1px solid #333; + background: #eee; +} + +/* Responsive */ +@media (max-width: 768px) { + .grid { + grid-template-columns: 1fr; + } +} \ No newline at end of file diff --git a/Wireframe/test1.HTML b/Wireframe/test1.HTML new file mode 100644 index 000000000..4d3ff2dbe --- /dev/null +++ b/Wireframe/test1.HTML @@ -0,0 +1,27 @@ + + + + + + Centralized Layout + + + + + + +
+

+

+
+ + +
+ + +
+ + + + + From 02a11d96ca8af2c7d0326d82804ba0f3d6d7a1c6 Mon Sep 17 00:00:00 2001 From: Alrzini2025 Date: Mon, 9 Feb 2026 17:31:22 +0000 Subject: [PATCH 4/7] I have made chage to allow name have charecters --- Form-Controls/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 35e594dc9..938de7506 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -26,7 +26,7 @@

T-Shirt Order

id="name" name="name" required - pattern="[A-Za-z\s]{2,}" + pattern="[A-Za-zÀ-ÿ\s'-]{2,}" title="Please enter a valid name (letters and spaces only)" > From ae64337814ecd512bbffcefa227a1f3eca004e2a Mon Sep 17 00:00:00 2001 From: Alrzini2025 Date: Mon, 9 Feb 2026 17:39:57 +0000 Subject: [PATCH 5/7] I have made required changes --- Form-Controls/index.html | 61 ++++++++++++++++------------------------ 1 file changed, 25 insertions(+), 36 deletions(-) diff --git a/Form-Controls/index.html b/Form-Controls/index.html index 938de7506..ddbf3cb01 100644 --- a/Form-Controls/index.html +++ b/Form-Controls/index.html @@ -16,67 +16,56 @@

T-Shirt Order

-
+
Confirm Your Details - + - -
+ +
- -
+ +
T-Shirt Colour -
+
- -
+ +
T-Shirt Size -
+
- +
From cc586bbd6cb2c70e05032548cc5b2f6ae0945034 Mon Sep 17 00:00:00 2001 From: Alrzini2025 Date: Wed, 11 Feb 2026 10:18:00 +0000 Subject: [PATCH 6/7] putting Wireframe back --- Wireframe/index.html | 97 -------------------------------------------- Wireframe/style.css | 42 +------------------ 2 files changed, 1 insertion(+), 138 deletions(-) diff --git a/Wireframe/index.html b/Wireframe/index.html index 4fe30ece1..0e014e535 100644 --- a/Wireframe/index.html +++ b/Wireframe/index.html @@ -1,6 +1,5 @@ -<<<<<<< Updated upstream @@ -32,99 +31,3 @@

Title

-======= - - - - - CYF sprint 1 - - - - -
-

My First Program

- -

What is the purpose of a README file?

-
-
- -
-
- ReadMe -

- The purpose of a README file is to explain what a project is and how to use it. Furthermore, it helps anyone - who - read the project understand the project quickly. -

- -
- -
-
-
-
-
- -
-
- ReadMe -

-

What is the purpose of a wireframe?

-

- - - - - -
-
-
-
- ReadMe -

-

What is a branch in Git?

-

- - - - - - -
- -
- - - - - ->>>>>>> Stashed changes diff --git a/Wireframe/style.css b/Wireframe/style.css index 28717089a..be835b6c7 100644 --- a/Wireframe/style.css +++ b/Wireframe/style.css @@ -62,7 +62,7 @@ https://developer.chrome.com/docs/devtools/css/grid https://gridbyexample.com/learn/ */ main { - /* display: grid; */ + display: grid; grid-template-columns: 1fr 1fr; gap: var(--space); > *:first-child { @@ -74,46 +74,6 @@ Setting the rules for how elements are placed in the article. Now laying out just the INSIDE of the repeated card/article design. Keeping things orderly and separate is the key to good, simple CSS. */ -<<<<<<< Updated upstream -======= -.Title { - text-align: center; - -} - -.article-boarding{ -border: 2px solid black; - border-radius: 5px; - margin: 0px 0px 0px 5px; - padding-bottom: 30px; - margin: auto; -} -.resize1{ - width: 500px; - align-content: center; - margin: auto; -} -.resize2{ - width: 500px; - height: 200px; - align-content: center; -} -.article-grid { - display: grid; - grid-template-columns: repeat(2, 1fr); - gap: 20px; -} -.article-row { - display: flex; - gap: 20px; - grid-template-columns: 1fr 1fr; - height: 920px; -} - -.article-row article { - flex: 1; -} ->>>>>>> Stashed changes article { border: var(--line); padding-bottom: var(--space); From bffc39b979ebf6d1eec5fe554eaf89bb101ef0ee Mon Sep 17 00:00:00 2001 From: Alrzini2025 Date: Wed, 11 Feb 2026 10:20:01 +0000 Subject: [PATCH 7/7] putting bake Wireframe --- Wireframe/stylesheet.css | 77 ---------------------------------------- Wireframe/test1.HTML | 27 -------------- 2 files changed, 104 deletions(-) delete mode 100644 Wireframe/stylesheet.css delete mode 100644 Wireframe/test1.HTML diff --git a/Wireframe/stylesheet.css b/Wireframe/stylesheet.css deleted file mode 100644 index 55caa7fe3..000000000 --- a/Wireframe/stylesheet.css +++ /dev/null @@ -1,77 +0,0 @@ -body { - margin: 0; - font-family: Arial, sans-serif; - background: #f5f5f5; -} - -/* Centered header */ -.header { - text-align: center; - padding: 30px 10px; -} - -/* Main centered container */ -.container { - width: 90%; - max-width: 1000px; - margin: auto; -} - -/* Featured article */ -.featured { - border: 1px solid #333; - background: #fff; - margin-bottom: 30px; -} - -.featured img { - width: 100%; - height: 260px; - object-fit: cover; -} - -.content { - padding: 20px; -} - -/* Two-column section */ -.grid { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 25px; - margin-bottom: 40px; -} - -.card { - border: 1px solid #333; - background: #fff; -} - -.card img { - width: 100%; - height: 200px; - object-fit: cover; -} - -/* Button */ -button { - padding: 8px 14px; - border: 1px solid black; - background: white; - cursor: pointer; -} - -/* Footer */ -.footer { - text-align: center; - padding: 20px; - border-top: 1px solid #333; - background: #eee; -} - -/* Responsive */ -@media (max-width: 768px) { - .grid { - grid-template-columns: 1fr; - } -} \ No newline at end of file diff --git a/Wireframe/test1.HTML b/Wireframe/test1.HTML deleted file mode 100644 index 4d3ff2dbe..000000000 --- a/Wireframe/test1.HTML +++ /dev/null @@ -1,27 +0,0 @@ - - - - - - Centralized Layout - - - - - - -
-

-

-
- - -
- - -
- - - - -