Skip to content

Commit

Permalink
initial header positioning
Browse files Browse the repository at this point in the history
  • Loading branch information
ArabPixel committed Jan 23, 2025
1 parent 2bb1167 commit cbd9f54
Show file tree
Hide file tree
Showing 4 changed files with 92 additions and 0 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
.history
50 changes: 50 additions & 0 deletions css/index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
*{
margin: 0;
padding: 0;
box-sizing: border-box;
transition: all 0.3s ease;
}

html{
--background: #19329e;
}

body{
font: inherit;
background: var(--background);
}

header{
background: yellow;
display: flex;
width: 100%;
max-height: 15vh;
padding: 10px;
}
.left{
width: 50%;
display: flex;
align-items: center;
justify-content: flex-start;
gap: 20px;
}

.left img{
width: 70px;
border-radius: 50%;
}

.right{
width: 50%;
display: flex;
gap: 20px;
align-items: center;
justify-content: flex-end;
}

.right ul{
display: contents;
list-style-type: none;
}


Binary file added imgs/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
41 changes: 41 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sourceware Lab</title>
<link rel="stylesheet" href="css/index.css">
<!-- <script src="https://unpkg.com/@tailwindcss/browser@4"></script> -->
<style>
</style>
</head>
<body>
<header>
<div class="left">
<img src="imgs/logo.png" max-width="100px" alt="">
<p>Sourceware Lab</p>
</div>
<div class="right">
<ul>
<li>About us</li>
<li>Projects</li>
<li>Socials</li>
</ul>
</div>
</header>

<main>
<div id="aboutus">
<h3>Sourceware Lab</h3>
<p>Learn by doing</p>
</div>
<div id="projects">

</div>
<div id="socials">

</div>
</main>

</body>
</html>

0 comments on commit cbd9f54

Please sign in to comment.