Skip to content
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.

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

CYF-London | seerat junaid | Module-User-Focused-Data | Week 1 #313

Closed
Closed
Show file tree
Hide file tree
Changes from 3 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
2 changes: 1 addition & 1 deletion Cakes-Co/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
<!-- main -->
<main>
<section class="p-sec">
<h1>Welcome</h1>
<h1>Welcome fatima</h1>
<p>
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Quae
voluptatem accusantium, necessitatibus cum accusamus, id cumque harum
Expand Down
86 changes: 86 additions & 0 deletions Wireframe/css/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
main{
justify-content: center;
display: grid;
}
h1{
width: auto;
display: flex;
justify-content: center;
font-size:xx-large;

}
p{
display: flex;
font-weight: lighter;
justify-content: center;
font-size: larger;
padding: 0px;
}
.git{
flex-wrap: wrap;
width: 900px;
height: 500px;
border: 2px black solid;
margin:20px 300px ;
}
.git article:first-child {
background-color: #f0f0f0;
padding: 10px;
border-radius: 5px;
}

.logo{

margin:auto;
height:250px;
padding:30px;
}
.merge{
display: flex;
justify-content: center;
flex-direction: row;
}
.developer,.branch
{
display: inline-flex;
flex-direction: column;
border: 2px black solid;
margin:10px ;
height: 500px;
width: 420px;
padding: 10px 10px;
justify-content: flex-end;
background-color: #f0f0f0;
}
.pic,.dev{
display: flex;
justify-content: center;
height: 250px;
width: 400px;
margin:10px;
}
.foot{
border: 1px black solid;
display: flex;
justify-content: space-around;
}
footer {
border: 1px black solid;
display: flex;
justify-content: space-around;
padding: 10px;
position: fixed;
bottom: 0;
width: 100%;
background-color: #f9f9f9;}
button {
background-color: #333;
color: #fff;
border: none;
padding: 10px 20px;
cursor: pointer;
}

button:hover {
background-color: #555;
}
52 changes: 46 additions & 6 deletions Wireframe/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,51 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Wireframe</title>
<link rel="stylesheet" href="style.css">
<title>wireframe</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<!-- Add your HTML markup here -->
<!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc -->
</body>
</html
<header>
<h1>git</h1>
<p>distributed-even-if-your-workflow-is'nt</p>
</header>
<main>
<div class="git">
<article>
<img src="https://git-scm.com/images/logo@2x.png"class="logo"alt="picture of git">
<h2>What is Git?</h2>
<p>Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency.</p>
<a href="https://git-scm.com/"> <button> Read More</button></a>
</article>
</div>
<div class= "merge">
<div class="developer">
<article>
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTdCI04wfV2rcwpHP7GI1C95iq_eHzI6sZIyQ&s"class="dev"alt="picture of task tracking system ">
<h2>Why do developers need Git?</h2>
<p>Git is all about efficiency. For developers, it eliminates everything from the time wasted passing commits over a network connection to the man hours required to integrate changes in a centralized version control system. </p>
<a href="https://careerfoundry.com/en/blog/web-development/what-do-developers-use-github-for-heres-why-its-vital/"> <button> Read More</button></a>
</article>
</div>
<div class=" branch">
<article>

<img src="https://wac-cdn.atlassian.com/dam/jcr:a905ddfd-973a-452a-a4ae-f1dd65430027/01%20Git%20branch.svg?cdnVersion=2393" class="pic"alt="picture of git branch">
<h2>What is a branch in Git?
</h2>
<p>Git branches are effectively a pointer to a snapshot of your changes. When you want to add a new feature or fix a bug—no matter how big or how small—you spawn a new branch to encapsulate your changes..</p>
<a href="https://www.atlassian.com/git/tutorials/using-branches#:~:text=Git%20branches%20are%20effectively%20a,branch%20to%20encapsulate%20your%20changes."> <button> Read More</button></a>

</article>
</div>
</div>
</main>
<footer >
<div class="foot">
<p>seerat fatima</p>
<p><a href="https://github.com/">GitHub</a></p>
Copy link

@giorgigutsaevi giorgigutsaevi Nov 8, 2024

Choose a reason for hiding this comment

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

Just a slight nitpick here, but if you use just the anchor tag <a> here, you could technically remove the surrounding <p> from around it. More precisely, it's not a necessity to wrap all your anchor tags in paragraph tags in HTML.

</div>
</footer>

</body>
</html>