Colorize cells when a new message is posted (script issue)

First topic message reminder :

Hello,

I have tried to follow the script from Ange Tuteur but this one doesn't work on my forum.

Please find this one here: https://help.forumotion.com/t136044-colorize-the-cells-when-a-new-message-is-posted#916950

I have added the script but I don't understand how and where shall I change the image url?

CSS is added too...

Thanks for your help,

Ok, I have changed the code you wrote and remove this one but the line with the orange color doesn't appears now...

.forabg dl.icon {
      background:none !important;
      position:relative;
    }

    .blocImg {
      width:50px;
      background-repeat:no-repeat;
      background-position:center;
      position:absolute;
      left:0;
      top:0;
      bottom:0;
    }

EDIT:

However, it works for privates messages but how can I recover my line which color the category when a new message is posted?

Thanks,

Add this to the top of your stylesheet :
( to color categories )

Code:

dl.icon.newpost { background-color:orange !important }

Also, you replaced what you had, with this ?

Code:

.forabg ul:not(.pmlist) dl.icon {
  background:none !important;
  position:relative;
}

.blocImg {
  width:50px;
  background-repeat:no-repeat;
  background-position:center;
  position:absolute;
  left:0;
  top:0;
  bottom:0;
}

ul:not(.pmlist) prevents it from affecting the private message list

Yes Ange Tuteur.

Please find my CSS and I have moved the last code to the top of the page but no change.

Code:

dl.icon.newpost { background-color:#FFCC99 !important }

/* Icônes couleur dans la palette */
       
        .color-option {
        display: inline-block !important;
        width: 15px !important;  /* largeur de l'icône couleur */
        height: 15px !important;  /* hauteur de l'icône couleur */
        border: 2px solid #fff !important;  /* cadre blanc sur l'icône couleur */
        margin: 3px !important;  /* espace entre chaque icône */
        box-shadow: 0 0 2px #778899;  /* ombre */
        cursor: pointer !important;
        }
        .color-option span{
        display: block !important;
        width: 15px !important;  /* largeur de l'icône couleur */
        height: 15px !important;  /* hauteur de l'icône couleur */
        }
        .color-option, .color-option span {
        border-radius: 2px;  /* arrondi */ 
        }
       
        /* Palette complète - la largeur influence le nombre d'icônes affichées */
        .sceditor-dropdown.sceditor-color-picker {
        width: 200px !important;  /* largeur de la palette complète */
        height: 100px !important;  /* hauteur de la palette complète */
        padding: 5px !important;
        border-radius: 5px !important;
        }


/* CSS PAR SOS-FORUM.COM */

/* General */
#wrap {width: 80%; margin-top: 250px;  -webkit-box-shadow: 0px 0px 12px #000000; -moz-box-shadow: 0px 0px 12px #000000; box-shadow: 0px 0px 12px #000000; padding: 10px; border: 6px solid #ffffff; }
body { padding: 0px; margin: 0px; }
* { -webkit-transition: color 0.3s ease; -moz-transition: color 0.3s ease; transition: color 0.3s ease; }

/* Navbar */
.navbar { background-color: transparent; margin: 0px; padding: 0px; width: auto!important; }
.navbar ul{border-bottom:none; width: auto!important;}
ul.navlinks {  background-color: #008ced; background-image: url('http://i67.servimg.com/u/f67/11/27/24/66/blue15.png'); background-repeat: repeat-x; background-position: top left; position: fixed; top: 0px; left: 0px; z-index: 50; width: auto!important; border-right: 4px solid #ffffff;  border-bottom: 4px solid #ffffff; -webkit-box-shadow: 0px 0px 12px #000000; -moz-box-shadow: 0px 0px 12px #000000; box-shadow: 0px 0px 12px #000000; -moz-border-radius: 0px 0px 10px 0px; -webkit-border-radius: 0px 0px 10px 0px; border-radius: 0px 0px 10px 0px; -khtml-border-radius: 0px 0px 10px 0px; padding: 2px; }

/* Menu Links */
.mainmenu { -moz-border-radius: 10px 2px 10px 2px; -webkit-border-radius: 10px 2px 10px 2px; border-radius: 10px 2px 10px 2px; -khtml-border-radius: 10px 2px 10px 2px; border: 2px solid #ffffff; padding: 5px; background-color: #E0F4FF; -webkit-box-shadow: 0px 0px 4px #000000; -moz-box-shadow: 0px 0px 4px #000000; box-shadow: 0px 0px 4px #000000; display: block; margin: 6px; }
.mainmenu:hover { background-color: #FAE3BB; -moz-transform: rotate(12deg);  transform: rotate(12deg); }
.mainmenu:focus { background-color: #FABBBB; -moz-transform: rotate(24deg);  transform: rotate(24deg); }

/* Round  */
#wrap { -moz-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; -khtml-border-radius:20px; }
       
       
        table
        {
        -moz-border-radius:10px;
        -webkit-border-radius:10px;
        border-radius:10px;
        -khtml-border-radius:10px;
        }
       

/* Header, Modules, Forums & Messages  */
.forabg, .forumbg, .post, .module { -webkit-box-shadow: 0px 0px 6px #6F7B82; -moz-box-shadow: 0px 0px 6px #6F7B82; box-shadow: 0px 0px 6px #6F7B82; border: 4px solid #ffffff;  }
.forabg, .forumbg, .module { background-color: #044E8F; background-image: url(''); background-repeat: repeat-x; background-position: top left;  }
.module .inner {background-color: #ffffff; padding: 2px!important;}
.module {padding: 5px!important;}
.module .h3 {text-align: center;}

/* Profiles  */
.postprofile { background: #B8DDF2; padding: 4px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px; border:none; }

/* Borders  */
ul.topiclist dd, ul.forums dd, li.row:hover dd  { border-left: none; }

/* Searchbox  */
#search-box { position: absolute; top : 24px; right: 12%;  -webkit-box-shadow: 0px 0px 6px #000000; -moz-box-shadow: 0px 0px 6px #000000; box-shadow: 0px 0px 6px #000000;}
#search-box input#keywords { -moz-border-radius: 8px 0px 0px 8px; -webkit-border-radius: 8px 0px 0px 8px; border-radius: 8px 0px 0px 8px;}
#search-box input.button2 { -moz-border-radius: 0px 8px 8px 0px; -webkit-border-radius: 0px 8px 8px 0px; border-radius: 0px 8px 8px 0px; border-left: none; }

/* Admin Text */
.introduction { -webkit-box-shadow: 0px 0px 6px #6F7B82; -moz-box-shadow: 0px 0px 6px #6F7B82; box-shadow: 0px 0px 6px #6F7B82; border: 4px solid #ffffff; color: #ffffff;  background-color: #044E8F; background-image: url(''); background-repeat: repeat-x; background-position: top left; }
.introduction .h3 {color: #ffffff; border-color: #ffffff; padding-left: 10px; background: transparent url('http://i67.servimg.com/u/f67/11/27/24/66/i_up_a11.gif')  left no-repeat;}

/* Header */
.headerbar {position: absolute; top: 0px; left: 0px;  width: 99%; background: transparent url('http://i67.servimg.com/u/f67/11/27/24/66/previe16.png') scroll top center no-repeat; height: 250px;}


/* Profils */
.postprofile a img { -webkit-box-shadow: 0px 0px 6px #6F7B82; -moz-box-shadow: 0px 0px 6px #6F7B82; box-shadow: 0px 0px 6px #6F7B82; border: 4px solid #ffffff;  -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px; background: #E8E8E8;  }

.postprofile a img:hover { -webkit-box-shadow: 0px 0px 6px #044E8F; -moz-box-shadow: 0px 0px 6px #044E8F; box-shadow: 0px 0px 6px #044E8F; }
 
.qeel a {
font-weight: bold;
}

#google_translate_element {
width: 124px;
overflow: hidden;
}
#google_translate_element select { width: 124px; font-weight: bold; border: 3px solid blue; color: red; text-align: center;
}

.usersavatar img { width:50% }

    .fa_avatar img {
      width:25px;
      height:25px;
      margin-right:5px;
      margin-bottom:-6px;
      -webkit-border-radius:3px;
        -moz-border-radius:3px;
              border-radius:3px;
    }

    /* Warning buttons */
   
    .mod_mess, .adm_mess {
    margin: 5px auto;
    width: 90%;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    }
   
    .mod_mess a.postlink, .adm_mess a.postlink {
    color: #FFF !important;
    text-decoration: underline !important;
    }
   
    /* Administrator bb-Code - message block */
   
    .adm_mess {
    background: #e54858;
    background: -moz-linear-gradient(left, #e54858 0%, #f5b57a 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #e54858), color-stop(100%, #f5b57a));
    background: -webkit-linear-gradient(left, #e54858 0%, #f5b57a 100%);
    background: -o-linear-gradient(left, #e54858 0%, #f5b57a 100%);
    background: -ms-linear-gradient(left, #e54858 0%, #f5b57a 100%);
    background: linear-gradient(left, #e54858 0%, #f5b57a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e54858", endColorstr="#f5b57a", GradientType=1);
    -webkit-box-shadow: 4px 4px 0px 0px #352727;
    -moz-box-shadow: 4px 4px 0px 0px #352727;
    box-shadow: 4px 4px 0px 0px #352727;
    }
   
    /* Administrator bb-Code - title */
    .adm_mess .titl {
    font-size: 15px;
    font-weight: bold;
    padding: 5px;
    border-bottom: 1px dashed #B60505;
    }
     
    /* Administrator BB-Code - text presentation */
    .adm_mess .titl + div {
    display: block;
    margin-left: 10px;
    padding: 25px 5px 25px 80px;
    background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome-10.png) no-repeat left center;
    }
   
    /* Moderator BB-Code - message block */
   
    .mod_mess {
    background: #5c93f5;
    background: -moz-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #5c93f5), color-stop(100%, #afcfda));
    background: -webkit-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
    background: -o-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
    background: -ms-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
    background: linear-gradient(left, #5c93f5 0%, #afcfda 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5c93f5", endColorstr="#afcfda", GradientType=1);
    -webkit-box-shadow: 4px 4px 0px 0px #352727;
    -moz-box-shadow: 4px 4px 0px 0px #352727;
    box-shadow: 4px 4px 0px 0px #352727;
    }
   
    /* Moderator BB-Code - title */
    .mod_mess .titl {
    font-size: 15px;
    font-weight: bold;
    padding: 5px;
    border-bottom: 1px dashed #0D4DD3; 
    }
     
    /* Moderator BB-Code - text presentation */
    .mod_mess .titl + div {
    display: block;
    margin-left: 10px;
    padding: 25px 5px 25px 80px;
    background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome610.png) no-repeat left center;
    }

    #search-box { display:none }

.twitter-timeline.twitter-timeline-rendered { min-width: 0 !important; height: 350px; }
#right { margin: 20px 0 0 0px; }

    br.clear { display:none }

    .module { border-radius:4px }

    #postingbox.panel, .panel.introduction, div.post, .forabg, .forumbg, .module { border-radius:8px }   

    .forabg, .forumbg, .post, .module { box-shadow:none }

    .descImg {
      /* properties.. */
    }

    ul.navlinks a { display:inline }
    ul.navlinks {
      position:absolute;
      border:4px solid #FFF;
      border-radius:6px;
      padding:6px;
      top:210px;
      left:35%;
    }
    a.mainmenu[href*="gallery"], a.mainmenu[href="/groups"] { display:none }

      .linklist.navlinks.borderless {
      border:none !important;
      background:none !important;
      box-shadow:none !important;
    }

    .linklist.navlinks.borderless {
      left:0 !important;
      right:0 !important;
      text-align:center;
    }

    ul.navlinks {
      left:0 !important;
      right:0 !important;
      text-align:center;
      background:none !important;
      border:none !important;
      box-shadow:none !important;
    }

    .linklist.navlinks li { margin:0 -3px }

    .new-message { color:#F00 !important }

   
    .forabg ul:not(.pmlist) dl.icon {
          background:none !important;
          position:relative;
        }

        .blocImg {
          width:50px;
          background-repeat:no-repeat;
          background-position:center;
          position:absolute;
          left:0;
          top:0;
          bottom:0;
        }

I see the problem, I feel blind !

Replace this :

Code:

.forabg ul:not(.pmlist) dl.icon {
  background:none !important;
  position:relative;
}

by this :

Code:

.forabg ul:not(.pmlist) dl.icon {
  background-image:none !important;
  position:relative;
}

Everything is ok after this change!
Thanks a lot Ange Tuteur and thanks to Twisted too.

Well done guys.

You're welcome ^^

Topic archived