[Support request] Lightweight social icons color in footer

Home Forums Support Lightweight social icons color in footer

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

    Hi there
    I use CSS (below) for Lightweight social icons color in home page”s footer.
    footer.png
    I wish to target the “footer” in all pages and posts with this CSS without affecting on sidebar social icons color (need all pages and posts” footer as homepage footer color).
    Would you kindly help me to modify this CSS?
    Thanks
    ………………..
    body:not(.home) .lsi-social-icons .lsi-social-instagram a,
    body:not(.home) .lsi-social-icons .lsi-social-instagram a:visited,
    body:not(.home) .lsi-social-icons .lsi-social-instagram a:focus focus {
    background: #DD2A7B !important;
    }
    body:not(.home) .lsi-social-icons .lsi-social-twitter a,
    body:not(.home) .lsi-social-icons .lsi-social-twitter a:visited,
    body:not(.home) .lsi-social-icons .lsi-social-twitter a:focus focus {
    background: #55acee !important;
    }
    body:not(.home) .lsi-social-icons .lsi-social-facebook a,
    body:not(.home) .lsi-social-icons .lsi-social-facebook a:visited,
    body:not(.home) .lsi-social-icons .lsi-social-facebook a:focus focus {
    background: #3b5998 !important;
    }
    body:not(.home) .lsi-social-icons .lsi-social-pinterest a,
    body:not(.home) .lsi-social-icons .lsi-social-pinterest a:visited,
    body:not(.home) .lsi-social-icons .lsi-social-pinterest a:focus focus {
    background: #bd081c !important;
    }
    body:not(.home) .lsi-social-icons .lsi-social-linkedin a,
    body:not(.home) .lsi-social-icons .lsi-social-linkedin a:visited,
    body:not(.home) .lsi-social-icons .lsi-social-linkedin a:focus focus {
    background: #0077b5 !important;
    }

    #1309247
    Leo
    Staff
    Customer Support

    Hi there,

    Try this instead:

    body .footer-widgets .lsi-social-icons .lsi-social-instagram a,
    body .footer-widgets .lsi-social-icons .lsi-social-instagram a:visited,
    body .footer-widgets .lsi-social-icons .lsi-social-instagram a:focus focus {
        background: #DD2A7B !important;
    }
    body .footer-widgets .lsi-social-icons .lsi-social-twitter a,
    body .footer-widgets .lsi-social-icons .lsi-social-twitter a:visited,
    body .footer-widgets .lsi-social-icons .lsi-social-twitter a:focus focus {
        background: #55acee !important;
    }
    body .footer-widgets .lsi-social-icons .lsi-social-facebook a,
    body .footer-widgets .lsi-social-icons .lsi-social-facebook a:visited,
    body .footer-widgets .lsi-social-icons .lsi-social-facebook a:focus focus {
        background: #3b5998 !important;
    }
    body .footer-widgets .lsi-social-icons .lsi-social-pinterest a,
    body .footer-widgets .lsi-social-icons .lsi-social-pinterest a:visited,
    body .footer-widgets .lsi-social-icons .lsi-social-pinterest a:focus focus {
        background: #bd081c !important;
    }
    body .footer-widgets .lsi-social-icons .lsi-social-linkedin a,
    body .footer-widgets .lsi-social-icons .lsi-social-linkedin a:visited,
    body .footer-widgets .lsi-social-icons .lsi-social-linkedin a:focus focus {
        background: #0077b5 !important;
    }
    #1309557
    Fekry

    It works for footer in entire site.
    But now I want every social icon in “sidebar” to take its own color:
    instagram background: #DD2A7B
    twitter background: #55acee
    facebook background: #3b5998
    pinterest background: #bd081c
    linkedin background: #0077b5
    May you kindly help?

    #1310070
    Leo
    Staff
    Customer Support

    You need to have another set of CSS above but replace .footer-widgets with .sidebar

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