MarleaM/OffBeets

Animations do not work on certain displays

Aberta

#2 aberto em 21 de nov. de 2024

 (0 comentário) (0 reação) (0 responsável)Python (1 fork)auto 404
CSSFrontendgood first issue

Métricas do repositório

Stars
 (3 estrelas)
Métricas de merge de PR
 (Métricas PR pendentes)

Description

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.

Guia do colaborador