Skip to content

Glasgow | May 2026 | Craig Stoddart | Sprint 1 | Form Control#1266

Open
CraigStodd wants to merge 13 commits into
CodeYourFuture:mainfrom
CraigStodd:Glasgow-May-2026-Craig-Stoddart-Sprint-1-Form-Control
Open

Glasgow | May 2026 | Craig Stoddart | Sprint 1 | Form Control#1266
CraigStodd wants to merge 13 commits into
CodeYourFuture:mainfrom
CraigStodd:Glasgow-May-2026-Craig-Stoddart-Sprint-1-Form-Control

Conversation

@CraigStodd
Copy link
Copy Markdown

@CraigStodd CraigStodd commented May 14, 2026 •
edited
Loading

Learners, PR Template

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

HTML

  1. Changed header titles to: h1 "T-Shirt Order," h2 "Verify your order and details below"
  2. Included Requirements in comments: Added each requirement as a separate comment, with the corresponding code below each comment.
  3. Placed form content in a container.
  4. Requirement 1: Added "Name" label with input type, id and name specification.
  5. Requirement 2: Added "Email label" using the same code from requirement 1 as a template. Changed input type, id and name specifications to "email," "mail" and "User Email, respectively.
  6. Requirement 3: created dropdown-select menu using . Only 1 T-shirt colour can be selected.
  7. Added Select a colour . This becomes the default title in the dropdown-select menu and cannot be selected as an option.
  8. Requirement 4: Created size selector using . Only 1 size can be selected at a time
  9. Added "Submit" button
  10. Placed every text element in

    tags within each

    to allow further styling via CSS

CSS

  1. Added stylesheet "mystyle.css"
  2. Added font family specification for

    ,

    elements

  3. Added font weight specification for

    elements

  4. Added font family + font size specification for

    elements

  5. Added container styling: "border-style; border-width; padding; max-width"

Questions

  • Have I forked/branched this correctly?

@netlify
Copy link
Copy Markdown

netlify Bot commented May 14, 2026 •
edited
Loading

✅ Deploy Preview for cyf-onboarding-module ready!

Name Link
🔨 Latest commit efae5ad
🔍 Latest deploy log https://app.netlify.com/projects/cyf-onboarding-module/deploys/6a059cdff742d70008dffc8b
😎 Deploy Preview https://deploy-preview-1266--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: 86 (no change 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
@CraigStodd CraigStodd changed the title Glasgow may 2026 craig stoddart sprint 1 form control Glasgow | May 2026 | Craig Stoddart | Sprint 1 | Form Control May 16, 2026
@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
@CraigStodd CraigStodd added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label May 16, 2026
@cjyuan cjyuan added Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels May 16, 2026
cjyuan
cjyuan reviewed May 16, 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.

  • One of the requirements has not yet been met: "All fields are required" -- it means the user should not be able to submit the form when any of the input field is missing a value.

  • Can you rename your branch to feature/form-controls? (We missed specified the expected branch name in the backlog and I just updated it)

    • Suggestion: Ask AI what's the naming convention for branch name.

  • About the Changelist section of the PR description

    • Some of the contents are not formatted properly
    • Because the reviewers already know what the Form-Control exercise is, you can just state in this section that you have implemented an HTML form that meets all the requirements in the Form-Controls exercise. That is, you don't have to list the individual changes you made.

Comment thread Form-Controls/index.html
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />

<link rel="Stylesheet" href="Mystyle.css" />
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan May 16, 2026

Choose a reason for hiding this comment

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

File names and URL are typically case sensitive. Your CSS file is named mystyle.css.

Comment thread Form-Controls/index.html
Comment on lines +25 to +32
<!-- 1.Customer's name - ensure it contains at least two non-space characters. -->
<div>
<p>
<label>Full Name:
<input type = "text" id = "name" name = "name">
</label>
</p>
</div>
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan May 16, 2026

Choose a reason for hiding this comment

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

This input cannot yet ensure the user input contains at least two non-space characters.

Comment thread Form-Controls/index.html
Comment on lines +46 to +47
<label for="T-Shirt-Colour"> T-Shirt Colour: </label>
<select name="T-Shirt-Colour" id="T-Shirt-Colour">
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan May 16, 2026

Choose a reason for hiding this comment

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

A common convention is to use lowercase letters consistently for the id attribute.

Comment thread Form-Controls/index.html
Comment on lines +65 to +67
<label>XS:
<input type = "radio" id = "XS" name = "Size" value = "XS">
</label>
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan May 16, 2026 •
edited
Loading

Choose a reason for hiding this comment

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

Indentation is off.

Consider enabling "Format on save/paste" on VSCode or using its "Format Document" feature to keep the code formatted consistently.

Please take a look at this Guide: https://github.com/CodeYourFuture/Module-Onboarding/blob/main/practical_guide.md

Comment thread Form-Controls/index.html
Comment on lines +69 to +75
<label>S:
<input type = "radio" id = "S" name = "Size" value = "S">
</label>

<label>M:
<input type = "radio" id = "M" name = "Size" value = "M">
</label>
Copy link
Copy Markdown
Contributor

@cjyuan cjyuan May 16, 2026

Choose a reason for hiding this comment

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

Why introduce id attribute to each radio button input?

@cjyuan cjyuan added Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. labels May 16, 2026
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

@CraigStodd @cjyuan