Change font color on Genesis Responsive slider excerpt

Community Forums Forums Design Tips and Tricks Change font color on Genesis Responsive slider excerpt

This topic is: not resolved

This topic contains 1 reply, has 2 voices, and was last updated by  Mike Imken 11 months, 1 week ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #61082

    erinhoward
    Participant
    Post count: 2

    Hello,

    I am using the Agency theme. I want to make the title font color in the slide excerpt white. I tried doing it both in the slider CSS and under slide excerpt in the theme CSS, but they were being overridden and wouldn’t work even with the !important tag.

    I finally figured out that it would work if I changed the font color under headlines, but then of course that made every header H1-H6 in the entire site white, which won’t work.

    So I tried the CSS below in hopes it would make only the slide excerpt headers white. It didn’t work so I tried an !important tag, which did work but also changed every header in the site again, not just the slider title.

    I have the Slider set up to use posts with the category of Slider, and the text in the excerpt is coming from the post name. So maybe one way to do it would be to say that if a post has the category of Slider make the color white? But even if that would work, I’m afraid that is beyond my coding capabilities.

    [css]
    }
    .agency .slide-excerpt
    h1,
    h2,
    h2 a,
    h2 a:visited,
    h3,
    h4,
    h5,
    h6 {
    color: #fff;
    font-family: ‘PT Sans’, sans-serif;
    font-weight: 900;
    margin: 0 0 10px;
    line-height: 1.25;
    }
    [/css]

    Any ideas?

    Thanks.

    http://www.debelbaum.com
    #63130

    Mike Imken
    Participant
    Post count: 18

    You have several things trying to affect the headlines. This CSS code will cause some issues:

    #home-slider h1,
    h2,
    h2 a,
    h2 a:visited,
    h3,
    h4,
    h5,
    h6 {
    	color: #5EA699 !important;
    	font-family: 'PT Sans', sans-serif;
    	font-weight: 900;
    	margin: 0 0 10px;
    	line-height: 1.25;
    }

    This is making the #home-slider h1 color change (which is irrelevant, because there is no #home-slider h1 in the code) and is overriding all headline selectors, so that all headlines will be #5EA699.

    If you want just the title font in the slider to be white, change the CSS to this. But note it will be “invisible” due to the white background. This will also revert other headlines to black based on other headline CSS settings in your file:

    #home-slider h2 a {
    color: #fff;
    font-family: 'PT Sans', sans-serif;
    font-weight: 900;
    margin: 0 0 10px;
    line-height: 1.25;
    }

    If you want the other headlines to be the teal/green color, you will address those in the Headlines section.


    Designer – Developer
    http://www.ExpansionAcademy.com

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.