Skip to content

ITP-JAN | ALIZIWE_NGOMA | MODULE-ONBOARDING | WEEK1 #256

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
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

ITP-JAN | ALIZIWE_NGOMA | MODULE-ONBOARDING | WEEK1 #256

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d077e79
the purpose of a read.me file
Aliziwe Feb 8, 2025
66417c3
what is a branch
Aliziwe Feb 8, 2025
8484bc7
form controls
Aliziwe Feb 8, 2025
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
41 changes: 35 additions & 6 deletions Form-Controls/index.html
View file
Open in desktop
Copy link

Choose a reason for hiding this comment

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

I think this is okay, good job!

Original file line number Diff line number Diff line change
Expand Up @@ -13,15 +13,44 @@ <h1>Product Pick</h1>
</header>
<main>
<form>
<!-- write your html here-->
<!--
try writing out the requirements first as comments
this will also help you fill in your PR message later-->
</form>
<!-- Customer Name -->
<label for="name">Full Name:</label>
<input type="text" id="name" name="name" required pattern="[A-Za-z ]{2,50}" title="Name must be between 2 and 50 characters and contain only letters and spaces.">
<br><br>

<!-- Customer Email -->
<label for="email">Email Address:</label>
<input type="email" id="email" name="email" required>
<br><br>

<!-- T-Shirt Colour -->
<label for="color">Choose a T-Shirt Colour:</label>
<select id="color" name="color" required>
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="black">Black</option>
</select>
<br><br>

<!-- T-Shirt Size -->
<label for="size">Choose a Size:</label>
<select id="size" name="size" required>
<option value="XS">XS</option>
<option value="S">S</option>
<option value="M">M</option>
<option value="L">L</option>
<option value="XL">XL</option>
<option value="XXL">XXL</option>
</select>
<br><br>

<!-- Submit Button -->
<button type="submit">Submit Order</button>
</form>
</main>
<footer>
<!-- change to your name-->
<h2>By HOMEWORK SOLUTION</h2>
<h2>By Aliziwe Ngoma</h2>
</footer>
</body>
</html>
24 changes: 21 additions & 3 deletions Wireframe/index.html
View file
Open in desktop
Copy link

@A-O-Emmanuel A-O-Emmanuel Feb 26, 2025 •
edited
Loading

Choose a reason for hiding this comment

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

I think you should take another look at the wireframe, the page title and description should be centered and the footer also needs to be centered. you also need to work on your indentation and spacing please look at this article: How to indent your HTML code and why it's important

Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,31 @@ <h1>Wireframe</h1>
This is the default, provided code and no changes have been made yet.
</p>
</header>

<main>
<article>
<img src="placeholder.svg" alt="" />
<h2>Title</h2>
<h2>The purpose of a README file</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
voluptates. Quisquam, voluptates.
A README file serves as the first point of reference for anyone interacting with a project, providing essential information such as its purpose, setup instructions, and usage guidelines. Typically written in Markdown (README.md), it helps users understand what the project does, how to install dependencies, and how to contribute. It may also include licensing information, credits, and troubleshooting tips. A well-written README enhances a project's accessibility, making it easier for developers, collaborators, and even end users to navigate and understand the codebase.
</p>
<a href="">Read more</a>
</article>

<article>

<img src="placeholder.svg" alt="" />
<h2>The purpose of a wireframe</h2>
<p>
A wireframe is a visual blueprint that outlines the structure and layout of a digital interface, such as a website or mobile application. It is typically a low-fidelity representation that focuses on functionality, content placement, and user flow rather than aesthetics. Designers and developers use wireframes to plan interactions, ensure usability, and gather feedback early in the development process. By providing a clear visual guide, wireframes help teams align on design expectations, reduce development time, and create a user-friendly experience before moving on to high-fidelity prototypes and final designs.
</p>
<a href="">Read more</a>
</article>
<article>
<img src="placeholder.svg" alt="" />
<h2> What is a branch in Git</h2>
<p>
A branch in Git is an independent version of a repository that allows multiple developers to work on different features, fixes, or experiments without affecting the main codebase. Branching enables parallel development, meaning teams can work on new features while maintaining a stable production version. The most common branch in a project is main or master, but additional branches can be created for specific tasks, such as feature-login or bugfix-header. Developers can later merge these branches back into the main branch after code review and testing. This workflow ensures a smooth, organized, and collaborative development process.
</p>
<a href="">Read more</a>
</article>
Expand Down