Skip to content
This repository was archived by the owner on Apr 18, 2025. It is now read-only.

Nw6|Ayman model-html-css #185

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
55 changes: 52 additions & 3 deletions Cakes-Co/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,61 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css">
<title>Responsive Cake webpage</title>
<!-- Add a link to your css file here -->
</head>

<body>
<!-- Add your markup here -->
</body>
<img src="/cakeyet.jpg"alt="logo" width="30px">
<p1> The best cake in town deliver to your door</p1>
<nav class="navbar">
<div >

<a href="#"class="threeline">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</a>
<ul><a href="#">Home</a></li>
<li><a href="#">Cakes</a></li>
<li><a href="#">Order</a></li>
<li><a href="#">Lessons</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
</nav>
<div class="menu"></div>
<div class="menu"></div>
<div class="menu"></div>
<div class="content1">
<div class="title">
<div class="image0">
<img src="/cake0.jpeg" alt="cake" width="70%">
</div>
<h1> Welcome </h1>
<p> Try test our cakes we have the best cakes in city Ours cake is crispy by cookie's <br>
Softness malty in mouth that fall in love with cakes.<br>
we also provide cake for weeding , birthday and occasion. </p>
<div class="title">

<div class="box1">
<img src="/cake.jpeg" alt="cake" width="50px">
</div>
<div class="box1">
<img src="/cake (1).jpeg"alt="cake"width="50px">
</div>
<div class="box1" >
<img src="/cake3.jpeg">
</div>
<div class="box4">
<img src="/cake4.jpeg">
</div>

<button>Visit us</button>

</div>
</div>
</div>
</section>
</body>
</html>
61 changes: 61 additions & 0 deletions Cakes-Co/style.css
Original file line number Diff line number Diff line change
@@ -1 +1,62 @@
/* Add your styling here */
* {
margin: 0px;
padding: 0px;
}
body {
color: rgba(14, 12, 12, 0.785);
}
.navbar ul {
list-style: none;
text-decoration: none;
}
.navbar ul {
display: flex;
justify-content: space-around;
align-items: center;
font-size: 15px;
background-color: gray;
color: white;
}
header{
background-color: orangered
}
img {
width: 70px;
margin-bottom: 20px;
}


h1,p{
margin-left: 100px;
margin-bottom:20px;
}
.box1{
width: 150px;
float: left;
}
.threeline{
position:absolute;
top: 75rem;
right: 1rem;
display: none;
flex-direction: column;
justify-content: space-around;
width: 30px;
height: 20px;

}
.threeline .navbar{
height: 3px;
width: 100px;
background-color:white;
border-radius: 10px;

}







52 changes: 45 additions & 7 deletions Form-Controls/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,26 +3,64 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My form exercise</title>
<meta name="description" content="">
<meta name="description" content="form Product">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
</head>
<title> from application </title>
<body>
<from action="results.html" method="Get">
<header>
<h1>Product Pick</h1>
<p> We are providing pick up services with our partnership across UK. <br> or local store open from 8:30 to8:30pm.
</header>
<main>
<form>
<div class="n1">
<label class="text">Name</label>
<input type="text" id="name">
</div>
<div class="email2">
<label for="email">Email</label>
<input class="email" name="email" id="email"required>
</div>
<div class="date3">
<label class="date">Date </label>
<input type="date"name= date id="date" max="2023-11-14">
</div>
<div>
<label for="options">Choose one of the following:</label>
<select id="options" name="options">
<option value="red">Red </option>
<option value="Yellow">Yellow</option>
<option value="Green">Green</option>
</select>
</div>
<div class="size1">
<label for="size">Select Size:</label>
<select id="size" name="size">
<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>
</div>
<div class="sumt4">
<button>Submit</button>
</div>
<h2> Customer services policy</h2>
<p> We expect your delivery will arrive on time and in good condition. if you would preferring to track your order <br>
in real-time and receive timely updates on the status of ours deliveries. Convenience plays a crucial role, with customers<br>
preferring various delivery options, including same-day, next-day, and scheduled. </p>
<!-- write your html here-->
<!-- try writing out the requirements first-->
</form>

</main>
<footer>
<!-- change to your name-->
<h2>By HOMEWORK SOLUTION</h2>
<p> Aym Abdullah <br>
<a href="products90@.com">Products90@.com</a></p>
</footer>
</form>
</body>

</html>
33 changes: 33 additions & 0 deletions Form-Controls/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
*{
margin-top: 0px;
margin-bottom: 0px;
}

.body{
font-family: 'Courier New', Courier, monospace;
font-size: 20px;

}
.n1{
margin-bottom: px;
padding-bottom: 10px;
}
h1,p {
font-size: 20px;
padding-bottom: 15px;

}
.email2{
padding-bottom: 10px;
font-size: 20px;
}
.date3{
padding-bottom: 10px;
font-size: 20px;
}
.sumt4{
padding-bottom: 5px;
}
.size1{
padding-bottom: 5px;
}
16 changes: 16 additions & 0 deletions Wireframe/css/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
img {
display: block;
margin-left: auto;
margin-right: auto;
}
.full-content {
display: none;
}

.read-more {
background-color: #00d9b5;
color: #fff;
border: none;
padding: 10px 10px;
cursor: pointer;
}
28 changes: 27 additions & 1 deletion Wireframe/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,32 @@
</head>
<body>
<!-- Add your HTML markup here -->
<h2>Why is git</h2>
<p1> git is distributed version control system that is widely used for tracking changes in source code during software development.
<img src="/github1.png" alt="git" style="width: 50%;">

</p1>
<h2> Why developer need Need Github</h2>
<p> developer need for variety of reason, as it provide a platform for collaborative software <br>development, version control, project management, and
more.
Here are some key reasons why developers need GitHub:
<ul>
<li>Version Control is primarily know for its robust version control system, based on Git.</li>
<li>Collaboration GitHub provides a platform collaborative width other, roll back to pervious over time,<br> make easy to collaborate with other.</li>
<li>Code Hosting: GitHub hosts your code in the cloud, eliminating the need for developers manage their own<br> infrastructure for code storage.</li>
</ul> </p>
<h3> What is a branch in Git?</h3>
<p3> a "branch" is a parallel version of a repository's codebase. It allows multiple people to work on different aspects of
a project simultaneously without interfering with each other's work. Branches are a fundamental concept in Git, the version control system
that GitHub is built os </p3>
<img src="/branch.png" alt="branch" style="width:50%">

<!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc -->

<div class="content">
<div class="excerpt">
<div class="button">
<button class="read-more">Read More</button>
</div>
</body>
</html
</html>