London | 26-ITP-Jan | Miriam Jorna | Sprint 1 | Wireframe #1153

miriamjorna · 2026-02-06T20:02:37Z

London | Jan26ITP | Miriam Jorna | Sprint 1 | Wireframe

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

Task 1: Wireframe table. Now with a cleaned up branch structure.

netlify · 2026-02-06T20:02:59Z

✅ Deploy Preview for cyf-onboarding-module ready!

Name	Link
🔨 Latest commit	`a39e276`
🔍 Latest deploy log	https://app.netlify.com/projects/cyf-onboarding-module/deploys/698a7f23c6de8c0008bcbbc7
😎 Deploy Preview	https://deploy-preview-1153--cyf-onboarding-module.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
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

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

cjyuan

A well-prepared PR makes it easier for reviewers to approve it with minimal back-and-forth.
Can you take a look at this General Feedback to see if there
is anything you can do to make your PR more robust and ready?
Doing so can help speed up the review process.

Note:

The cohort name should be 26-ITP-Jan.
You can use placeholder.svg as the image in all three articles.

…ion beats perfection

miriamjorna

Fixed footer, straightened out table; stuck to principle that production beats perfection

miriamjorna · 2026-02-07T16:16:12Z

Wireframe/index.html

      <article>
-        <img src="placeholder.svg" alt="" />
-        <h2>Title</h2>
+        <img src="wireframe.png" alt="a wireframe sketch of this page"/>


Suggested change

<img src="wireframe.png" alt="a wireframe sketch of this page"/>

<img src="placeholder.svg" alt="placeholder image"/>

cjyuan

Issues to be addressed

Code has syntax errors
Code is not yet fully indented
The layout of the page content do not quite match the wireframe
- TITLE and SHORT DESCRIPTION beneath it are not centered
- Articles 2 and 3 do not have the same dimension, and their image height do not align
- Footer content is not centered
Footer is not fixed at the bottom of the viewport

Please read the General Feedback carefully.

Please note that in CYF courses, the recommended way to inform the reviewer of your changes is to do both of the following:

Reply to their feedback.
- In the responses, clarify how each piece of feedback was addressed to demonstrate that you've carefully reviewed the suggestions.
  - You may find the suggestions in this PR Guide useful.
- Your response may trigger a notification (depending on the reviewer's settings), helping ensure they’re aware of the updates you’ve made.
Replace the "Reviewed" label by a "Needs review" label
- Without this label, the reviewer would not know if your changes is ready to be reviewed.

miriamjorna · 2026-02-08T18:50:25Z

Many thanks, apologies for this to be automagically marked as Ready To Review when I only tried to get it out of Draft. Will mark as Needs Review when done with the update.

Removing orphan </style> tag made the footer behave like it should. Followed the wireframe closely (whereas initial PR e.g. did not have parts of text centered). Re-did indenture to make code more legible. Also did the recommended reading. Thank you.

cjyuan

According to https://validator.w3.org/, there are errors and warnings in your code. Please fix all of them?

After you have made all the changes, share your code to an AI tool and ask it to review your code in terms of semantic, accessibility, typo, and consistency.
It can often help us catch errors, improve consistency, and reinforce best practices.

cjyuan · 2026-02-09T06:27:15Z

Wireframe/index.html

-        </p>
-        <a href="">Read more</a>
-      </article>
+      <table width="80%" border="0" cellspacing="0" cellpadding="0" bgcolor="#88ffcc" align="center">


It is not a good practice to use table for layout. Can you use CSS Grid Layout instead?

Clearly showing my age here... Learnt HTML before CSS was born... Should now be fixed.

Wireframe/style.css

- Removed table attributes in HTML and moved to CSS if necessary (esp. width) - Removed VSCode's hobby to put /> in HTML where > is needed instead - Removed <section> tag. W3 HTML validation now clean. Then for the CSS: - undid the nesting - have left in "oklch()" since it is valid modern CSS even though the validator doesn't like it (dixit ChatGPT)

miriamjorna · 2026-02-09T16:41:58Z

Thank you very much so far. I have learnt a LOT. Especially about how the instructions need to be followed precisely and not creatively.

cjyuan · 2026-02-10T00:07:54Z

Code looks good, except the use of <table> to layout the elements.

I will mark this as "Complete" first. Can you remove the table/tr/td elements and layout the three articles with CSS?
It should be very straight forward using Grid Layout.

miriamjorna · 2026-02-10T00:44:14Z

Checked in ChatGTP that this is now as requested.
Many thanks for your time.

cjyuan · 2026-02-10T01:32:30Z

Excellent! Now you can take your time to understand how Grid Layout work next.

hoimir added 14 commits February 6, 2026 19:49

Small text changes to wireframe page

6a9c674

More text edits incl. the footer

b6655a7

Added <title>

a1ca9c6

changed pic to wireframe pic; made 3 articles instead of 1

03d327e

Wrote article stubs

a38555a

added 2 sections

3c16ef2

added table to css and html

e61c71f

corrected brackets section/articles

d1526a5

fixed footer to bottom

8b3f6c3

inserted pix and added subpages in branch

510473d

added links to subpages

149c92d

corrected table structure

b63b03d

table corrections

0bd6ff0

checked Readme checklist

402e4d5

miriamjorna 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 Feb 6, 2026

miriamjorna mentioned this pull request Feb 6, 2026

London | Jan26ITP | Miriam Jorna | Sprint 1 | Wireframe #1138

Closed

4 tasks

cjyuan reviewed Feb 6, 2026

View reviewed changes

cjyuan added Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Feb 6, 2026

miriamjorna marked this pull request as draft February 7, 2026 16:16

fixed footer; straightened out table; stuck to principle that product…

e99cc81

…ion beats perfection

miriamjorna commented Feb 7, 2026

View reviewed changes

miriamjorna marked this pull request as ready for review February 7, 2026 23:40

cjyuan reviewed Feb 8, 2026

View reviewed changes

miriamjorna removed the Reviewed Volunteer to add when completing a review with trainee action still to take. label Feb 8, 2026

miriamjorna added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Feb 8, 2026

cjyuan reviewed Feb 9, 2026

View reviewed changes

cjyuan added Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Feb 9, 2026

miriamjorna added Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. and removed Reviewed Volunteer to add when completing a review with trainee action still to take. labels Feb 9, 2026

cjyuan added Complete Volunteer to add when work is complete and all review comments have been addressed. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Feb 10, 2026

Removed <table> elements from HTML. Sorted in CSS

a39e276

	<img src="wireframe.png" alt="a wireframe sketch of this page"/>
	<img src="placeholder.svg" alt="placeholder image"/>

Uh oh!

London | 26-ITP-Jan | Miriam Jorna | Sprint 1 | Wireframe #1153

Are you sure you want to change the base?

London | 26-ITP-Jan | Miriam Jorna | Sprint 1 | Wireframe #1153

Uh oh!

Conversation

miriamjorna commented Feb 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

London | Jan26ITP | Miriam Jorna | Sprint 1 | Wireframe

Changelist

Uh oh!

netlify bot commented Feb 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for cyf-onboarding-module ready!

Uh oh!

cjyuan left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

miriamjorna left a comment

Choose a reason for hiding this comment

Uh oh!

miriamjorna Feb 7, 2026

Choose a reason for hiding this comment

Uh oh!

cjyuan left a comment

Choose a reason for hiding this comment

Issues to be addressed

Uh oh!

miriamjorna commented Feb 8, 2026

Uh oh!

cjyuan left a comment

Choose a reason for hiding this comment

Uh oh!

cjyuan Feb 9, 2026

Choose a reason for hiding this comment

Uh oh!

miriamjorna Feb 9, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

miriamjorna commented Feb 9, 2026

Uh oh!

cjyuan commented Feb 10, 2026

Uh oh!

miriamjorna commented Feb 10, 2026

Uh oh!

cjyuan commented Feb 10, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

miriamjorna commented Feb 6, 2026 •

edited

Loading

netlify bot commented Feb 6, 2026 •

edited

Loading

cjyuan left a comment •

edited

Loading