Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • December 21, 2024 at 7:32 pm #1474115
    Martina

    Hi. I have 2 issues that I need assistance with:

    1. I want to remove the grayscale effect for an inactive tab so that tab image (that is replacing icon) display in full colour rather than grayscale when inactive. I have added a custom icon image for this first tab that I want displayed in full colour at all times. I added the following custom css to remove grayscale from inactive tab icon which works in mobile/tablet view but is not working when viewing via desktop mode (still showing grayscale when inactive):
    /*Remove grayscale */
    .av-tab-section-image {
    filter: none!important;
    }
    Any advice?

    2. For this first tab I would also like the onclick action to open up the second tab – as in there is no content in first tab – its only purpose is to display this icon image. Possible?
    Have input details in private content
    Thanks for the help!

    December 21, 2024 at 11:08 pm #1474117
    Martina

    For that first tab, an alternate would be to remove the onclick action on that tab – possible?

    December 22, 2024 at 2:28 pm #1474139
    Mike

    Hi,
    Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

    .av-section-tab-title[data-av-tab-section-title="1"] .av-tab-section-image {
    opacity: 1;
    filter: none;
}

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    December 23, 2024 at 8:23 am #1474168
    Martina

    Hi Mike, added in the code and cleared cache but no change – tab image still grayscale on desktop view

    December 23, 2024 at 11:25 am #1474172
    Mike

    Hi,
    When I check your page css I do not see the above css added, but when I test it works:
    Screen Shot 2024 12 23 at 5.21.51 AM
    Please ensure to copy the code from the forum and not an email notification so the symbols are not converted, and try again, If this doesn’t correct please include admin login in the Private Content area so we can check.

    Best regards,
    Mike

    December 23, 2024 at 12:29 pm #1474175
    Martina

    Hi Mike – I’m still not seeing any change. I’ll put in the admin login in private content area if you can check. It may be some woocommerce css that is affecting it? Thanks

    Client wants to move away from using this – so the greying over is no longer an issue. But thank you for the help Mike. This is now closed

    • This reply was modified 1 month ago by Martina.
    • This reply was modified 1 month ago by Martina.
    December 24, 2024 at 1:16 pm #1474227
    Mike

    Hi,
    please include admin login in the Private Content area so we can check.

    Best regards,
    Mike

    January 12, 2025 at 10:42 am #1475004
    Martina

    Client wants to move away from using this – so the greying over is no longer an issue. But thank you for the help Mike. This is now closed

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Tabbed section – remove grayscale from inactive tab icon not working on desktop’ is closed to new replies.