Ladebeze66/ft_transcendence
1
0
Fork 0
mirror of https://github.com/AudebertAdrien/ft_transcendence.git synced 2026-02-04 11:40:25 +01:00
Code Issues Packages Projects Releases Wiki Activity

better css for burger buton

Browse Source
This commit is contained in:
Theouche 2024-08-05 17:54:21 +02:00
parent 180aa83c5c
commit 0e8d76ea25
2 changed files with 36 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pong/game/views.py
View File

@ -87,7 +87,7 @@ def tournoi_list(request):
from django.http import JsonResponse from django.http import JsonResponse
def match_list_json(request): def match_list_json(request):
matches = Match.objects.select_related('player1', 'player2', 'winner', 'tournoi').all() matches = Match.objects.all()
data = { data = {
'matches': list(matches.values( 'matches': list(matches.values(
'id', 'player1__name', 'player2__name', 'score_player1', 'score_player2', 'id', 'player1__name', 'player2__name', 'score_player1', 'score_player2',

49
pong/static/styles.css
View File

@ -253,39 +253,60 @@ button:hover {
max-width: 80%; max-width: 80%;
} }
/* Styles pour la barre de navigation */
.navbar { .navbar {
position: absolute; position: absolute; /* Positionne la barre de navigation relativement à son conteneur */
top: 0; top: 10px; /* Ajuste la position du menu déroulant par rapport au haut */
right: 0; right: 10px; /* Ajuste la position du menu déroulant par rapport à la droite */
padding: 10px; padding: 10px;
} }
/* Styles pour le bouton du menu burger */
.burger-menu { .burger-menu {
font-size: 24px; font-size: 24px;
background: none; background: none;
border: none; border: none;
color: white; color: #00ffff; /* Couleur du texte du bouton */
cursor: pointer; cursor: pointer;
transition: color 0.3s ease;
} }
.burger-menu:hover {
color: #ffffff; /* Couleur du texte au survol */
}
/* Styles pour le menu déroulant */
.dropdown-content { .dropdown-content {
display: none; display: none;
position: absolute; position: absolute;
right: 0; top: 100%; /* Positionne le menu directement sous le bouton */
background-color: #f9f9f9; right: 0; /* Aligne le menu avec le bouton */
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); margin-top: 10px; /* Espace entre le bouton et le menu */
background-color: #1a1a2e; /* Couleur de fond du menu */
color: #ffffff; /* Couleur du texte du menu */
box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.3);
border-radius: 5px;
z-index: 1; z-index: 1;
width: max-content; /* Ajuste la largeur du menu en fonction du contenu */
} }
.dropdown-content a { /* Affiche le menu déroulant lorsqu'il est actif */
color: black; .dropdown-content.show {
padding: 12px 16px;
text-decoration: none;
display: block; display: block;
} }
.dropdown-content a:hover { /* Styles pour les liens du menu déroulant */
background-color: #f1f1f1; .dropdown-content a {
color: #ffffff; /* Couleur du texte des liens */
padding: 12px 16px;
text-decoration: none;
display: block;
border-bottom: 1px solid rgba(255, 255, 255, 0.2); /* Ligne de séparation entre les éléments */
transition: background-color 0.3s ease; /* Transition pour le fond au survol */
} }
.show {display: block;} /* Styles pour les liens au survol */
.dropdown-content a:hover {
background-color: #333; /* Couleur de fond au survol */
color: #00ffff; /* Couleur du texte au survol */
}