How to change the color of the bouncing ‘scroll down’ text?

Stanley Canada

• April 18, 2023 18:38
• Edited

'Scroll down' text is not visible on the cover block background. Can I change the color of the text?

0

• 

  Tatiyana Graf

  • April 18, 2023 18:49

  You can change the color of that text in the cover block settings. There is a 'text color' option for title on the cover block, but it also determines the color of the scroll down text. It took me a while to find it but it's cool to have an option for that.

  0
• 

  Daniel Martinez

  • April 02, 2024 06:29
  • Edited

  I used custom CSS to do this.  I created a background for it and added little arrows.  Here's the custom css code I used to change the "Scroll Down" text:
  (Note:  The css required may be different depending on your theme)

  .absolute.bottom-0.inset-x-0.mb-2.text-white.text-center.animate-bounce.hidden.md\:block > p {
      color: turquoise;
      margin-bottom: -16px;
      font-weight: bolder;
      background-color: #007223;
      opacity: 80%;
      width: 235px;
      margin-left: auto;
      margin-right: auto;
      border-radius: 8px;
      border: 2px inset #eff1e8;
      font-style: italic;
      font-variant: small-caps;
  }

  .absolute.bottom-0.inset-x-0.mb-2.text-white.text-center.animate-bounce.hidden.md\:block > p::before {
  content: "↓  ";
  }
  .absolute.bottom-0.inset-x-0.mb-2.text-white.text-center.animate-bounce.hidden.md\:block > p::after {
  content: "  ↓";
  }

  0

Please sign in to leave a comment.