Add right side of the header (#2)

This commit is contained in:
Avijit Gupta
2021-05-25 20:39:45 +02:00
committed by GitHub
parent 32cebad21a
commit 7d296350a2
3 changed files with 44 additions and 19 deletions

View File

@@ -1,6 +1,7 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/css/main.css">
<script src="/js/jquery-3.6.0.slim.min.js"></script>
<script src="/js/main.js"></script>

View File

@@ -12,6 +12,24 @@
<a class="nav-brand" href="https://example.com">Title title</a>
</div>
<div class="nav-links">
<div class="nav-link">
<a href="http://example.com">Home</a>
</div>
<div class="nav-link">
<a href="http://example.com">Projects</a>
</div>
<div class="nav-link icon">
<a href="http://example.com">
<i class="fab fa-github"></i>
</a>
</div>
<div class="nav-link icon">
<a href="http://example.com">
<i class="fab fa-linkedin"></i>
</a>
</div>
</div>
</nav>
</div>
</div>

View File

@@ -33,24 +33,6 @@ html {
height: 70px;
}
/* #header-sroll h1 {
font-size: 30px;
font-family: Arial;
text-align: center;
line-height: 50px;
-ms-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
#header-sroll.small h1{
height: 70px;
line-height: 35px;
font-size: 25px;
}
*/
.header a {
text-decoration: none;
color: inherit;
@@ -72,7 +54,8 @@ html {
.header-nav .avatar {
float: left;
display: inline-block;
/* display: inline-block; */
margin-left: 15px;
height: 100%;
border: 0.5px solid white;
border-radius: 18px;
@@ -96,3 +79,26 @@ html {
height: 50px;
font-size: 20px;
}
.header-nav .nav-links {
line-height: 50px;
float: right;
margin-right: 15px;
}
.nav-links .nav-link {
display: inline-block;
}
.nav-links .nav-link a {
display: block;
padding: 0 15px;
}
.nav-links .nav-link.icon a {
padding: 0 8px;
}
.fab {
font-family: FontAwesome !important;
}