# Unread indicator/counter on a new line
**URL:** https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719
**Category:** UX
**Created:** [April 19, 2018, 2:52pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719 "2018-04-19T14:52:54Z")
**Posts on this page:** 15
**Page:** 1
### Author:  [@bartv](https://meta.discourse.org/u/bartv)
#### Post date: [April 19, 2018, 2:52pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/1 "2018-04-19T14:52:54Z")
Hardly world shattering, but the OCD part of me can’t handle things like this 😉
and
---
### Author:  [@notriddle](https://meta.discourse.org/u/notriddle)
#### Post date: [April 19, 2018, 4:15pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/2 "2018-04-19T16:15:55Z")
[https://github.com/discourse/discourse/pull/5772](https://github.com/discourse/discourse/pull/5772)
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [April 19, 2018, 10:03pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/3 "2018-04-19T22:03:33Z")
What do you think @awesomerobot?
---
### Author:  [@riking](https://meta.discourse.org/u/riking)
#### Post date: [April 20, 2018, 1:42am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/4 "2018-04-20T01:42:02Z")
Can you explain what the `~` in Handlebars does within the commit message?
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [April 20, 2018, 1:57am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/5 "2018-04-20T01:57:37Z")
I agree @bartv! this is a slight annoyance for me too.
@notriddle, I just tried this out and it’s not working for me.
```CSS
.topic-post-badges {
white-space: nowrap;
}
```
This is preventing wrapping _within_ `.topic-post-badges`, whitespace between the badges and the title will still wrap.
As long as these two elements are siblings I don’t think we can avoid widowing the badges.
The only way I can think of to get this to work would be placing `.topic-post-badges` div inside the `a.title.raw-link.raw-topic-link`, and then use an ` ` to put a space between the badges and the link text…
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [April 20, 2018, 2:01am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/6 "2018-04-20T02:01:18Z")
~ strips out whitespace (in this case the preceding whitespace), more examples: [http://handlebarsjs.com/expressions.html#whitespace-control](http://handlebarsjs.com/expressions.html#whitespace-control)
---
### Author:  [@notriddle](https://meta.discourse.org/u/notriddle)
#### Post date: [April 20, 2018, 2:07am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/7 "2018-04-20T02:07:56Z")
I added a mention of what the `~` syntax does.
[https://github.com/notriddle/discourse/commit/d656968c4acc073fdf19513a003a11805a5b237c](https://github.com/notriddle/discourse/commit/d656968c4acc073fdf19513a003a11805a5b237c)
> [@awesomerobot](#):
>
> This is preventing wrapping within .topic-post-badges, whitespace between the badges and the title will still wrap.
That’s why I tried to strip all the whitespace between the badges and the link text itself. I’m guessing that something’s getting rendered between them, and it contains whitespace on the particular topic that you’re looking at.
[https://global.discourse-cdn.com/meta/original/3X/7/5/75e18748d1c1b253b94e79d5260f7f80bad87b3e.mp4](https://global.discourse-cdn.com/meta/original/3X/7/5/75e18748d1c1b253b94e79d5260f7f80bad87b3e.mp4)
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [April 20, 2018, 2:21am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/8 "2018-04-20T02:21:42Z")
Strange that it works for you… I even tried to remove any additional whitespace manually from the inspector just to test it
[https://global.discourse-cdn.com/meta/original/3X/3/6/36b6b430c83aa939c42625176f7358a3f8edfa5b.mp4](https://global.discourse-cdn.com/meta/original/3X/3/6/36b6b430c83aa939c42625176f7358a3f8edfa5b.mp4)
I can just merge it and see what happens, worst case scenario is nothing changes.
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [April 20, 2018, 5:14am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/9 "2018-04-20T05:14:14Z")
Changes are live here and I’m still seeing widowing… are you seeing the same @notriddle? I can’t imagine this would be a browser/OS difference… so I’m back to thinking:
> [@awesomerobot](#):
>
> As long as these two elements are siblings I don’t think we can avoid widowing the badges.
---
### Author:  [@notriddle](https://meta.discourse.org/u/notriddle)
#### Post date: [April 20, 2018, 5:16pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/10 "2018-04-20T17:16:02Z")
It has to be dependent on the browser version (I’m a Firefox, you’re a Chrome).
Maybe we should change [https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/templates/topic-post-badges.raw.hbs](https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/templates/topic-post-badges.raw.hbs) to start with a ` `? I notice that the space that’s supposed to be between the badge and the topic title is present in my browser, but absent in yours, meaning there’s probably some whitespace collapsing difference that’s influencing where the line break is (or, in my case, would be) happening.
---
### Author:  [@notriddle](https://meta.discourse.org/u/notriddle)
#### Post date: [April 20, 2018, 6:14pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/11 "2018-04-20T18:14:58Z")
Okay, I tried it in another browser (MS Edge, actually) and it’s behaving like your browser is. I managed to fix it so that it works right in both Edge and Firefox. But before opening another PR, let’s try iterating in Theme Creator:
[https://theme-creator.discourse.org/theme/notriddle/no-widowing](https://theme-creator.discourse.org/theme/notriddle/no-widowing)
Does that work in your browser, @awesomerobot?
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [April 20, 2018, 6:23pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/12 "2018-04-20T18:23:41Z")
🎉 that did it! thanks for figuring it out, this fix is much simpler than what the alternative would have been. If you make a PR I can merge it in.
---
### Author:  [@notriddle](https://meta.discourse.org/u/notriddle)
#### Post date: [April 20, 2018, 6:30pm UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/13 "2018-04-20T18:30:52Z")
[https://github.com/discourse/discourse/pull/5775](https://github.com/discourse/discourse/pull/5775)
---
### Author:  [@notriddle](https://meta.discourse.org/u/notriddle)
#### Post date: [April 21, 2018, 12:24am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/14 "2018-04-21T00:24:37Z")
There was one minor problem still there
[https://github.com/discourse/discourse/pull/5777](https://github.com/discourse/discourse/pull/5777)
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [April 24, 2018, 4:00am UTC](https://meta.discourse.org/t/unread-indicator-counter-on-a-new-line/85719/15 "2018-04-24T04:00:00Z")
This topic was automatically closed after 3 days. New replies are no longer allowed.