Whykioh/main-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix css

Browse Source
This commit is contained in:
Noah CIBOT NOËL
2026-03-03 19:56:57 +01:00
parent 3458aeb1f7
commit bd9fe12c8b
1 changed files with 59 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
poker-paf/game.css
+59 -24
View File
@@ -429,57 +429,92 @@ button.btn-back {
/* --- PANEL DE VICTOIRE --- */ /* --- PANEL DE VICTOIRE --- */
/* Conteneur principal en overlay */ /* Conteneur principal en overlay */
/* --- PANEL DE VICTOIRE --- */
.win-panel { .win-panel {
position: absolute; /* Se place par rapport au table-container */ position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); /* Centrage parfait */ transform: translate(-50%, -50%);
width: 90%; width: 90%;
max-width: 450px; max-width: 500px;
background: rgba(20, 20, 20, 0.98); /* Fond très sombre */ background: rgba(18, 18, 18, 0.95); /* Fond sombre semi-transparent */
border: 4px solid #d4af37; /* Bordure dorée */ border: 5px solid #d4af37; /* Bordure dorée */
border-radius: 20px; border-radius: 20px;
padding: 30px; padding: 30px;
text-align: center; text-align: center;
z-index: 2000; /* Assure d'être au-dessus de tout */ z-index: 1000; /* Par-dessus tout */
box-shadow: 0 0 50px rgba(0, 0, 0, 0.9), 0 0 20px rgba(212, 175, 55, 0.3); box-shadow: 0 0 50px rgba(0, 0, 0, 0.8), 0 0 20px rgba(212, 175, 55, 0.4);
animation: popIn 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); animation: fadeInScale 0.4s ease-out;
} }
/* Titre du panel */
.win-panel h2 { .win-panel h2 {
color: #d4af37; color: #d4af37;
margin-bottom: 20px; font-size: 1.8rem;
font-size: 1.5rem; margin-bottom: 25px;
text-transform: uppercase; text-transform: uppercase;
text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
} }
/* Boutons de sélection du gagnant */ /* Boutons de sélection des joueurs (Qui a gagné ?) */
.btn-win { .btn-win {
display: block; display: inline-block;
width: 100%; width: 80%;
margin: 10px 0; margin: 8px 0;
padding: 12px; padding: 12px;
background: #1a4a31; background: linear-gradient(135deg, #1a4a31 0%, #0e5d32 100%);
color: white; color: white;
border: 2px solid #d4af37; border: 2px solid #d4af37;
border-radius: 8px; border-radius: 10px;
font-weight: bold; font-weight: bold;
cursor: pointer; cursor: pointer;
transition: 0.3s; transition: all 0.2s;
} }
.btn-win:hover { .btn-win:hover {
transform: scale(1.05);
background: #d4af37; background: #d4af37;
color: #1a4a31; color: #1a4a31;
transform: scale(1.02);
} }
/* Animation d'apparition */ /* Bouton Rejouer / Retour Accueil */
@keyframes popIn { .btn-replay, .btn-back {
from { opacity: 0; transform: translate(-50%, -60%) scale(0.5); } margin: 15px 5px;
to { opacity: 1; transform: translate(-50%, -50%) scale(1); } padding: 12px 25px;
border-radius: 30px;
border: none;
font-weight: bold;
cursor: pointer;
text-transform: uppercase;
transition: transform 0.2s;
}
.btn-replay {
background: linear-gradient(135deg, #d4af37 0%, #f9e27d 100%);
color: #3e2723;
box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3);
}
.btn-back {
background: #3e2723;
color: #d4af37;
border: 1px solid #d4af37;
}
.btn-replay:hover, .btn-back:hover {
transform: translateY(-3px);
filter: brightness(1.2);
}
/* Petite animation d'entrée */
@keyframes fadeInScale {
from {
opacity: 0;
transform: translate(-50%, -60%) scale(0.8);
}
to {
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
} }
/* --- ADAPTATION MOBILE --- */ /* --- ADAPTATION MOBILE --- */