MarleaM/OffBeets

Animations do not work on certain displays

Aperta

#2 aperta il 21 nov 2024

 (0 commenti) (0 reazioni) (0 assegnatari)Python (1 fork)auto 404
CSSFrontendgood first issue

Metriche repository

Star
 (3 stelle)
Metriche merge PR
 (Metriche PR in attesa)

Descrizione

Our current animations (sliding fade-in) work on a majority of displays, but on a select few, they do not load.

Gets Called By: SongRows.tsx File location: Anti-Spotify/frontend/src/App.css Code location: Lines 375. Sample is pasted below.

/* animation */

@keyframes song-fade-in-animation {
    0% {
      opacity: 0;
      transform: translateY(30px) scale(0.9);
    }
    100% { 
      opacity: 1;
      transform: translateY(0px) scale(1);
    }
}

@keyframes navbar-fade-down-animation {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% { 
    opacity: 1;
    transform: translateY(0px);
  }
}

.song-fade-in {
  animation: song-fade-in-animation linear;
  animation-timeline: view();
  animation-range-start: cover;
  animation-range-end: 400px;
}

.main-song-fade-in {
  animation: song-fade-in-animation .4s; 
}

.navbar-fade-down{
  animation: navbar-fade-down-animation .9s;
}

We have a suspicion that this may be due to the use of the methods called in .song-fade-in.

Guida contributor