Skip to content

Cape Town | 26-ITP-May | Juanita Nwachukwu | Sprint 1 | Form Controls#1401

Open
Jay99-prog wants to merge 2 commits into
CodeYourFuture:mainfrom
Jay99-prog:new-form-control-juanita
Open

Cape Town | 26-ITP-May | Juanita Nwachukwu | Sprint 1 | Form Controls#1401
Jay99-prog wants to merge 2 commits into
CodeYourFuture:mainfrom
Jay99-prog:new-form-control-juanita

Conversation

@Jay99-prog
Copy link
Copy Markdown

@Jay99-prog Jay99-prog commented Jun 2, 2026 •
edited
Loading

Cape Town | 26-ITP-May | Juanita Nwachukwu | Sprint 1 | Form Controls

Self checklist

  • I have titled my PR with Region | Cohort | FirstName LastName | Sprint | Assignment Title
  • My changes meet the requirements of the task
  • I have tested my changes
  • My changes follow the style guide

Changelist

  • I created a T-shirt Order form for customers/clients ordering from my business. The fields included: full name, email address, colour choice and preferred size.

@netlify
Copy link
Copy Markdown

netlify Bot commented Jun 2, 2026 •
edited
Loading

✅ Deploy Preview for cyf-onboarding-module ready!

Name Link
🔨 Latest commit 0c6947f
🔍 Latest deploy log https://app.netlify.com/projects/cyf-onboarding-module/deploys/6a1f3958ff14e100081f79a8
😎 Deploy Preview https://deploy-preview-1401--cyf-onboarding-module.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse		 2 paths audited
Performance: 100 (no change from production)
Accessibility: 100 (no change from production)
Best Practices: 100 (no change from production)
SEO: 83 (🔴 down 3 from production)
PWA: -
View the detailed breakdown and full score reports
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions

This comment has been minimized.

Sign in to view
1 similar comment
@github-actions

This comment has been minimized.

Sign in to view
@Jay99-prog Jay99-prog added 📅 Sprint 1 Assigned during Sprint 1 of this module Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Jun 5, 2026
@Jay99-prog
Copy link
Copy Markdown
Author

Jay99-prog commented Jun 5, 2026

Needs Review

@github-actions

This comment has been minimized.

Sign in to view
@github-actions github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026
@github-actions

This comment has been minimized.

Sign in to view
@Jay99-prog Jay99-prog added Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. and removed 📅 Sprint 1 Assigned during Sprint 1 of this module labels Jun 5, 2026
@github-actions

This comment has been minimized.

Sign in to view
@github-actions github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026
@github-actions

This comment has been minimized.

Sign in to view
2 similar comments
@github-actions

This comment has been minimized.

Sign in to view
@github-actions

This comment has been minimized.

Sign in to view
@Jay99-prog Jay99-prog added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026
@github-actions

This comment has been minimized.

Sign in to view
@github-actions github-actions Bot removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 5, 2026
@cjyuan
Copy link
Copy Markdown
Contributor

cjyuan commented Jun 5, 2026

You need to delete the placeholder text, "Briefly explain your PR." from your PR description to pass the Validation Bot check.

cjyuan
cjyuan reviewed Jun 5, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Comment thread Form-Controls/index.html
Comment on lines +11 to +12
<header>T-shirt Order Form
<h1>T-shirt Order Form</h1>
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan Jun 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why made "T-shirt Order Form" to appear twice?

Comment thread Form-Controls/index.html
Comment on lines +37 to +50
<label>
<input type="radio" name="colour" value="pink" required>
Pink
</label>

<label>
<input type="radio" name="colour" value="black" required>
Black
</label>

<label>
<input type="radio" name="colour" value="blue" required>
Blue
</label>
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan Jun 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Note: For radio buttons within the same group, it is sufficient to mark only one of them as required.

Comment thread Form-Controls/index.html
Comment on lines +17 to +23
<label for="name">Full Name</label>
<input
type="text"
id="name"
required
minlength="5"
>
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan Jun 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This input element does not yet fully meet the requirement:

  • Must be at least 2 characters long
  • Cannot be empty

Currently, string such as "CJ" would be rejected but a string containing exactly 5 space characters would be accepted.

On separate note, can you use an AI to find out "In HTML, what is a placeholder attribute and why using it in input element is considered a good practice?"

Comment thread Form-Controls/index.html
Comment on lines +52 to +56
<!-- SIZE -->
<label for="size">SIZE</label>
<select id="size" name="size" required>
<option value="">-- Select Size --</option>
<option value="XS">XS</option>
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan Jun 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The layout of the colour and size controls feels a bit unbalanced. The colour options are presented as a radio group, while the size selector appears immediately afterward without a similar grouping structure. Consider reorganizing these controls (for example, using <fieldset> and <legend> elements) to make the form easier to scan and more visually consistent.

Image

@cjyuan cjyuan added the Reviewed Volunteer to add when completing a review with trainee action still to take. label Jun 6, 2026
@github-actions

This comment has been minimized.

Sign in to view
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@cjyuan cjyuan cjyuan left review comments

At least 2 approving reviews are required to merge this pull request.

Assignees

No one assigned

Labels

Reviewed Volunteer to add when completing a review with trainee action still to take.

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@Jay99-prog @cjyuan