MyBB Community Forums

My thread status css is a bit funky as I take a further look into it.

For "Contains new posts. Posts by you" and "Contains new posts" both use the same thread status icon and the same css element, .dot_newfolder:after, .newfolder:after. I want to change the thread status for "Posts by you" status that way it is different from the icon which contains new posts, but you have not posted in it.

What steps should I take, or any guide, that I can follow to get this to how it should be? Thanks!

Bump.

If you just want to replace some thread icons, edit the image file ./images/folders_sprite.png.
It contains all icons in one image.

CSS is just the method to move this background sprite image to the right position. Generall there is no need to modify CSS - unless you're going to replace this image by a larger one.

[ExiTuS]

(2019-08-29, 08:06 AM)[ExiTuS] Wrote: [ -> ]If you just want to replace some thread icons, edit the image file ./images/folders_sprite.png.
It contains all icons in one image.

CSS is just the method to move this background sprite image to the right position. Generall there is no need to modify CSS - unless you're going to replace this image by a larger one.

[ExiTuS]

I am using font-awesome icons. As seen a few details in thread_status.css

.thread_status {
    position: relative;
    margin: 0px;
    text-align: center;
    display: inline-block;
    width: 24px;
}
.page_forumdisplay .thread_status {
  	width: 24px;
    right: 0;
    top: 30%;
    position: absolute;
}
.thread_status:before {
}
.thread_status:after {
  position: relative;
  font-family: 'Font Awesome 5 Pro';
  content:"\f111";
  font-size: 20px;
}
.thread_status[class*="lock"]:after {
  content: "\f05e";
}
.thread_status[class*="dot"]:after {

}
.dot_hotfolder:after, .dot_newhotfolder:after, .hotfolder:after, .newhotfolder:after {
  content: "\f06d";
}
.dot_newfolder:after, .newfolder:after {
  content: "\f00c";
}
.movefolder:after {
   content: "\f08e";
}
*[class*="hot"]:after {
  color:#D9534F;
}
*[class*="new"]:after { 
  color:#5CB85C;
}
/** Update V1.2 **/
.thread_legend .thread_status {
	margin: 0 5px 0 0;
}

.dot_folder:after,
.dot_hotfolder:after,
.dot_hotclosefolder:after,
.dot_closefolder:after,
.folder:after,
.hotfolder:after,
.hotclosefolder:after,
.closefolder:after,
.movefolder:after {
	color: #5d5d5d !important;
}

.hotclosefolder:after,
.closefolder:after,
.dot_hotclosefolder:after,
.dot_closefolder:after {
	content: "\f023";
}

Bump.

Bump.