This topic contains 9 replies, has 3 voices, and was last updated by  Sakin 3 years, 9 months ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #49225

    My website is 1stattackengineering.com.

    1. The bullets/ lists through out the site are a light grey which makes them hard to see. How do I change the bullets through out the website?

    2. The social icons that are at the top of the page are in a grey scale and then turn color when you hover. I would like to have them in color and then pop-out when I hover over them. Is this possible?

    #49247

    Sakin
    Keymaster

    Hello,

    1. You can change the color code in the following css and then add it in “Appearance => Theme Options => Custom CSS” box:

    #main ul {
        color: #000;
        list-style: outside none disc;
    }

    2. You can add the following css in “Appearance => Theme Options => Custom CSS” box:

    /* Make Social Icons Color by Default */
    ul.social-profile li.facebook a {
        background-position: 0 -43px;
    }
    ul.social-profile li.linkedin a {
        background-position: -603px -43px;
    }
    ul.social-profile li.pinterest a {
        background-position: -216px -43px;
    }
    ul.social-profile li.you-tube a {
        background-position: -87px -43px;
    }
    ul.social-profile li.email a {
        background-position: -1119px -43px;
    }
    #49274

    The social icon worked great! Thank you. For the bullets can I change the color, but not change the bullets to dots?

    #49297

    Sakin
    Keymaster

    Sorry that is image so cannot change that image color. You can only change the bullet style to disc or square or circle

    #49298

    Sakin
    Keymaster

    If you want black arrow for white screen then you can add the following:

    #main ul {
        list-style: outside url("http://1stattack.com/wp-content/themes/simple-catch-pro/images/ul-bg.png") disc;
    }
    #49305

    That looks a lot better. Thanks.

    #54613

    Karlopa
    Member

    Good day, I tried to add Sakins’ code for changing the social media icons colors for the Catch Flames theme and it did not work.
    /* Make Social Icons Color by Default */

    Any feedback would be appreciated. I added it to the Custom CSS section. I also have other CSS code there to tweak the website.
    I realize that the theme is using one png image for the social media icons.
    It would be nice to have them stand out more and not be so grey and dull on the page. Thanks in advance.

    #54643

    Sakin
    Keymaster

    @karlopa: This is Simple Catch Pro theme support forum and the CSS given above will only work in Simple Catch Pro theme. For Catch Flames theme, you need to post in Catch Flames support forum at http://catchthemes.com/support-forum/forum/catch-flames-free/

    You cannot change the color of social icons, it can me either grey or original color. If you want always original color then you can add the css like following which will make facebook, twitter and google plus color with original brand color.

    .social-profile ul li.facebook a { background-position: 0 -44px; }
    .social-profile ul li.twitter a { background-position: -44px -44px; }
    .social-profile ul li.google-plus a { background-position: -528px 0; }

    Fore more please post in Catch Flames support forum.

    #62212

    The CSS that you send me a while back worked great for the social icon, but now I have added more icons. How do I get the new ones to not be in gray scale. I added twitter and google+. Thank you.

    #62674

    Sakin
    Keymaster

    Yes sure, you can add the following css in “Appearance => Theme Options => Custom CSS” box:

    ul.social-profile li.twitter a {
        background-position: -44px -43px;
    }
    ul.social-profile li.google-plus a {
        background-position: -173px -43px;
    }
Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Bullet Color, Social Icons Color & Pop-out’ is closed to new replies.