Finition Section "Compte"

This commit is contained in:
Joshua 2024-11-21 16:21:37 +01:00
parent cbc2d65041
commit 106d4226e6
10 changed files with 10 additions and 161 deletions

View File

@ -1,152 +0,0 @@
.top-bar {
background-color: #db5559;
width: calc(100% - 18%); /*Calcule la totalité de l'écran - le left-background */
height: 60px;
position: fixed;
top: 0;
left: 18%; /*Evite le chauvechement des 2 bars */
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20px;
color: white;
font-size: 18px;
box-sizing: border-box; /* Inclut le padding dans la largeur totale */
}
.user-role {
background-color: white;
color: black;
padding: 10px 15px;
font-weight: bold;
overflow: hidden;
}
.left-background {
background-color: #db5559;
width: 18%;
height: 100%;
position: fixed;
top: 0;
left: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.index-title-page {
color: #FFFFFF;
font-size: 60px;
padding-bottom: 10px;
font-family: 'Brittany Signature', sans-serif;
}
ul {
list-style-type: none;
padding: 0;
}
li {
padding-bottom: 30px;
}
.btn-custom {
background-color: #FFFFFF;
color: black;
padding: 15px 40px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
display: inline-block;
border-right: 5px solid #db5559;
border-left: 5px solid #db5559;
}
.btn-custom:hover, .btn-info-compte:hover, .btn-info-exit:hover {
background-color: #f8b5b5;
color: #FFFFFF;
}
.icon-medium {
width: 25px;
height: 25px;
}
.icon-container {
display: flex;
align-items: center;
gap: 10px;
}
.Information-perso {
display: flex;
justify-content: space-between;
padding: 20px;
margin-top: auto;
}
.btn-info-compte, .btn-info-exit {
background-color: #FFFFFF;
color: black;
padding: 10px 20px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
border: 1px solid black;
}
.btn-info-compte {
width: 50%;
height: 30px;
}
.btn-info-exit {
width: 10%;
height: 30px;
}
/* Style pour la modal (cachée par défaut) */
.modal {
display: none; /* Masquée par défaut */
position: fixed;
z-index: 1; /* Au-dessus du contenu normal */
left: 18%; /* Commence juste après ton left-background */
top: 0;
width: 82%; /* Prend le reste de la largeur après le left-background */
height: 100%; /* Prend toute la hauteur de l'écran */
background-color: rgba(0, 0, 0, 0.4); /* Couleur d'arrière-plan avec transparence */
overflow: auto; /* Permet le défilement si le contenu dépasse */
}
/* Contenu de la modal */
.modal-content {
background-color: white;
margin: 5% auto; /* Centrage vertical */
padding: 20px;
border: 1px solid black;
width: 80%; /* Largeur du contenu de la modal */
height: 80%; /* Hauteur du contenu de la modal */
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}
/* Bouton de fermeture */
.close {
color: black;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: red;
cursor: pointer;
}

View File

@ -18,7 +18,7 @@ class LoginController extends AbstractController
// last username entered by the user
$lastUsername = $authenticationUtils->getLastUsername();
return $this->render('login/gestion.html.twig', ['last_username' => $lastUsername, 'error' => $error]);
return $this->render('login/index.html.twig', ['last_username' => $lastUsername, 'error' => $error]);
}

View File

@ -10,8 +10,9 @@
{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/modal.css') }}"> <!-- Ajout du fichier CSS -->
<link rel="stylesheet" href="{{ asset('css/compte/index.css') }}"> <!-- Ajout du fichier CSS -->
<link rel="stylesheet" href="{{ asset('css/Index/index.css') }}"> <!-- Ajout du fichier CSS -->
<link rel="stylesheet" href="{{ asset('css/Compte/index.css') }}"> <!-- Ajout du fichier CSS -->
<link rel="stylesheet" href="{{ asset('css/Compte/GestionUser.css') }}"> <!-- Ajout du fichier CSS -->
{% endblock %}
{% block body %}
@ -130,5 +131,5 @@
{% endblock %}
{% block javascripts %}
<script src="{{ asset('js/test.js') }}" defer></script>
<script src="{{ asset('js/Compte/CompteModal.js') }}" defer></script>
{% endblock %}

View File

@ -10,7 +10,7 @@
{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/Index.css') }}"> <!-- Ajout du fichier CSS -->
<link rel="stylesheet" href="{{ asset('css/index.css') }}"> <!-- Ajout du fichier CSS -->
<link rel="stylesheet" href="{{ asset('css/GestionUser.css') }}"> <!-- Ajout du fichier CSS -->
{% endblock %}
@ -84,7 +84,7 @@
</div>
<script>
document.querySelector('.btn-info-compte').addEventListener('click', function(event) {
document.querySelector('.btn-info-Compte').addEventListener('click', function(event) {
event.preventDefault();
const contentContainer = document.getElementById('container-gestion-user');

View File

@ -10,7 +10,7 @@
{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/modal.css') }}"> <!-- Ajout du fichier CSS -->
<link rel="stylesheet" href="{{ asset('css/index.css') }}"> <!-- Ajout du fichier CSS -->
{% endblock %}
{% block body %}
@ -103,7 +103,7 @@
</div>
<script>
document.querySelector('.btn-info-compte').addEventListener('click', function(event) {
document.querySelector('.btn-info-Compte').addEventListener('click', function(event) {
event.preventDefault();
const contentContainer = document.getElementById('container-gestion-user');

View File

@ -34,5 +34,5 @@
{% endblock %}
{% block javascripts %}
<script src="{{ asset('js/test.js') }}" defer></script>
<script src="{{ asset('js/Compte/CompteModal.js') }}" defer></script>
{% endblock %}