Adjustments to lightbox CSS

This commit is contained in:
Brian Fertig 2026-04-11 13:52:24 -06:00
parent cae84f6966
commit 26a4bc1a99
1 changed files with 15 additions and 5 deletions

View File

@ -588,17 +588,27 @@ a.detail-creator-card:hover {
#lb-overlay {
display: none;
position: fixed; inset: 0;
background: rgba(0,0,0,0);
background: transparent;
z-index: 3000;
align-items: center; justify-content: center;
cursor: zoom-out;
}
#lb-overlay.lb-open {
display: flex;
animation: lb-fade-in 0.22s ease forwards;
animation: lb-fade-in-synthwave 0.22s ease forwards;
}
#lb-overlay.lb-closing {
animation: lb-fade-out 0.2s ease forwards;
animation: lb-fade-out-synthwave 0.2s ease forwards;
}
/* Synthwave pink→orange gradient backdrop, matched to the Three.js sky colors */
@keyframes lb-fade-in-synthwave {
from { background: linear-gradient(135deg, rgba(102, 15, 87, 0), rgba(107, 66, 31, 0)); }
to { background: linear-gradient(135deg, rgba(102, 15, 87, 0.92), rgba(107, 66, 31, 0.92)); }
}
@keyframes lb-fade-out-synthwave {
from { background: linear-gradient(135deg, rgba(102, 15, 87, 0.92), rgba(107, 66, 31, 0.92)); }
to { background: linear-gradient(135deg, rgba(102, 15, 87, 0), rgba(107, 66, 31, 0)); }
}
@keyframes lb-fade-in { from { background: rgba(0,0,0,0); } to { background: rgba(0,0,0,0.88); } }
@ -653,8 +663,8 @@ a.detail-creator-card:hover {
z-index: 2000;
align-items: center; justify-content: center;
}
#np-overlay.np-open { display: flex; animation: lb-fade-in 0.25s ease forwards; }
#np-overlay.np-closing { animation: lb-fade-out 0.2s ease forwards; }
#np-overlay.np-open { display: flex; animation: lb-fade-in-synthwave 0.25s ease forwards; }
#np-overlay.np-closing { animation: lb-fade-out-synthwave 0.2s ease forwards; }
#np-modal {
position: relative; display: flex;