Template:BibisiLauncher/style.css: Difference between revisions

/* Rocket animation */
@keyframes rocket-launch {
  0% { transform: translateY(0); }
  100% { transform: translateY(-1200px); }
}

/* Smoke trail animation: Grows and fades */
@keyframes exhaust-trail {
  0% { opacity: 1; transform: scale(0.5); }
  100% { opacity: 0.3; transform: scale(3) translateY(-50px); }
}

.missile-object {
  position: fixed;
  bottom: 50px;
  left: 50%;
  font-size: 50px;
  visibility: hidden;
  z-index: 9999;
  text-align: center;
}

/* When clicking, trigger BOTH animations */
.launcher-btn:active + .missile-object {
  visibility: visible;
  animation: rocket-launch 2s cubic-bezier(0.5, 0, 1, 0) forwards;
}

/* The fire/smoke child element */
.launcher-btn:active + .missile-object .exhaust {
  animation: exhaust-trail 1s ease-out infinite;
}

.exhaust {
  display: block;
  font-size: 20px;
}