Forum Discussion

memerylane's avatar
memerylane
Expert
14 years ago

Foreground color restrections?

Hi all,   We're setting up our community, and I'm running into what seem to be some restrictions on the color schemes.   I want our foreground color to be a shade of black (or perhaps white) and ...
  • KaelaC's avatar
    KaelaC
    14 years ago

    Ah, I see.  By default the background of the lia-panel-heading-bar div is 20% of the foreground color.  However, like Jeff said, you can always overwrite that default with css.  

     

    #lia-body .lia-content .lia-panel .lia-panel-heading-bar {background color: #A10022; color:#FFFFFF;}

#lia-body .lia-content table.lia-list-wide th, #lia-body .lia-content table.lia-list-wide th a {
    color: #000000;
}

#lia-body .lia-content table.lia-list-wide th {
    background-color: #EAEAEA;
}

     

    Add this to the CSS tab in your skin will switch the color scheme of the heading bars and sub headings.  I added a quick screen shot so you can see what it would look like.


    switch-header.png
  • JeffS's avatar
    JeffS
    14 years ago

    Hi Matt,

     

    This should do the trick for the area in question:

     

    #lia-body .lia-content .lia-browser-category-list .lia-browser-category-heading {color: #FFFFFF;}
KaelaC's avatar
KaelaC
Lithium Alumni (Retired)
14 years ago

Ah, I see.  By default the background of the lia-panel-heading-bar div is 20% of the foreground color.  However, like Jeff said, you can always overwrite that default with css.  

 

#lia-body .lia-content .lia-panel .lia-panel-heading-bar {background color: #A10022; color:#FFFFFF;}

#lia-body .lia-content table.lia-list-wide th, #lia-body .lia-content table.lia-list-wide th a {
    color: #000000;
}

#lia-body .lia-content table.lia-list-wide th {
    background-color: #EAEAEA;
}

 

Add this to the CSS tab in your skin will switch the color scheme of the heading bars and sub headings.  I added a quick screen shot so you can see what it would look like.


switch-header.png
  • MoniqueL's avatar
    MoniqueL
    Lithium Alumni (Retired)
    14 years ago

    I just wanted to add another note about setting/customizing skins. What Kaela and Jeff said should help you solve your dilemma, also this solution works well when you base your custom skin with the "Community  Base Skin" that you appear to be using judging from the screen shot attached.

     

    Note that when using one of the many other base skins lithium offers (White UI, Castle Rock UI, Pacifica UI, et. al) that this css may need some tweaking as each "base"  skin you can select varies slightly in style, but they retain the same classes and image file names so overriding them with your preferred customizations would be relatively the same.

    • memerylane's avatar
      memerylane
      Expert
      14 years ago

      Thank you all very much! We'll use this information moving forward to make adjustments.

      • memerylane's avatar
        memerylane
        Expert
        14 years ago

        Hmm. Almost there, but not quite apparently.

         

        Most of the elements took when I inserted the aforementioned CSS code, but the module background is still off-white.

         

        I've attached a picture. I imagine there's just one more setting I need to change or override?


        offwhite.jpg