le login mais bon le rond dépasse

This commit is contained in:
Chloé Leroux
2022-12-27 20:32:45 +01:00
parent 019cfab42e
commit e311f52c27
4 changed files with 100 additions and 5 deletions

View File

@@ -68,9 +68,6 @@ body {
background-color: #FC5200;
padding : 0;
position: absolute;
top : 7vh;
left:-7vh;
right:-13vh;
border-radius:40vh;
display : flex;
flex-direction:column;
@@ -78,6 +75,9 @@ body {
justify-content: center;
overflow:hidden;
z-index:10;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.milieu p {

50
public/css/login.css Normal file
View File

@@ -0,0 +1,50 @@
#accountAuthButton img {
height:96px;
}
body {
background-color: #F4F3EB;
overflow:hidden;
position:relative;
width:100vw;
max-width: 100vw;
}
main {
overflow: hidden;
}
#bienvenue {
margin-top : 45vh;
padding:5vw;
font-size:40px;
}
#bienvenue>p {
text-align: justify;
font-size: 50px;
}
#voir-conditions {
color:rgba(0, 0, 0, 0.479);
text-decoration:underline;
}
#bienvenue form {
margin-top : 5vw;
}
#bienvenue form {
display :flex;
align-items: center;
}
#bienvenue form input {
width:50px;
height:50px;
border-radius:100%;
margin-right : 1vh;
accent-color : #FC5200;
}

View File

@@ -8,7 +8,7 @@
body {
margin:0;
font-family: Karla;
max-height:100vh;
max-height:100vw;
height:100vh;
background-color: rgb(0, 0, 0);
}
@@ -112,4 +112,23 @@ h2 {
.nombre-sm{
font-size:60px;
margin:0;
}
.bulle {
height:60vh;
width:60vh;
text-align: center;
background-color: #FC5200;
padding : 0;
position: absolute;
border-radius:40vh;
display : flex;
flex-direction:column;
align-items: center;
justify-content: center;
overflow:hidden;
z-index:10;
top: 10vh;
left: 50%;
transform: translate(-50%,-50%);
}

View File

@@ -4,8 +4,34 @@
<meta charset="UTF-8">
<title>Connexion</title>
<script src="login.js" defer></script>
<link rel="stylesheet" href="./css/style.css" type="text/css">
<link rel="stylesheet" href="./css/login.css" type="text/css">
</head>
<body>
<a id="accountAuthButton" href="">Connexion</a>
<main>
<div class="bulle">
<p>20</p>
<p>L'ANNEE SPORTIVE</p>
<p>22</p>
</div>
<section id="bienvenue">
<p>
Bienvenue sur Strava Year in Sport Free !
Ce site nest pas à vocation commerciale, il sagit dun projet étudiant qui na pas pour but de concurrencer Strava.
Cest pour quoi nous vous invitons à lire les conditions dutilisation. Votre Strava Year in Sport ne pourra pas être créé sans votre accord.
</p>
<a id="voir-conditions" href="">Voir les conditions d'utilisations</a>
<form>
<input type="radio" id="conditions">
<label id="conditions">J'accepte les conditions d'utilisations</label>
</form>
</section>
<a id="accountAuthButton" href="">
<img src="./images/btn_strava_connectwith_orange.svg" alt="Bouton de connexion Strava">
</a>
</main>
</body>
</html>