[OzzModz] New Icon For Unread Posts 2.0.0

[Ozzy47]

Ozzy47 submitted a new resource:

[OzzModz] New Icon For Unread Posts - Make new posts stand out

Small addon that adds a New post indicator next to threads with unread posts on the forum view page. The backgroung, text color, font weight and size all are controlled with style properties. This makes it easily customizable for each style.

Example:
View attachment 241834

Style properties:
View attachment 241835

Read more about this resource...

 

[maethlin]

This is great, thank you so much.

 

[Ozzy47]

@zoldos I just loaded this addon on a new install and it is showing the icons correctly.

Try on a default style.

 

[zoldos]

I use UI.X Dark from Themehouse. It's probably that. I don't use the default theme.

 

[Hozzie]

I use UI.X Dark from Themehouse. It's probably that. I don't use the default theme.

It worked for me with the UI.X themes, but I just did the part to show the New icon, not the background overall.

 

[zoldos]

It worked for me with the UI.X themes, but I just did the part to show the New icon, not the background overall.

Can you be more specific? I'm using UI.X Dark and couldn't get any of it working as far as I remember...

 

[Hozzie]

Here is my extra.less for UI.X Dark. The top part is just to center my header so disregard that. My icon color is a lime green to match the basic UI.X Dark theme.

.structItem.is-unread .structItem-title::after {
content: "New";
display: inline-block;
background: rgba(139,195,74,0.95);
padding: 1px 4px;
font-size: 11px;
color: white;
border-radius: 3px;
margin-left: 5px;
position: relative;
top: -2px;
}

my result.

 

[zoldos]

Okay I re-installed the mod. Still not working. Here's my extra.less after the changes you suggested:

.actionBar-action--reply, .actionBar-action--mq {
         display: inline-block !important;
         background: rgb(71, 167, 235) !important;
         color: rgb(255, 255, 255) !important;
         padding: 5px 12px 5px;
         line-height: 19px !important;
         border-radius: 4px;
         background: linear-gradient(rgb(71, 167, 235) 0%, rgb(71, 167, 235) 0%);
    }
.actionBar-action--reply:hover, .actionBar-action--mq:hover {
         display: inline-block !important;
         background: #0099ff !important;
         color: rgb(255, 255, 255) !important;
         text-decoration: none !important;
         border-radius: 4px;
         background: linear-gradient(rgb(65, 158, 224) 0%, rgb(65, 158, 224) 0%);
    }
@media (max-width: 800px) {
.actionBar-action--like:hover, .actionBar-action--reaction:hover {
transform: none; }

.structItem.is-unread .structItem-title::after {
content: "New";
display: inline-block;
background: rgba(139,195,74,0.95);
padding: 1px 4px;
font-size: 11px;
color: white;
border-radius: 3px;
margin-left: 5px;
position: relative;
top: -2px;
}
.p-header-logo{margin-left:auto;margin-right:auto;}

The top is another mod. BTW, the center logo didn't work either, See screenshot.

 

[Hozzie]

You must have something overriding it. If you have any child templates, I suppose you could try those. I am not technical enough on this to give much more help.

Good luck.

 

[zoldos]

You must have something overriding it. If you have any child templates, I suppose you could try those. I am not technical enough on this to give much more help.

Good luck.

It's all good. I'm not a hardcore coder, but I'm pretty good with tinkering and figuring things out. Thank you for your time!

 

[sross]

@Ozzy47 works great, but I notice when you go to "new posts" you see the icon on every post, so is there a way to remove the icon on new post page? Thanks! also maybe even move icon to the left side of thread title?