Nerixyz / current-song2

Display the currently playing song/audio.
https://currentsong.nerixyz.de
91 stars 7 forks source link

I apologize if this is a little dumb #488

Open ShadeNightz opened 3 months ago

ShadeNightz commented 3 months ago

How do I get rid of the little text pop in animation for the song title and such whenever it first appears or changes to another song. Also how would I stop it from disappearing on pause

Nerixyz commented 3 months ago

There are no stupid questions.

You'd change the theme.css. First, create a theme.css next to the current-song2.exe. Then can start with the Transparent Background theme. It has animations disabled already. Now you can overwrite the .vanish class that gets added to hide the overlay while the song is paused.

The full CSS:

/* theme.css */

:root {
  /* Configuration for the text shadow */
  --text-shadow-color: #0007;
  /*
    See https://currentsong.nerixyz.de/Customization/Theming/#default-variables
    for more variables like --text-color that can be set here.
  */
}

#song-container {
  /* Remove the background */
  background: transparent;
  /* Disable animations */
  transition: none;
  overflow: visible;
  box-shadow: none;
}

/* Prevent the overlay from disappearing */
#song-container.vanish {
  transform: none;
  opacity: 100%;
}

/* Add some shadow for readability */
#song-info :is(h1, h2) {
  text-shadow: 1px 4px 15px var(--text-shadow-color, #0007);
}

Note that disabling .vanish isn't something that is well-supported, but usually works good enough.

ShadeNightz commented 3 months ago

Thank you.

ShadeNightz commented 3 months ago

Is it possible to get the marquee to loop and go in one direction?

Nerixyz commented 3 months ago

Is it possible to get the marquee to loop and go in one direction?

That's not possible yet, there would need to be two elements for the text.

ShadeNightz commented 3 months ago

Hm.. There a way to disable the movement entirely of the marquee so the text just sits still for the time being?

Nerixyz commented 3 months ago

You can use --use-marquee: false to disable the effect. In that case you will probably want to unset the max-width as well:

:root {
  --use-marquee: false;
  --max-width: unset;
}