balocchi/SAE_web
1
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🔧 fix du header et édition du css

Browse Source
This commit is contained in:
Loris BALOCCHI 2024-05-29 16:16:49 +02:00
parent 66332e29e7
commit 371d575f4e
7 changed files with 64 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/fonts/RobotoFlex.ttf Normal file
View File

Binary file not shown.

13
index.php
View File

@ -4,14 +4,14 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<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="styles/main.css" /> <link rel="stylesheet" href="/styles/main.css" />
<link rel="stylesheet" href="styles/header.css" /> <link rel="stylesheet" href="/styles/header.css" />
<link rel="stylesheet" href="styles/footer.css" /> <link rel="stylesheet" href="/styles/footer.css" />
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet" /> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet" />
<link rel="icon" type="image/png" sizes="32x32" <link rel="icon" type="image/png" sizes="32x32"
href="https://tickets.paris2024.org/obj/media/FR-Paris2024/specialLogos/favicons/favicon-32x32.png" /> href="https://tickets.paris2024.org/obj/media/FR-Paris2024/specialLogos/favicons/favicon-32x32.png" />
<title>Accueil |Jeux Olympiques - Paris 2024</title> <title>Accueil | Jeux Olympiques - Paris 2024</title>
</head> </head>
<body> <body>
@ -19,6 +19,11 @@
<!-- code de la page ici --> <!-- code de la page ici -->
<h1>Accueil</h1> <h1>Accueil</h1>
<p class="text">Bienvenue sur le site des Jeux Olympiques de Paris 2024 !</p>
<p class="text">Vous trouverez ici toutes les informations nécessaires pour suivre les Jeux Olympiques de Paris
2024.</p>
<p class="text">Vous pourrez également créer un compte pour accéder à des fonctionnalités supplémentaires.</p>
<?php include ('views/footer.php'); ?> <?php include ('views/footer.php'); ?>

4
login/index.php
View File

@ -20,8 +20,8 @@
<div class="login-container"> <div class="login-container">
<img src="https://cdn-icons-png.flaticon.com/512/4139/4139948.png" alt="Avatar"> <img src="https://cdn-icons-png.flaticon.com/512/4139/4139948.png" alt="Avatar">
<h2>Connexion à votre compte</h2> <h2 class="login-title">Connexion à votre compte</h2>
<p>Connectez-vous afin d'accéder à l'entièreté du site.</p> <p class="login-subtitle">Connectez-vous afin d'accéder à l'entièreté du site.</p>
<form> <form>
<div class="form-group"> <div class="form-group">
<label for="email">Adresse mail</label> <label for="email">Adresse mail</label>

2
register/index.php
View File

@ -53,7 +53,7 @@
<button type="submit" class="submit-button" onclick="verifMDP()"><i class="fas fa-sign-in-alt"></i> <button type="submit" class="submit-button" onclick="verifMDP()"><i class="fas fa-sign-in-alt"></i>
Créer un compte</i></button> Créer un compte</i></button>
</form> </form>
<p class="no-account">Vous avez déjà un compte ? <a href="../account">Connectez-vous !</a></p> <p class="no-account">Vous avez déjà un compte ? <a href="../login">Connectez-vous !</a></p>
</div> </div>
<?php include ('../views/footer.php'); ?> <?php include ('../views/footer.php'); ?>

7
styles/footer.css
View File

@ -1,3 +1,9 @@
@font-face {
font-family: "RobotoFlex";
src: url(../assets/fonts/RobotoFlex.ttf);
font-display: swap;
}
.site-footer { .site-footer {
background-color: #26272b; background-color: #26272b;
padding: 45px 0 20px; padding: 45px 0 20px;
@ -6,6 +12,7 @@
color: #737373; color: #737373;
opacity: 0.97; opacity: 0.97;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
font-family: RobotoFlex;
} }
.site-footer hr { .site-footer hr {
border-top-color: #bbb; border-top-color: #bbb;

13
styles/header.css
View File

@ -1,3 +1,9 @@
@font-face {
font-family: "RobotoFlex";
src: url(../assets/fonts/RobotoFlex.ttf);
font-display: swap;
}
.menu-container { .menu-container {
opacity: 0.97; opacity: 0.97;
position: relative; position: relative;
@ -12,6 +18,7 @@
user-select: none; user-select: none;
box-sizing: border-box; box-sizing: border-box;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
font-family: "RobotoFlex";
} }
.menu-logo { .menu-logo {
@ -33,6 +40,8 @@
.menu-container a:hover { .menu-container a:hover {
color: #00c6a7; color: #00c6a7;
transition: all 0.5s ease;
text-decoration: none;
} }
.menu-container input { .menu-container input {
@ -90,8 +99,8 @@
} }
.menu li { .menu li {
padding: 15px 0; margin-top: 1rem;
font-size: 22px; font-size: 21px;
} }
/* mobile styles */ /* mobile styles */

36
styles/main.css
View File

@ -1,3 +1,9 @@
@font-face {
font-family: "RobotoFlex";
src: url(../assets/fonts/RobotoFlex.ttf);
font-display: swap;
}
* { * {
outline: none; outline: none;
margin: 0; margin: 0;
@ -9,7 +15,7 @@ body {
/* backdrop-filter: blur(5px); */ /* backdrop-filter: blur(5px); */
background-size: cover; background-size: cover;
overflow-x: hidden; overflow-x: hidden;
font-family: Sans-Serif; font-family: "RobotoFlex";
margin: 0; margin: 0;
} }
body::before { body::before {
@ -19,7 +25,7 @@ body::before {
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.6);
z-index: -1; z-index: -1;
} }
.login-container { .login-container {
@ -53,6 +59,14 @@ body::before {
size: 10px; size: 10px;
} }
h2.login-title {
font-family: "RobotoFlex";
}
p.login-subtitle {
font-family: "RobotoFlex";
padding-left: 0;
}
.form-group { .form-group {
margin-bottom: 1rem; margin-bottom: 1rem;
text-align: left; text-align: left;
@ -138,3 +152,21 @@ button:hover {
.sign-up a:hover { .sign-up a:hover {
text-decoration: underline; text-decoration: underline;
} }
/* Styles généraux*/
h1 {
color: white;
font-size: 2rem;
margin-top: 1rem;
padding-left: 2rem;
text-transform: uppercase;
font-family: "RobotoFlex";
}
p.text {
color: white;
font-size: 1rem;
padding-left: 2rem;
font-family: "RobotoFlex";
}