Skip to content

WM | ITP-MAY-25 | Tesfalem Hailu | Wireframe #722

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 21 commits into
base: main
Choose a base branch
from
Open

WM | ITP-MAY-25 | Tesfalem Hailu | Wireframe #722

wants to merge 21 commits into from

Conversation

tesfathefture
Copy link

@tesfathefture tesfathefture commented Jun 8, 2025 •
edited
Loading

Learners, PR Template

Self checklist

  • I have committed my files one by one, on purpose, and for a reason
  • I have titled my PR with REGION | COHORT_NAME | FIRST_NAME LAST_NAME | PROJ_NAME
  • I have tested my changes
  • My changes follow the style guide
  • My changes meet the requirements of this task

Changelist

-Implemented semantic HTML structure using elements
-applied CSS Grid for a responsive layout, ensured the first section spans full width, fixed the footer
-the bottom of the viewport, validated the code with W3C (no errors), and achieved a 100% Lighthouse accessibility score."

Questions

how to change the picture lighting to increase comptablity with page.

@tesfathefture
purpose of readme.
2539259
@tesfathefture
index.html
5d6ca7a 
enhanced the visual representation
@netlify Netlify
Copy link

netlify bot commented Jun 8, 2025 •
edited
Loading

✅ Deploy Preview for cyf-onboarding-module ready!

Name Link
🔨 Latest commit 0e61696
🔍 Latest deploy log https://app.netlify.com/projects/cyf-onboarding-module/deploys/684af5e8be2f91000887e196
😎 Deploy Preview https://deploy-preview-722--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

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

@tesfathefture
index.html
53ec74b 
Revised the content of index.html to improve clarity, structure, and presentation across the homepage. Updates include rewriting text for better readability, organizing sections more effectively, and ensuring that all information is accurate and relevant to the website’s purpose.
@tesfathefture tesfathefture changed the title REGION Westmidland | COHORT_NAME | FIRST_NAME Tesfalem LAST_NAME Hailu | PROJ_NAME Wireframe WM | ITP-MAY-25 | Tesfalem Hailu | Wireframe Jun 8, 2025
@tesfathefture
Copy link
Author

I don't have a laptop so I was unable commit the changes one by one.

@tesfathefture tesfathefture added the Needs Review Participant to add when requesting review label Jun 11, 2025
@oluwatunmiisheii oluwatunmiisheii added Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. and removed Needs Review Participant to add when requesting review labels Jun 11, 2025
oluwatunmiisheii
oluwatunmiisheii reviewed Jun 11, 2025
View reviewed changes
Copy link

@oluwatunmiisheii oluwatunmiisheii left a comment

Choose a reason for hiding this comment

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

You are off to a good start, implement the requested changes, and you should be good to go.

Wireframe/articles.md Outdated
Copy link

Choose a reason for hiding this comment

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

@tesfathefture i am not sure this file is necessary.

Wireframe/index.html Outdated
<h1>Wireframe</h1>
<p>
This is the default, provided code and no changes have been made yet.
<h1 style="text-align: center;">Wireframe</h1>
Copy link

Choose a reason for hiding this comment

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

Create a class in your style.css and use it for your h1 and p instead of using inline style and repeating yourself

Copy link
Author

Choose a reason for hiding this comment

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

I have used it for h1 and p instead of using inline style and repeating itself

Wireframe/index.html Outdated
Comment on lines 157 to 160
<footer>
<p>
This is the default, provided code and no changes have been made yet.
</p>
<p>Author: Tesfalem Hailu</p>
<p><a href="mailto:[email protected]">[email protected]</a></p>
</footer>
Copy link

Choose a reason for hiding this comment

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

Screenshot 2025-06-11 at 16 03 40

The footer needs a bit more work, when you scroll up it shows on top of your article content as shown in the image attached.

You can play with background color, borders, or box-shadow to make it look better

Copy link
Author

Choose a reason for hiding this comment

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

I have improved the footer to make it look better.

@oluwatunmiisheii
Copy link

oluwatunmiisheii commented Jun 11, 2025 •
edited
Loading

Also, your changeset description looks rather generic. It would be great to be more specific about what was changed and why.

For example, instead of:

"The code was improved through a series of structural and stylistic refinements..."

You could write something like:

Used semantic HTML tags (article, footer)
Structured layout with CSS Grid
The first section spans the full width
The footer is fixed at the bottom of the viewport
Passed W3C validation with no errors
Scored 100% on Lighthouse Accessibility audit

@oluwatunmiisheii oluwatunmiisheii added Reviewed Volunteer to add when completing a review and removed Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. labels Jun 11, 2025
@tesfathefture tesfathefture added the Needs Review Participant to add when requesting review label Jun 12, 2025
oluwatunmiisheii
oluwatunmiisheii reviewed Jun 12, 2025
View reviewed changes
Wireframe/index.html Outdated

<article>
<img src="placeholder.svg" alt="" />
</svg>
Copy link

@oluwatunmiisheii oluwatunmiisheii Jun 12, 2025 •
edited
Loading

Choose a reason for hiding this comment

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

This svg tag is no longer required; please remove it.

Copy link
Author

Choose a reason for hiding this comment

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

svg tag is removed.

@tesfathefture tesfathefture added Needs Review Participant to add when requesting review and removed Needs Review Participant to add when requesting review labels Jun 12, 2025
@oluwatunmiisheii oluwatunmiisheii added Complete Volunteer to add when work is complete and review comments have been addressed and removed Needs Review Participant to add when requesting review Reviewed Volunteer to add when completing a review labels Jun 12, 2025
@tesfathefture tesfathefture mentioned this pull request Jun 12, 2025
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@oluwatunmiisheii oluwatunmiisheii oluwatunmiisheii left review comments

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

Assignees
No one assigned
Labels
Complete Volunteer to add when work is complete and review comments have been addressed
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@tesfathefture @oluwatunmiisheii