Avada Forums Community Forum Theme Button customization Help

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • jack92
    Participant
    Post count: 3

    Hey Guys,

    I was hoping you could help as I’m struggling on one last bit of my theme modification.

    On the following page of my website: https://www.retrorocco.co.uk/events/

    If you scroll to the bottom of the events you will see a subscribe to calendar buttom. I as the style of this and the drop-down to match the rest of the website but i can’t get it working.

    Any help would be greatly appricaited.

    Thanks in advance

    marklchaves
    Participant
    Post count: 873

    Hey @jack92,

    For what it’s worth, you might want to ping the TEC team about that. Maybe there’s a setting in their plugin that says, use theme default button styles.

    In the meantime, this custom CSS seems to do the trick (note: I try to use theme CSS variables where I can).

    
    /* Override TEC's button wrapper */
    .tribe-events-c-subscribe-dropdown > div {
      background: var(--button_gradient_top_color_hover) !important;
      border-radius: 0 !important;
    }
    
    /* Apply Avada theme styles to TEC's button */
    .tribe-events-c-subscribe-dropdown button {
      background: var(--button_gradient_top_color_hover);
      border-radius: 0;
      color: var(--button_accent_color);
      font-family: var(--button_typography-font-family);
      font-weight: var(--button_typography-font-weight);
      font-style: var(--button_typography-font-style, normal);
      letter-spacing: var(--button_typography-letter-spacing);
      border-width: var(--button_border_width-top, 0)
        var(--button_border_width-right, 0) var(--button_border_width-bottom, 0)
        var(--button_border_width-left, 0);
      border-style: solid;
      text-transform: var(--button_text_transform);
      transition: all 0.2s;
    }
    /* You might not need all the rules above. Prune what you don't need. */
    
    /* Don't forget the button hover ;-) */
    .tribe-events-c-subscribe-dropdown button:hover {
      color: var(--button_accent_hover_color);
    }
    
    

    Short clip of me toggling that CSS on and off https://jmp.sh/MMBwgOM

    Good luck!

    jack92
    Participant
    Post count: 3

    Hey @marklchaves

    Thanks alot for the above it works great, like you said i will reach out to TEC and hopefully they can get this resolved for a future release.

    Many thanks

    marklchaves
    Participant
    Post count: 873

    Awesome!

    I agree. I hope TEC already has a setting for that or they create one as a new feature.

    That CSS is a bit much just for 1 button.

    You’re very welcome though. Glat that it works.

    Cheers 🙂

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.