totole/example
1
0
Fork 0
mirror of https://github.com/kevin-DL/example.git synced 2026-01-11 17:54:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added a navbar

Browse Source
This commit is contained in:
Kevin ANATOLE
2021-11-07 17:35:20 +00:00
parent f83ef2ccf6
commit 993bb64016
4 changed files with 44 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
css/main.css
View File

@@ -1,5 +1,6 @@
body { body {
min-height: 100vh; min-height: 100vh;
margin: 0;
} }
p { p {

25
css/navbar.css Normal file
View File

@@ -0,0 +1,25 @@
.navbar {
align-items: center;
background-color: blue;
color: white;
display: flex;
height: 3rem;
justify-content: space-between;
padding: 0 5px 0 5px;
}
.navbar .links {
padding-left: 1rem;
padding-right: 1rem;
}
.navbar .links a {
color: white;
margin: 0 1rem;
text-align: center;
text-decoration: none;
}
.navbar .links a:hover {
background-color: red;
}

9
index.html
View File

@@ -5,10 +5,19 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/main.css"> <link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" href="css/navbar.css">
<link rel="stylesheet" href="css/index.css"> <link rel="stylesheet" href="css/index.css">
<title>Document</title> <title>Document</title>
</head> </head>
<body> <body>
<nav class="navbar">
<div>Logo</div>
<div class="links">
<a href="/index.html"> Home </a>
<a href="/second_page.html"> Second </a>
</div>
<div>Auth</div>
</nav>
<h1 class="title"> Home Page </h1> <h1 class="title"> Home Page </h1>
<a href="second_page.html"> Second Page </a> <a href="second_page.html"> Second Page </a>

9
second_page.html
View File

@@ -5,10 +5,19 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/navbar.css">
<link rel="stylesheet" href="css/second.css"> <link rel="stylesheet" href="css/second.css">
<title>Document</title> <title>Document</title>
</head> </head>
<body> <body>
<nav class="navbar">
<div>Logo</div>
<div class="links">
<a href="/index.html"> Home </a>
<a href="/second_page.html"> Second </a>
</div>
<div>Auth</div>
</nav>
<h1 class="title"> Second </h1> <h1 class="title"> Second </h1>
<a href="index.html"> Home </a> <a href="index.html"> Home </a>
</body> </body>