99 lines
3 KiB
CSS
99 lines
3 KiB
CSS
/* PartirDeZero — Décos de Noël (chargées uniquement en décembre) */
|
|
|
|
/* Barre festive discrète sous la navbar */
|
|
.site-nav { position: relative; }
|
|
.site-nav::after {
|
|
content: "";
|
|
position: absolute;
|
|
left: 0; right: 0; bottom: -1px;
|
|
height: 4px;
|
|
background: repeating-linear-gradient(45deg,
|
|
#d61c4e 0 12px,
|
|
#1b8f3a 12px 24px,
|
|
#ffffff 24px 36px);
|
|
opacity: .55;
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Emoji sapin à côté du titre */
|
|
.pdz-festive-emoji {
|
|
margin-left: .35rem;
|
|
filter: drop-shadow(0 1px 0 rgba(0,0,0,.2));
|
|
}
|
|
|
|
/* Overlay neige — ultra léger, non bloquant */
|
|
.pdz-snow {
|
|
position: fixed;
|
|
inset: 0;
|
|
pointer-events: none;
|
|
z-index: 5; /* au-dessus du fond, sous les modales si existantes */
|
|
background-image:
|
|
radial-gradient(2px 2px at 20px 30px, rgba(255,255,255,.9) 50%, rgba(255,255,255,0) 51%),
|
|
radial-gradient(3px 3px at 80px 120px, rgba(255,255,255,.8) 50%, rgba(255,255,255,0) 51%),
|
|
radial-gradient(2px 2px at 150px 80px, rgba(255,255,255,.85) 50%, rgba(255,255,255,0) 51%),
|
|
radial-gradient(3px 3px at 250px 20px, rgba(255,255,255,.8) 50%, rgba(255,255,255,0) 51%);
|
|
background-repeat: repeat;
|
|
background-size: 300px 200px, 400px 300px, 350px 250px, 500px 400px;
|
|
animation: pdzSnowFall 18s linear infinite;
|
|
}
|
|
|
|
/* Plusieurs couches pour un effet de profondeur via parallax */
|
|
.pdz-snow::before,
|
|
.pdz-snow::after {
|
|
content: "";
|
|
position: absolute; inset: 0;
|
|
background-image:
|
|
radial-gradient(2px 2px at 40px 60px, rgba(255,255,255,.8) 50%, rgba(255,255,255,0) 51%),
|
|
radial-gradient(3px 3px at 120px 200px, rgba(255,255,255,.75) 50%, rgba(255,255,255,0) 51%),
|
|
radial-gradient(2px 2px at 220px 160px, rgba(255,255,255,.8) 50%, rgba(255,255,255,0) 51%);
|
|
background-repeat: repeat;
|
|
}
|
|
.pdz-snow::before {
|
|
background-size: 260px 180px, 380px 280px, 320px 220px;
|
|
animation: pdzSnowFallSlow 28s linear infinite;
|
|
}
|
|
.pdz-snow::after {
|
|
background-size: 200px 140px, 300px 220px, 260px 200px;
|
|
animation: pdzSnowFallFast 12s linear infinite;
|
|
}
|
|
|
|
@keyframes pdzSnowFall {
|
|
from { transform: translateY(-10%); }
|
|
to { transform: translateY(100%); }
|
|
}
|
|
@keyframes pdzSnowFallSlow {
|
|
from { transform: translateY(-10%); }
|
|
to { transform: translateY(100%); }
|
|
}
|
|
@keyframes pdzSnowFallFast {
|
|
from { transform: translateY(-10%); }
|
|
to { transform: translateY(100%); }
|
|
}
|
|
|
|
/* Respect des préférences d'accessibilité */
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.pdz-snow, .pdz-snow::before, .pdz-snow::after { animation: none; }
|
|
}
|
|
|
|
/* ——— Footer: petite touche festive discrète ——— */
|
|
footer.pdz-xmas { position: relative; }
|
|
footer.pdz-xmas::before {
|
|
content: "";
|
|
position: absolute;
|
|
left: 0; right: 0; top: 0;
|
|
height: 4px;
|
|
background: repeating-linear-gradient(45deg,
|
|
#d61c4e 0 12px,
|
|
#1b8f3a 12px 24px,
|
|
#ffffff 24px 36px);
|
|
opacity: .55;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.footer-legal .pdz-holiday-greeting {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: .35rem;
|
|
color: var(--fg);
|
|
font-weight: 500;
|
|
}
|