UX: fix and improve topic title badge spacing (#25441)

This commit is contained in:
Kris 2024-01-26 12:11:03 -05:00 committed by GitHub
parent f2e1363f67
commit 4266b0cf7d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 11 additions and 20 deletions

View File

@ -14,9 +14,9 @@
{{raw "topic-status" topic=this.topic}} {{raw "topic-status" topic=this.topic}}
{{topic-link this.topic}} {{topic-link this.topic}}
{{~#if this.topic.featured_link}} {{~#if this.topic.featured_link}}
{{topic-featured-link this.topic}}  {{topic-featured-link this.topic}}
{{/if}} {{/if}}{{! intentionally inline
<TopicPostBadges to avoid whitespace}}<TopicPostBadges
@unreadPosts={{this.topic.unread_posts}} @unreadPosts={{this.topic.unread_posts}}
@unseen={{this.topic.unseen}} @unseen={{this.topic.unseen}}
@url={{this.topic.lastUnreadUrl}} @url={{this.topic.lastUnreadUrl}}

View File

@ -1,14 +1,12 @@
{{#if this.displayUnreadPosts}} {{~#if this.displayUnreadPosts}}&nbsp;<a
&nbsp;<a
href={{this.url}} href={{this.url}}
title={{i18n "topic.unread_posts" count=this.displayUnreadPosts}} title={{i18n "topic.unread_posts" count=this.displayUnreadPosts}}
class="badge badge-notification unread-posts" class="badge badge-notification unread-posts"
>{{this.displayUnreadPosts}}</a> >{{this.displayUnreadPosts}}</a>
{{/if}} {{/if~}}
{{#if this.unseen}} {{~#if this.unseen}}&nbsp;<a
&nbsp;<a
href={{this.url}} href={{this.url}}
title={{i18n "topic.new"}} title={{i18n "topic.new"}}
class="badge badge-notification new-topic" class="badge badge-notification new-topic"
>{{this.newDotText}}</a> >{{this.newDotText}}</a>
{{/if}} {{/if~}}

View File

@ -22,7 +22,7 @@
{{~raw "topic-status" topic=topic}} {{~raw "topic-status" topic=topic}}
{{~topic-link topic class="raw-link raw-topic-link"}} {{~topic-link topic class="raw-link raw-topic-link"}}
{{~#if topic.featured_link}} {{~#if topic.featured_link}}
{{~topic-featured-link topic}} &nbsp;{{~topic-featured-link topic}}
{{~/if}} {{~/if}}
{{~raw-plugin-outlet name="topic-list-after-title"}} {{~raw-plugin-outlet name="topic-list-after-title"}}
{{~raw "list/unread-indicator" includeUnreadIndicator=includeUnreadIndicator {{~raw "list/unread-indicator" includeUnreadIndicator=includeUnreadIndicator

View File

@ -72,6 +72,8 @@
.badge-notification { .badge-notification {
@extend %badge; @extend %badge;
position: relative;
top: -2px;
padding: 0.21em 0.42em; padding: 0.21em 0.42em;
min-width: 0.5em; min-width: 0.5em;
color: var(--secondary); color: var(--secondary);
@ -97,6 +99,7 @@
&.new-topic { &.new-topic {
background-color: transparent; background-color: transparent;
padding-left: 0.15em;
} }
&.new-topic::before { &.new-topic::before {

View File

@ -68,16 +68,6 @@
} }
} }
.badge-notification {
position: relative;
top: -2px;
&.new-topic {
top: -1px;
padding-left: 2px;
}
}
$td-posters-height: 29px; // min-height of td with avatar glow $td-posters-height: 29px; // min-height of td with avatar glow
$td-posters-more-lh: $td-posters-height - 4; $td-posters-more-lh: $td-posters-height - 4;