Skip to content

London | 26-ITP-Jan | Oussama Mouggal | Sprint 1| Wireframe #968

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

Open
Oussama-Mouggal wants to merge 15 commits into
base: main
Choose a base branch
from
Open

London | 26-ITP-Jan | Oussama Mouggal | Sprint 1| Wireframe #968

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
a8f1b77
I add titles
Oussama-Mouggal Jan 15, 2026
58e9b35
I added the definitions
Oussama-Mouggal Jan 15, 2026
731c575
I added pictures using urls
Oussama-Mouggal Jan 15, 2026
0be1fa5
I fixed the footer using css
Oussama-Mouggal Jan 15, 2026
8a68c7c
add alt description
Oussama-Mouggal Jan 15, 2026
485d24c
i added name and email labels
Oussama-Mouggal Jan 16, 2026
9623540
I added black colour radio button
Oussama-Mouggal Jan 16, 2026
9e1df81
added blue colour label and button
Oussama-Mouggal Jan 16, 2026
a6cc42d
added red colour choice
Oussama-Mouggal Jan 16, 2026
8d0c5e9
added sizes choices in form of selected options
Oussama-Mouggal Jan 16, 2026
c4e28e9
added a submit button to validate name and email
Oussama-Mouggal Jan 16, 2026
2edc649
fix: label to better redability
Oussama-Mouggal Jan 17, 2026
836c8a8
remove the code from Form-control
Oussama-Mouggal Jan 17, 2026
cbbdbde
removed code
Oussama-Mouggal Jan 17, 2026
1e5d68d
Update Wireframe/index.html
Oussama-Mouggal Jan 17, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion Form-Controls/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,4 +24,4 @@ <h1>Product Pick</h1>
<h2>By HOMEWORK SOLUTION</h2>
</footer>
</body>
</html>
</html>
29 changes: 23 additions & 6 deletions Wireframe/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,23 +10,40 @@
<header>
<h1>Wireframe</h1>
<p>
This is the default, provided code and no changes have been made yet.
This is an article explaining README file, wireframe, and Git branches.
</p>
</header>
<main>
<article>
<img src="placeholder.svg" alt="" />
<h2>Title</h2>
<img src="https://markdown.land/wp-content/uploads/2022/01/VSCode-markdown-preview.png" alt="README file picture" />
<h2>What is the purpose of a README file?</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
voluptates. Quisquam, voluptates.
The purpose of a README file is to provide essential information about a project, including how to install, use, and contribute to it.
</p>
<a href="">Read more</a>
Copy link

Copilot AI Jan 17, 2026

Choose a reason for hiding this comment

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

The "Read more" links have empty href attributes. These should either point to valid URLs or use href="#" if they are placeholders. Empty href attributes can cause accessibility and usability issues.

Copilot uses AI. Check for mistakes.
</article>
<article>
<img src="https://images.edrawsoft.com/articles/wireframe/wireframe-1.jpg" alt="Wireframe picture" />
<h2>What is the purpose of a wireframe?
</h2>
<p>
The purpose of a wireframe is to provide a visual guide that represents the skeletal framework of a website or application, helping to plan layout and functionality.
</p>
<a href="">Read more</a>
Copy link

Copilot AI Jan 17, 2026

Choose a reason for hiding this comment

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

The "Read more" links have empty href attributes. These should either point to valid URLs or use href="#" if they are placeholders. Empty href attributes can cause accessibility and usability issues.

Copilot uses AI. Check for mistakes.
</article>
<article>
<img src="https://git-scm.com/images/logos/downloads/Git-Logo-2Color.png" alt="Git logo" />
<h2>What is a branch in Git?
</h2>
<p>
A branch in Git is a separate line of development that allows multiple people to work on different features or fixes simultaneously without affecting the main codebase.
</p>
<a href="">Read more</a>
Copy link

Copilot AI Jan 17, 2026

Choose a reason for hiding this comment

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

The "Read more" links have empty href attributes. These should either point to valid URLs or use href="#" if they are placeholders. Empty href attributes can cause accessibility and usability issues.

Copilot uses AI. Check for mistakes.
</article>
</main>
<footer>
<p>
This is the default, provided code and no changes have been made yet.
Codeyourfuture 2026 Wireframe Assignment
</p>
</footer>
</body>
Expand Down
4 changes: 4 additions & 0 deletions Wireframe/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,11 @@ main {
}
footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: #333;
color: white;
Comment on lines +57 to +58
Copy link

Copilot AI Jan 17, 2026

Choose a reason for hiding this comment

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

Using hardcoded color values like #333 is inconsistent with the design palette established at the top of the file. Consider using CSS custom properties (e.g., --footer-bg) to maintain consistency with the existing design system that uses variables like --paper, --ink, etc.

Copilot uses AI. Check for mistakes.
text-align: center;
}
/* ====== Articles Grid Layout ====
Expand Down
46 changes: 0 additions & 46 deletions index.html
View file
Open in desktop

This file was deleted.