Support » Theme: Hueman » Grey background on sidebars and behind images with captions

  • Resolved laurenjane

    (@laurenjane)


    Hi Alex,

    Two things:

    I would like to change the light grey of the sidebars to a different color, but haven’t been able to figure out where in the stylesheet I might do this.

    Could you let me know what I might add/change in the code to do this?

    The website is: http://www.multiculturiosity.com

    Thanks!

    Lauren

Viewing 4 replies - 1 through 4 (of 4 total)
  • Very nice Website, Lauren! I have the same question as you for my company site, http://www.havebluepower.com

    Hi Lauren! Looks tasty there on the website! (Tip: run the regenerate thumbnails plugin once to fix older thumbnail sizes)

    For the caption background:

    .entry .wp-caption { background: #mycolor; }

    The sidebar:

    @media only screen and (min-width: 480px) and (max-width: 1200px) {
    .s2-expand .s2 { background: #f0f0f0; }
    }
    @media only screen and (min-width: 480px) and (max-width: 960px) {
    .s1-expand .s1 { background: #f0f0f0; }
    }
    @media only screen and (max-width: 479px) {
    .sidebar { background: #f0f0f0; }
    }

    Then you’d also need to edit /img/sidebar/s-left.png and /img/sidebar/s-right-s2.png and save them with your color. Or all images in the sidebar image folder if you want it to work with all layout options.

    There is quite a bit of “css-logic” going on behind the responsive and toggle-able sidebars (gave me a headache to create), so that’s why there are so many different things to change.

    hi,

    Just a clarification, this is not the same lines as in the child theme,
    we need to change the child theme or add these lines in addition?

    /* Global */
    .mystyle {}
    
    /* Tablet - 800px, 768px & 720px */
    @media only screen and (min-width: 720px) and (max-width: 800px) {
        .mystyle {
    }
    
    /* Mobile - 480px & 320px */
    @media only screen and (max-width: 719px) {
        .mystyle {}
    }
    
    /* Mobile - 320px */
    @media only screen and (max-width: 479px) {
        .mystyle {
    }

    thank you

    I had to off

    .col-3cm .main-inner {background:none;}
    .col-3cm .main {background:none;}

    otherwise remain gray sidebars
    even before they try to

    /* Tablet - 800px, 768px & 720px */
    @media only screen and (min-width: 720px) and (max-width: 800px) {
    .s2-expand .s2 { background:none; background-color: #FFF; }
    }
    
    /* Mobile - 480px & 320px */
    @media only screen and (max-width: 719px) {
    .s1-expand .s1 { background:none; background-color: #FFF; }
    }
    
    /* Mobile - 320px */
    @media only screen and (max-width: 479px) {
    .sidebar { background:none; background-color: #FFF; }
    }

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Grey background on sidebars and behind images with captions’ is closed to new replies.