HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Please upgrade here. These earlier versions are no longer being updated and have security issues.

Problem with background/font

This discussion is related to the Dark Mist addon.

I did edited custom.css I tried many time to change the background color and also font because now we cant see nothing...

Also when you put a new code color , do you have to write only 3 numbers?


  • vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2013

    Hi, to make the font color of the whole thing the same , body{ color: #ffffff;}

    the shortened version of the color code is for colors that have repeating letters or numbers. like white #fff or black #000.

    Use browser extension firebug and choose inspect element on the part that you want to edit. That way you can edit the css and see what works before you actually edit you custom.css

    here is link to Color Charts http://www.color-hex.com

  • Thanks for all those precious informations, but im in the custom.css but im confused with wich one I can modify for the font show up.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    Every section has it's own font color and size. What I suggest is that you make a list of all the color codes in that theme and then find the colors you wish to replace them with. Then exchange them.

    Before you start to edit your custom.css you should first get familiar with all the sections involved. Give a link to your page see if I can help better...

  • here the site with link i try to located this part to make the writting visible...


  • when I inspect it it say nilla blogs i have to go on the theme or nilla blog custom.css? i keep modifing and i dont see any change

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    you can copy the theme css into nilla blog css but a few things might be different so you would have to add them, I used the same theme you have but totally redone. Do you want a dark background also in the comments?
    Please disable minify plugin.

  • yes , to keep the same way with the theme , but i spent 3hrs to understand and im confused wich files i need to use

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    yes, you need to only edit the custom.css in the dark mist theme folder. Minify plugin needs to be disabled because it interferes with editing.

    Let me work on it, but you have to disable any plugins that interfere with the theme, except nilla blog, that has it's own css.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2013

    Ok the code here will make everything white dark on the page you asked about., put this code in the custom css for the theme you are using. Turn off minify.

    div.Tabs.HeadingTabs.FirstPage {
    margin-top: 14px;
    padding: 13px 12px 4px 12px;
    background: #333;
    border: 2px solid #666;
    border-bottom: none;
    -webkit-border-top-left-radius: 5px 5px;
    -webkit-border-top-right-radius: 5px 5px;
    -moz-border-top-left-radius: 5px 5px;
    -moz-border-top-right-radius: 5px 5px;
    -goog-ms-border-top-left-radius: 5px 5px;
    -goog-ms-border-top-right-radius: 5px 5px;
    border-top-left-radius: 5px 5px;
    border-top-right-radius: 5px 5px;
    z-index: 9999;
    ul.MessageList li.Item {
    background: #000;
    background: #000;
    ul.MessageList li.Item.FirstComment.NillaBlog {
    padding: 0px 12px 12px 12px;
    margin-bottom: 15px;
    background: #333;
    border: 2px solid #666;
    border-top: none;
    -webkit-border-bottom-left-radius: 5px 5px;
    -webkit-border-bottom-right-radius: 5px 5px;
    -moz-border-bottom-left-radius: 5px 5px;
    -moz-border-bottom-right-radius: 5px 5px;
    -goog-ms-border-bottom-left-radius: 5px 5px;
    -goog-ms-border-bottom-right-radius: 5px 5px;
    border-bottom-left-radius: 5px 5px;
    border-bottom-right-radius: 5px 5px;
    div.AnswerTabs {
    margin-top: 12px;
    padding: 6px 8px 0;
    font-size: 12px;
    text-align: right;
    position: relative;
    background: #333;
    div.AnswerTabs strong {
    position: absolute;
    left: 8px;
    color: red;
    font-weight: bold;
    font-size: 16px;
    margin-right: 20px;
    div.AnswerTabs li.Active a {
    padding: 6px 10px 5px;
    position: relative;
    top: 1px;
    border: 2px solid #999;
    border-bottom: none;
    font-weight: bold;
    #Head form input.InputBox {
    width: 204px;
    border: 0;
    padding: 4px;
    margin: 0 6px 0 0;
    background: #000;
    -moz-border-radius: 2px;
    -webkit-border: 2px;
    border: 2px solid #666;
    color: red;
    font-size: 13px;
    vertical-align: bottom;
  • vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2013

    You can also make the banner larger so it takes up the width of the page.

    #Head h1 a span img{
  • thanks im trying in 1h keep u posted thanks again

  • i tried but im lost can u go on my ftp and help me?

  • Ok i figured out and did step by step and now my homepage and when you click on discussion it white... does it come from custom.css on theme ?

  • peregrineperegrine MVP
    edited January 2013

    @x00 said:

    The reality is unless you learn properly how to style css and html, the picking up titbit isn't going to help understand better. Either hire someone, or learn.

    I would learn from a comprehensive source like html dog. Then you will be able to know enough to be able to at least do theme'ng for different web software.

    It is not really fair to expect people to catch every mistake, where a quick result is more important then stopping and picking up a book so you understand it.



    @OPS2 see http://vanillaforums.org/discussion/comment/161126/#Comment_161126

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited January 2013

    il est nécessaire qu'il enlève le Minify plugin,Ce Plugin n'est pas compatible avec le thème , ce c'est le problème, je ne peux pas aider si non faisceaux cela ok?

    utilisez cet outil pour Firefox pour changer le style


Sign In or Register to comment.