Changing the background to Comments section

  • rowladar

    #1455

    Hi,

    I love the theme – am getting to grips with Child-themes etc.

    I have changed the theme to a darker style, and most things are working but, for the love of God I cannot seem to be able to change the background colour of the Comments and responses section of the page!

    Take a look at http://southernfreestyle.co.uk/contact-us/ and you will see what I mean.

    I am also struggling to change the colour of the text in these sections… can anyone point me to the relevant bit of CSS for these items?

    The child-theme is working as you tell by the white colour of the “year” in the calendar icon in the News section.

    All help greatly appreciated!

    Mod

    Kenneth John Odle

    #15859

    Firebug suggests

    #comments_list, #respond {background:#000; color:#FFF;}

    for custom CSS

    Ken

    rowladar

    #15860

    Hi Ken,

    I downloaded firebug yesterday after reading about it on here… I spent a few hours playing with it but cannot figure out hor you arrvived at this – can you walk me through how you did it?!!

    rowladar

    #15861

    Actually – hold that last comment as I tried adding the code into the child theme’s style.css as below and it doesn’t have any effect

    /*
    Theme Name: GrapheneChild
    Theme URI: http://example.com/
    Description: This is my child theme for the Graphene theme
    Author: Daran Rowlands
    Author URI: http://www.unlimited-networks.com
    Template: graphene
    Version: 1.0
    */
    @import url("../graphene/style.css");
    #footer {
    background: #000;
    }
    #comments_list, #respond {
    background: #000;
    color: #fff;
    }

    Any ideas?

    Mod

    Kenneth John Odle

    #15862

    Actually, for respond form, try

    #respond form p {
    background: #000;
    color: #fff;
    }

    Sorry, I usually test these things first, but i’m working long hours this week. Still stumped about the comments, but working on it.

    About firebug: if you open it, the bottom half of your screen will open up a console window showing the html structure of your blog page. Click on the squares with a plus in the middle to open up that particular <div> to find what you are looking for. The most important one (usually) is <div id="container">

    Cheers,

    Ken

    rowladar

    #15863

    Hi Ken,

    I’ve managed to figure it out even though I don’t fully understand the html. This is my child-theme stylesheet now:

    /*
    Theme Name: GrapheneChild
    Theme URI: http://example.com/
    Description: This is my child theme for the Graphene theme
    Author: Daran Rowlands
    Author URI: http://www.unlimited-networks.com
    Template: graphene
    Version: 1.0
    */
    @import url("../graphene/style.css");
    .post .date p span.year {
    color: #fff;
    }
    .post-meta {
    color: #fff;
    }
    #comments {
    background: #000;
    }
    #commentform {
    background-color: #1d1b1b;
    }
    #comments ol li.comment.depth-1, #comments ol li.pingback.depth-1, #comments ol li.trackback.depth-1 {
    background: #6C7070;
    }
    #comments .children li.bypostauthor, #comments li.bypostauthor li.comment {
    background: #7C807F;
    }
    #comments p.commentmetadata {
    color: #fff;
    }
    #post .entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6, .comment-entry h1, .comment-entry h2, .comment-entry h3, .comment-entry h4, .comment-entry h5, .comment-entry h6 {
    color: #fff;
    }
    #footer {
    background: #1d1b1b;
    }
    #sidebar_bottom {
    background: #000;
    }

    I’m not sure if this is good or bad code but it seems to do the trick… check out here:

    http://southernfreestyle.co.uk/contact-us/

    Any comments on the website are welcome by the way!!!

    Mod

    Kenneth John Odle

    #15864

    Firebug is good for a lot of this, but sometimes it pays to examine the original styles.css file, which is what I should have done in the first place.

    Actually, you can learn a lot just by looking through the css file, especially after it’s been rewritten, as the /*nav*/ section has been.

    Ken

    donna03281

    #15865

    Thanks, looking for this information as well and successfully changed. Next question though, where do I find the css style for the bottom widget bar (above footer)?

    Mod

    Kenneth John Odle

    #15866

    Do you mean the silver/grey bar between the footer and the main content area?

    If that’s what you mean, try this post.

    Ken

    Mod

    Kenneth John Odle

    #15867

    @rowladar

    Your comments sections looks fantastic. That’s what I was forgetting: that Graphene supports nested comments, which you have to accomodate in your CSS.

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

  • 1
  • 2
  • You must be logged in to reply to this topic.