BUSINESS CONSULTING — Change Hover Over for Plugins

Home Forums All Other Themes BUSINESS CONSULTING — Change Hover Over for Plugins

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #167484
    Casara Clark
    Participant
    • Topics: 17
    • Replies: 25
    • Total: 42
    Member since: April 24, 2020

    Hi!

    I’m currently using Business Consulting at this site: https://www.ramolawpc.com/refresh/

    I’d like help with the PROJECTS section (which displays the PHOTO GALLERY) and the LATEST NEWS section (which displays the POSTS) right underneath it.

    For both of them, the Hover-Over remains yellow! I tried to change it to the site’s red. I altered every hover-over setting I can in the main Customize area, but these… Both the hover-over square for the Portfolio section AND the yellow hover text on ‘Read More’ from the News section… they’re still yellow.

    I imagine I just need to know what code to enter into the custom css to change these two hovers specifically?

    The desired red is #b82f29.

    Thank you!
    Casara

    #167561
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25832
    • Total: 25832
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    .skt-builder-home-section7-block-512 .portfolio-area li:hover .image-block::after {
        background: rgba(219, 6, 50, 0.9) !important;
    }
    .skt-builder-home-section9-block-701 .post_block_style3::before {
        background: #db0632;
    }
    .skt-builder-home-section9-block-701:hover .style3info h5, .skt-builder-home-section9-block-701:hover .shortdesc, .skt-builder-home-section9-block-701:hover .shortmore a { color:#fff;}

    Regards,
    Dave

    #167637
    Casara Clark
    Participant
    • Topics: 17
    • Replies: 25
    • Total: 42
    Member since: April 24, 2020

    Thank you. I made this change over at: https://www.ramolawpc.com/refresh/

    If you take a look, the hover over for the Projects section is red now and that’s perfect. Thank you! The Projects section looks great (though I do have questions about the right shortcode to get it to show only one category…).

    But the news right below it? Since putting in the above code, the text for it is now white? And the Read More links are still yellow, so the changes were not as productive for that posts plugin. The LATEST NEWS plugin looked great previously, the only issue was that we wanted the “Read More” link to be red, not yellow.

    I’m guessing I would delete the third line (this one)

    .skt-builder-home-section9-block-701:hover .style3info h5, .skt-builder-home-section9-block-701:hover .shortdesc, .skt-builder-home-section9-block-701:hover .shortmore a { color:#fff;}

    And there’d be something else to enter in the custom css section instead?

    Thank you!
    Casara

    #167660
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25832
    • Total: 25832
    Member since: August 16, 2013

    Hi,

    Kindly use this CSS code as well.

    .skt-builder-home-section9-block-701 .post_block_style3::before {
        background: #db0632 !important;
    }

    Regards,
    Dave

    #167682
    Casara Clark
    Participant
    • Topics: 17
    • Replies: 25
    • Total: 42
    Member since: April 24, 2020

    Thank you, this was a cool change that made the whole square highlight red. I’ll keep it as an option, even though I think the company will prefer the default gray highlight for this section.

    I want to emphasize that I appreciate receiving this code to implement this change because it does look very cool, but even with these changes, the READ MORE text at the bottom of each square is STILL yellow…

    How do I change the READ MORE link text? It’s gray regularly and then becomes yellow when I hover over it. I just want the READ MORE text to become that same red (which I guess has to be #db0632 not #b82f29) when I hover over it.

    Thank you!
    Casara

    #167789
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25832
    • Total: 25832
    Member since: August 16, 2013

    Hi,

    Kindly use this CSS:

    .skt-builder-home-section9-block-701 .shortmore a:hover {
        color: #db0632;
    }

    Regards,
    Dave

    #168004
    Casara Clark
    Participant
    • Topics: 17
    • Replies: 25
    • Total: 42
    Member since: April 24, 2020

    Thank you! That code didn’t work, but I realized what the issue is. There is a feature in the SKT Builder block that overrides the hover-over color. I just need to change it there. I feel silly for missing it earlier, but thank you so much for all the CSS suggestions. And for solving my initial edit to the photo gallery!

    #168060
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 25832
    • Total: 25832
    Member since: August 16, 2013

    👍

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