Content column header to match sidebar header?

  • zmokin

    #7558

    I’ve been fumbling for hours now and can’t figure out where to make the changes.

    Right now the top of the content column is just white, but I’d like the top of the left content column to match the grey gradient displayed at the top of the right sidebar column.

    Here is a link to the site: http://www.sujalowenthal.org/

    I don’t care about it being at the top of each post, just once at the top of the entire content section.

    I ‘think’ I found the background information from the style.css:

    background: url(images/bg-gradient.png) left bottom repeat-x fixed;

    But placing that in various locations (i.e., content-main) doesn’t seem to work.

    Thanks for any help.

    zmokin

    #38614

    Hello? Any chance on getting some help with this?

    I just need to be pointed in the right direction as to which div/class I would need to change. I ‘think’ I can figure out how to do the gradient bar in the back.

    Thanks!

    Mod

    Kenneth John Odle

    #38615

    Try using Firebug to nail down those classes/id’s.

    That background is applied to a <h3> element in the widget. You can try applying it to whatever is at the top of the main content area (<h1> or <h2>, maybe?) and see what happens.

    Please don’t bump.

    zmokin

    #38616

    Well, I got the background to work, but I just can’t get the text to change color. This is what I’ve added to get everything to match so far:

    .post-title {
    background-image:linear-gradient(#8E918D, #2B2B2B);
    background-position: initial initial;
    background-repeat:initial initial;
    border-bottom-color:#195392;
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    margin:-17px 0 5px -12px;
    text-shadow:#333333 0 -1px 0;
    padding:7px 12px;
    width: 100%;
    zoom:1;
    }

    .post-title, .post-title a, .post-title a:hover, .post-title a:visited {
    color: #ffffff;
    font-family:'Pontano Sans', arial, sans-serif;
    font-size:18px;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    line-height:20px;
    }

    I had to use the two different entries or it wouldn’t work correctly.

    I’ve tried using entry-title, h1, h2 (h1 is used for the front page anf h2 is used for full pages) and just can’t get it to work.

    And yes, I’ve been using firebug to try and figure it out.

    Thanks.

    zmokin

    #38617

    So here is what I have found.

    Using Firebuug, I could change the color of the text title inline live and it worked fine.

    When I copied the code to the style.css (I’m using a child theme), it would not work.

    Everything else within the title can be changed (font, size, text shadow color, etc.) using the style.css except the color.

    I can change the ‘Title Text’ color using the Graphene Options->Colours->Content Text, but you cannot do it from within the style.css.

    The reason I want it in the style.css is to be able to copy it to other websites once complete.

    This seems to be the only attribute that can’t be changed in the style.css, is this intentional or is this a bug in the theme?

    Mod

    Kenneth John Odle

    #38618

    You are selecting white (#fffffff) for the color of this element? If so, it is working fine on my end.

    zmokin

    #38619

    Yes, but the color is being controlled by the ‘Graphene template options’, not the ‘style.css’.

    The ‘color’ code I have in the above list of codes does not do anything.

    If I change the color in the ‘style.css’, it is always overridden by the ‘Graphene template options’ whereas all the other options in the ‘style.css’ override the ‘Graphene template options .

    Unless there is something specifically different in my installation, try changing the color of your ‘post-title’ via the ‘style.css’ and you’ll see what I mean. You can change everything else about it but the color.

    In theory, the settings you add to the ‘style.css’ should override the settings in ‘Graphene template options’, correct?

    And it does, all except for the ‘.post-title’ color element.

    That’s why I’m thinking that there is a ‘small’ bug in the template that is not recognizing this particular element.

    If you can get it to change via the ‘style.css’, then I obviously have a different problem.

    Thanks for your time.

    Mod

    Kenneth John Odle

    #38620
    Quote:
    Yes, but the color is being controlled by the ‘Graphene template options’, not the ‘style.css’.

    That’s because the Graphene color options get loaded after the Graphene style sheet (or in your case, the child theme style sheet). The last style loaded is the one that is used.

    In your case, the easiest fix is to go to Graphene’s color options and clear the value you have there, or to add !important to the declaration in your child theme style sheet.

    Quote:
    If you can get it to change via the ‘style.css’, then I obviously have a different problem.
    Mod

    Kenneth John Odle

    #38621
    Quote:
    Yes, but the color is being controlled by the ‘Graphene template options’, not the ‘style.css’.

    That’s because the Graphene color options get loaded after the Graphene style sheet (or in your case, the child theme style sheet). The last style loaded is the one that is used.

    In your case, the easiest fix is to go to Graphene’s color options and clear the value you have there, or to add !important to the declaration in your child theme style sheet.

    Quote:
    If you can get it to change via the ‘style.css’, then I obviously have a different problem.

    The problem here is that Firebug (which is what I was using) doesn’t make it very clear what order style declarations are being loaded in. Using the view source function makes that clear.

    Mod

    Kenneth John Odle

    #38622

    fwiw, I’m still a little confused, because you are specifying white in the above code (#fff) and your titles are showing up white on your site.

    zmokin

    #38623

    The only reason the titles were showing up in white was that I changed them in Graphene’s color options in order to keep the client quiet for the time being. If I cleared the value there as you suggested, Graphene kept going back to the original dark blue color and ignored my ‘color’ code in the style sheet.

    Now that I know that the Graphene colors are loaded after the ‘style.css’ it makes more sense. That and the ‘!important” addition made the difference and now the style sheet controls the color.

    Thanks! That’s what I needed to know!

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

You must be logged in to reply to this topic.