London | 26-ITP-May | Hugh Mills | Sprint 2 | Wireframe to web code by HM-127BTY · Pull Request #1405 · CodeYourFuture/Module-Onboarding

HM-127BTY · 2026-06-03T10:36:23Z

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

Using the Wireframe I was able to create the website to match the style required and filled out the information that was required.

Added images and text to main artiles, added links. Added footer info.

added styles for footer.

netlify · 2026-06-03T10:36:28Z

✅ Deploy Preview for cyf-onboarding-module ready!

Name	Link
🔨 Latest commit	`08e533a`
🔍 Latest deploy log	https://app.netlify.com/projects/cyf-onboarding-module/deploys/6a243921e46f780008dac785
😎 Deploy Preview	https://deploy-preview-1405--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
🤖 Make changes	Run an agent on this branch

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

HM-127BTY · 2026-06-03T10:45:26Z

removed extra image file, changed to image link from wiki page.

akeren

@HM-127BTY, your codebase structure is currently simple and easy to follow, with just two files: index.html and style.css kept in the same root directory.

As your projects grow, what might happen if you later add more CSS files, JavaScript files, images, or multiple HTML pages? How could you organise your folders so the project stays easy to navigate, scalable and maintainable now and in the future?

akeren · 2026-06-05T08:30:40Z

+        <p>A Branch in git is a copy of the main folder where there has been edits or fixes done to in a controlled manner that can then be implemented to the main folder in due time.
        </p>
-        <a href="">Read more</a>
+        <a href="https://en.wikipedia.org/wiki/Branching_(version_control)">Read more</a>


@HM-127BTY, why is this anchor link UI different from the rest?

I am unsure why it is doing that, could be because it is the last item in all the articles before footer? I will look into it tomorrow, hopefully with some assistance from others in the class on Saturday.

I worked it out, I did not have a height set for it, so added "max-height: fit-content;" this helped make them match.

akeren · 2026-06-05T08:34:18Z

+      </article>
+      <article id="2nd">
+        <img src="https://cdn.prod.website-files.com/64fa82cbdeed167ebaefef84/64fa868c41d7a2600b45a4d5_606de8872932076fce79ad0f_TL5vrIkw1V7VYfqA3lvvi313PuvWyzIJtAQ4HthZnsXuYXQTC4rQhEcyq40qZaYDYpBHtnnPJ0PhnmBuJ9XRLnWMrlzZE9IXIfyvYan4Xj3woYXuTrAC7kTgydlqIADE8A26ITwb.png" alt="shetched images showing a plan for desnining a website, showing areas for an image, video player and other boxes for feature text and information." >
+<!-- Image from https://www.flux-academy.com/blog/20-wireframe-examples-for-web-design to help show wireframe-->        


@HM-127BTY, could you explain why you're pushing commented code to a production environment?

Error on my part, was planning on adding images then changed to using links.

akeren · 2026-06-05T08:35:02Z

+      </article>     
+      <article id="3rd">
+        <img src="https://docs.wavemaker.com/learn/assets/images/branching-model-121bd320dd2f5972a5f6ce2fb19a3f4e.png" alt="Connection blue balls in a straight line starting from one called Master then connection to others with lined arrow, from First is extra arrow goign up to red balls labed Bugfix then back down to third blue ball, from 2nd blue ball extra arrow goes down to two green balls labed Feature then back to last blue ball." >
+<!-- Image from https://docs.wavemaker.com/learn/blog/2021/09/17/git-branching-strategy/ to aid in display of Git Branch-->


@HM-127BTY, could you explain why you're pushing commented code to a production environment?

Error on my part, was planning on adding images then changed to using links.

akeren · 2026-06-05T08:36:07Z

+header {
+  text-align:center;
+  max-width: fit-content;
+  margin-left: auto;
+  margin-right: auto;
+}
+h1 {
+  text-align:center;
+  font-size: 4em;
+  max-width: fit-content;
+  font-weight: bold;
+  font-family: 'Times New Roman', Times, serif;
+}
+#top-comment {
+  text-align:center;
+  margin-bottom: 20px;
+}
 footer {
  position: fixed;
  bottom: 0;
  text-align: center;
+  color: white;
+  padding-top: 10px;
+  background-color: rgb(28, 77, 127);
+  width:100%
 }


@HM-127BTY, how could you improve the readability and the separation between blocks of code?

My best guess would be spacing, keeping a clear line between them would help to break it up and make it more readable?

akeren · 2026-06-05T08:38:42Z

-        <p>
-          Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
-          voluptates. Quisquam, voluptates.
+      <article id="1st">


@HM-127BTY, could you think of a better name for this id?

Instead of the ID for order, change it to mate what the article contains.

akeren · 2026-06-05T08:39:28Z

+        </p>
+        <a href="https://en.wikipedia.org/wiki/README">Read more</a>
+      </article>
+      <article id="2nd">


@HM-127BTY, could you think of a better name for this id?

Same as the other ID: Instead of the ID for order, change it to mate what the article contains.

akeren · 2026-06-05T08:39:51Z

+        </p>
+        <a href="https://en.wikipedia.org/wiki/Website_wireframe">Read more</a>
+      </article>     
+      <article id="3rd">


@HM-127BTY, could you think of a better name for this id?

Same as the other ID: Instead of the ID for order, change it to mate what the article contains.

removed commented code. Better spacing and readability in style.css. Chaged ID's to match articles content.

HM-127BTY · 2026-06-05T18:17:07Z

@akeren Thank you, to your first comment I would say to I need to have folders for each page to help keep the files together and in a structured order. (Not to sure how to reply to that comment like the others.)

akeren · 2026-06-06T00:58:22Z

@akeren Thank you, to your first comment I would say to I need to have folders for each page to help keep the files together and in a structured order. (Not to sure how to reply to that comment like the others.)

@HM-127BTY, you could create a css/ folder to keep all your styles. That's the best practice.

…he images be uniformed and made the articals match.

HM-127BTY · 2026-06-06T15:16:24Z

I added "aspect-ratio:16/9 ;" to the image to see if it would help make my images look more uniformed and it helped to make sure the articles matches in style.

HM-127BTY added 3 commits May 16, 2026 15:00

Started work

e4d7a04

Added infor to Header.

c2fd516

Added images and text to main artiles, added links. Added footer info.

added styles for header,

ede0704

added styles for footer.

This comment has been minimized.

Sign in to view

HM-127BTY added 📅 Sprint 2 Assigned during Sprint 2 of this module Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Jun 3, 2026

This comment has been minimized.

Sign in to view

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

This comment has been minimized.

Sign in to view

removed the image file and changed to the image online to wiki page.

a9b67f1

HM-127BTY closed this Jun 3, 2026

HM-127BTY reopened this Jun 3, 2026

This comment has been minimized.

Sign in to view

changed file in form-control to one before changes

c2c02e0

HM-127BTY added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jun 3, 2026

akeren added Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. Module-Onboarding The name of the module. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Jun 5, 2026

akeren assigned HM-127BTY Jun 5, 2026

akeren self-requested a review June 5, 2026 08:28

akeren reviewed Jun 5, 2026

View reviewed changes

akeren 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 Jun 5, 2026

Mades fixes and updates.

74566dd

removed commented code. Better spacing and readability in style.css. Chaged ID's to match articles content.

Changes to the "Read more" tag to make it more uniform.

6c3a2e6

Added " aspect-ratio:16/9 ;" to the "img" in style.css to help make t…

08e533a

…he images be uniformed and made the articals match.

akeren added Complete Volunteer to add when work is complete and all review comments have been addressed. and removed Reviewed Volunteer to add when completing a review with trainee action still to take. labels Jun 6, 2026

Uh oh!

Conversation

HM-127BTY commented Jun 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Learners, PR Template

Changelist

Uh oh!

netlify Bot commented Jun 3, 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!

This comment has been minimized.

This comment has been minimized.

This comment has been minimized.

HM-127BTY commented Jun 3, 2026

Uh oh!

This comment has been minimized.

This comment has been minimized.

akeren left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

HM-127BTY commented Jun 5, 2026

Uh oh!

akeren commented Jun 6, 2026

Uh oh!

HM-127BTY commented Jun 6, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

HM-127BTY commented Jun 3, 2026 •

edited

Loading

netlify Bot commented Jun 3, 2026 •

edited

Loading