UX: `no-text` style being incorrectly added to tag suggester (#987)

In the tag suggester menu we use `DButton` as a wrapper element and use the `discourseTag` helper to render the text inside the element. So visually there is text content inside the button. However, since `DButton` assumes that no `label`/`translatedLabel` inside an element means `.no-text` CSS style should be applied to the button's element, it was resulting in some incorrect styling being applied to this menu. This PR resolves that by programmatically adding the tag as a `translatedLabel` and then visually hiding it with CSS.
This commit is contained in:
Keegan George 2024-12-03 03:11:04 +09:00 committed by GitHub
parent c53363406d
commit 50ad5415ff
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 0 deletions

View File

@ -198,6 +198,7 @@ export default class AiTagSuggester extends Component {
data-name={{suggestion.name}} data-name={{suggestion.name}}
data-value={{index}} data-value={{index}}
title={{suggestion.name}} title={{suggestion.name}}
@translatedLabel={{suggestion.name}}
@disabled={{this.isDisabled suggestion}} @disabled={{this.isDisabled suggestion}}
@action={{fn this.applySuggestion suggestion}} @action={{fn this.applySuggestion suggestion}}
> >

View File

@ -266,6 +266,10 @@
.discourse-tag-count { .discourse-tag-count {
margin-left: 5px; margin-left: 5px;
} }
.d-button-label {
display: none;
}
} }
} }