Skip to content
Snippets Groups Projects
Commit 57d2c701 authored by LK_Clément's avatar LK_Clément
Browse files

amélioration page réserver et résult page connection

parent 8f4507ba
No related branches found
No related tags found
No related merge requests found
...@@ -10,12 +10,26 @@ ...@@ -10,12 +10,26 @@
src: url('../fonts/Inter/static/Inter-Regular.ttf'); src: url('../fonts/Inter/static/Inter-Regular.ttf');
} }
html {
background-color: #231543;
font-family: "Inter";
}
body{
background-color: #231543;
}
main { main {
position: relative;
z-index: 1;
display: flex; display: flex;
justify-content: center; justify-content: center;
margin-bottom: 7%; margin-bottom: 7%;
background-color: #ECEDFEFF;
} }
header>div{ header>div.nav-bar{
position: relative;
z-index: 1;
background-color: white; background-color: white;
width: 100%; width: 100%;
height: 5%; height: 5%;
...@@ -24,7 +38,6 @@ header>div{ ...@@ -24,7 +38,6 @@ header>div{
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
nav>a{ nav>a{
text-decoration: none; text-decoration: none;
color: #231543; color: #231543;
...@@ -61,6 +74,40 @@ nav>div>a.login-button { ...@@ -61,6 +74,40 @@ nav>div>a.login-button {
font-style: oblique; font-style: oblique;
} }
.back {
z-index: 0;
background: url(https://d2pgkmld22m7v7.cloudfront.net/assets/images/header-default.png) top right no-repeat;
background-size:contain;
position: absolute;
height:60%;
width: 100%;
left: 0;
top: 0;
}
header{
font-weight: bold;
color: white;
height: fit-content;
}
.textHeader{
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
height: 400px;
flex-direction: column;
}
.test {
display: flex;
flex-direction: column;
align-items: flex-start;
}
main{ main{
......
...@@ -9,18 +9,30 @@ ...@@ -9,18 +9,30 @@
</head> </head>
<body> <body>
<header> <header>
<div class="nav-bar"> <div class="nav-bar">
<nav> <nav>
<a class="img" href="index.html"><img src="./css/images/logoKlaxit_BBCD_Color.webp" alt="Logo Klaxit"></a> <a class="img" href="index.html"><img src="./css/images/logoKlaxit_BBCD_Color.webp" alt="Logo Klaxit"></a>
<div> <div>
<a href="index.html">ACCEUIL</a> <a href="reserver.html">PASSAGER</a>
<a href="conducteur.html">CONDUCTEUR</a> <a href="conducteur.html">CONDUCTEUR</a>
<a href="login.html" class="login-button">LOGIN</a> <a href="login.html" class="login-button">LOGIN</a>
</div> </div>
</nav> </nav>
</div> </div>
</header> <div class="back"></div>
<div class="textHeader">
<div class="test">
<h1>Réserver votre trajet avec</h1>
<h2>C'est gratuit est c'est un geste pour la planète.</h2>
<p>N'hésitez plus et réserver maintenant.</p>
</div>
</div>
</div>
</header>
<main> <main>
<div class="content"> <div class="content">
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment