Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • September 18, 2018 at 12:44 am #1011045
    Lara

    Hi team,

    I’m wondering how to change the colour of the number in animated numbers?

    Cheers,

    Lara

    September 18, 2018 at 1:45 am #1011048
    Vinay

    Hey Lara,

    Thank you for contacting us.

    Please check the Enfold Documentation for more info on how to customize the elements.

    Thank you for using Enfold, let us know if you have any issue :)

    Best regards,
    Vinay

    September 18, 2018 at 2:21 am #1011050
    Lara

    Hi Vinay,

    thanks for sending that over. Unfortunately it doesn’t help me change the colour of the number…I’m not really sure how to do it

    September 18, 2018 at 6:49 am #1011105
    Ismael

    Hi,

    You can actually change the color from the element’s options panel. Switch to the “Colors” tab and then set the “Font color?” settings to “Custom”.

    Best regards,
    Ismael

    September 18, 2018 at 6:54 am #1011112
    Lara

    Hi Ismael,

    When i do this and select the colour I want, it changes all the text colour.

    As you can see on this page, under the feature image, 28 months and duration all change. I’d like it to be like “Munnmorah NSW” and “Delta Electricity” but leabing the duration black.

    September 18, 2018 at 7:00 am #1011114
    Lara

    also, the word “months” goes lighter when i do custom colour

    September 18, 2018 at 9:54 am #1011168
    Vinay

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    CSS Snippet:

    
/* CSS - Animated number color */

/* Animated numbers font style*/
#top .avia-animated-number .avia-single-number {
      color: red;
}

    Best regards,
    Vinay

    September 19, 2018 at 2:38 am #1011584
    Lara

    Hi Vinay,

    thanks for getting back to me. Unfortunately this CSS doesn’t do anything

    Lara

    September 19, 2018 at 2:49 pm #1011837
    Victoria

    Hi Lara,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
.avia-animated-number-content {
  color: #000;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    September 20, 2018 at 1:30 am #1012080
    Lara

    Hi Victoria,

    Unfortunately this does not work in General styling or custom.css

    Lara

    September 20, 2018 at 4:23 am #1012122
    Mike

    Hi,
    I took a look at your pages and found that the reason some of the words look gray is because of the opacity, Please try this code in the General Styling > Quick CSS field:

    .avia-animated-number span.avia-single-number {
    opacity: 0.5 !important; 
}

    Please clear your browser cache and check.

    Best regards,
    Mike

    September 21, 2018 at 12:30 am #1012542
    Lara

    Hi Mike,

    Thanks for your help! it looks perfect now.

    Lara

    September 21, 2018 at 3:11 am #1012581
    Mike

    Hi,
    Glad we could help, unless there is anything else we can help with on this issue, shall we close this then?

    Best regards,
    Mike

    September 21, 2018 at 3:14 am #1012583
    Lara

    Hi Mike,

    Yes thank you.

    Lara

    September 21, 2018 at 4:36 am #1012609
    Mike

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)

    Best regards,
    Mike

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • The topic ‘Animated numbers’ is closed to new replies.