Tagged: ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #978554

    Hi guys,

    The site below has some issues on scroll on desktop browsers.

    Book Now and Call are links.

    1. On Desktop browser: When I scroll I need those links to change to color #8f8c8f just like the rest of the text. So links do not change, but text surrounding it does. I want all text to change to #8f8c8f linked or not linked..

    Perhaps the CSS below needs to be cleaned up or added to? Can you straighten that out for me?

    Thank you,

    Jas

    /*header font & icons*/ 
    
    .phone-info {
     font-weight: 100!important;
     font-size: 95%!important;
    }
    
    .header-scrolled .phone-info span {
    color: #8f8c8f;
    }
    
    .page-id-1212 .phone-info a, 
    .page-id-1212 .phone-info, 
    .page-id-1212 .header_color .main_menu ul:first-child > li.active-parent-item > a,
    .page-id-2590 .phone-info a, 
    .page-id-2590 .phone-info, 
    .page-id-2590 .header_color .main_menu ul:first-child > li.active-parent-item > a {
        color: #8f8c8f !important;
    } /*fix phone info link color on non-transparent headers*/
    #978577

    Hey Jasmer,

    Please change following code

    .header-scrolled .phone-info span {
        color: #8f8c8f !important;
    }

    to following one

    .header-scrolled .phone-info * {
        color: #8f8c8f !important;
    }

    Best regards,
    Yigit

    #978589

    On mobile devices, only the phone number appears, all other text is invisible. I added this a long time ago but it’s not working now.

    @media only screen and (max-width: 768px) {
    #top .av_header_transparency .phone-info, #top .av_header_transparency .phone-info span {
        color: #555555 !important;
    }} /*for appointment call info*/
    
    @media only screen and (max-width: 480px) {
    .phone-info a {
        color: #555555 !important;
    }} /*phone number info darken phone*/

    Thoughts?

    Thanks,

    Jas

    • This reply was modified 6 years, 1 month ago by Jasmer. Reason: update
    #978853

    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:

    
    @media only screen and (max-width: 768px) {
    .responsive .phone-info * {
        color: #8f8c8f!important;
    }}
    
    

    Best regards,
    Yigit

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