Cape Town | May-ITP-2026 | Enice Mutanda | Sprint 1 | FormControls#1291
Cape Town | May-ITP-2026 | Enice Mutanda | Sprint 1 | FormControls#1291Enice-Codes wants to merge 4 commits into
Conversation
✅ Deploy Preview for cyf-onboarding-module ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
This comment has been minimized.
This comment has been minimized.
1 similar comment
This comment has been minimized.
This comment has been minimized.
Enice-Codes
added
the
Needs Review
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
This comment has been minimized.
This comment has been minimized.
Enice-Codes
changed the title
This comment has been minimized.
This comment has been minimized.
Enice-Codes
added
📅 Sprint 1
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
This comment has been minimized.
This comment has been minimized.
1 similar comment
This comment has been minimized.
This comment has been minimized.
Enice-Codes
added
the
Needs Review
Enice-Codes
added
the
Needs Review
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
This comment has been minimized.
This comment has been minimized.
github-actions
Bot
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
Luro91
added
the
Review in progress
Luro91
left a comment
Luro91
left a comment
There was a problem hiding this comment.
I see a lot of errors when I paste the html in the w3 validator: https://validator.w3.org/nu/#textarea. How can you fix them?
How can you ensure a lighthouse score of 100?
| this will also help you fill in your PR message later--> | ||
| <form action="results.html" method="GET"> | ||
| <div> | ||
| <label for="name">Customer Name:</label> |
There was a problem hiding this comment.
The formatting standard for HTML elements is to use indentation on children elements. This makes it easier to understand the structure. How can you ensure consistent formatting in your code automatically?
There was a problem hiding this comment.
I can use a code formatter such as Prettier. It automatically indents child elements and keeps the HTML structure neat and easy to read whenever I save my file.
There was a problem hiding this comment.
The indentation is not matching the standard. Prettier only works if there are no syntax errors. Fix the errors from the w3 validator first and then try to run it again. Does the formatting of the code change?
| <title>My form exercise</title> | ||
| <meta name="description" content="" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
| <link rel="stylesheet" href="style.css" > |
There was a problem hiding this comment.
This file is linked to the css file.
| <form action="results.html" method="GET"> | ||
| <div> | ||
| <label for="name">Customer Name:</label> | ||
| <input type="text" id="name" name="name" required placeholder="two non-space characters."/> |
There was a problem hiding this comment.
How can you ensure that the user needs to input 2 non space characters?
There was a problem hiding this comment.
I can use the pattern attribute in side the element to tell the browser what format the user's input must follow. than next to the pattern attribute , i can than use the Title attribute to show a helpful message to tell users what is expect of them
There was a problem hiding this comment.
The placeholder is nice information for the user. Please also enforce the rules programatically
Luro91
added
Reviewed
Enice-Codes
added
the
Needs Review
| <title>My form exercise</title> | ||
| <meta name="description" content="" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | ||
| <link rel="stylesheet" href="style.css" > |
| this will also help you fill in your PR message later--> | ||
| <form action="results.html" method="GET"> | ||
| <div> | ||
| <label for="name">Customer Name:</label> |
There was a problem hiding this comment.
Please also fix my comments from the review text itself: #1291 (review)
| <form action="results.html" method="GET"> | ||
| <div> | ||
| <label for="name">Customer Name:</label> | ||
| <input type="text" id="name" name="name" required placeholder="two non-space characters."/> |
There was a problem hiding this comment.
The placeholder is nice information for the user. Please also enforce the rules programatically
Luro91
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
Luro91
left a comment
Luro91
left a comment
There was a problem hiding this comment.
I don't see any changes after my last review
Luro91
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
Luro91
left a comment
Luro91
left a comment
There was a problem hiding this comment.
How can you achieve a lighthouse score of 100 for Accessibility?
| <label for="name">Customer Name:</label> | ||
| <input type="text" id="name" name="name" required placeholder="two non-space characters."/> | ||
| </div> | ||
| <div |
There was a problem hiding this comment.
I see a lot of errors in the w3 validator: https://validator.w3.org/nu/#textarea
| <label for="gender">Male</label> | ||
| <input type="radio" for="gender" id="male"></input> | ||
| </div> | ||
| <div> | ||
| <label for="gender">Female</label> | ||
| <input type="radio" for="gender" id="female"></input> |
There was a problem hiding this comment.
I can select both options with the radio buttons:
There was a problem hiding this comment.
i managed to fix that problem
| this will also help you fill in your PR message later--> | ||
| <form action="results.html" method="GET"> | ||
| <div> | ||
| <label for="name">Customer Name:</label> |
Luro91
removed
the
Needs Review
Enice-Codes
added
the
Needs Review
|
the was an issue with my pc .my project wasn't being pushed to github even after pushing it .dint even noticed it wasn't pushed even after pushing it in the terminal. |
Luro91
left a comment
Luro91
left a comment
There was a problem hiding this comment.
I see an accessibility score of 78 in Lighthouse. How can you get it to 100?
the was an issue with my pc .my project wasn't being pushed to github even after pushing it .dint even noticed it wasn't pushed even after pushing it in the terminal.
You can check Github itself if your changes are pushed. You can verify that the commits are shown or check the changes page: https://github.com/CodeYourFuture/Module-Onboarding/pull/1291/changes
| </head> | ||
|
|
||
| <body> | ||
| <center> |
There was a problem hiding this comment.
I see a lot of errors in the w3 validator. https://validator.w3.org/nu/#textarea
How can you fix them?
| this will also help you fill in your PR message later--> | ||
| <form action="results.html" method="GET"> | ||
| <div> | ||
| <label for="name">Customer Name:</label> |
There was a problem hiding this comment.
The indentation is not matching the standard. Prettier only works if there are no syntax errors. Fix the errors from the w3 validator first and then try to run it again. Does the formatting of the code change?
Luro91
removed
the
Needs Review
2 participants
Learners, PR Template
Self checklist
Changelist
I used Html to create a form using provided information. I added other details such as phone number and reset button to make the form look professional. I used CSS to style the form to make it attractive and simple . tested the changes and was satisfied with the results.