40 lines
880 B
CSS
40 lines
880 B
CSS
@import 'tailwindcss';
|
|
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeOut {
|
|
from {
|
|
opacity: 1;
|
|
}
|
|
to {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
.popup-overlay {
|
|
@apply fixed w-screen h-screen z-[9999] flex justify-center items-center animate-[fadeIn_0.2s_ease-out_forwards] left-0 top-0 bg-[rgba(0,0,0,0.5)];
|
|
}
|
|
|
|
.popup-overlay.fade-out {
|
|
@apply animate-[fadeOut_0.2s_ease-out_forwards];
|
|
}
|
|
|
|
.popup-box {
|
|
@apply relative w-[85vw] h-[80vh] shadow-[0_0_20px_rgba(0,0,0,0.2)] rounded-lg bg-[#191919] flex flex-col p-6;
|
|
}
|
|
|
|
.popup-content {
|
|
@apply flex-1 overflow-auto border border-[#323232] rounded-lg mt-4;
|
|
}
|
|
|
|
.close-button {
|
|
@apply flex justify-center items-center absolute bg-[#363636] hover:bg-[#484848] text-2xl cursor-pointer text-gray-300 hover:text-white h-12 w-12 p-3 rounded-xl border-[none] left-2 top-2 transition-colors;
|
|
}
|