diff --git a/extensions/mentions/less/forum.less b/extensions/mentions/less/forum.less index 244e81e6be..cb7e3a8138 100644 --- a/extensions/mentions/less/forum.less +++ b/extensions/mentions/less/forum.less @@ -30,10 +30,7 @@ margin-left: 0; } - // @TODO: 2.0 use an icon in the XSLT template. - &:before { - .fas(); - content: @fa-var-reply; + .icon { margin-right: 5px; } } diff --git a/extensions/mentions/src/ConfigureMentions.php b/extensions/mentions/src/ConfigureMentions.php index 2670dbb2e1..6c0107e800 100644 --- a/extensions/mentions/src/ConfigureMentions.php +++ b/extensions/mentions/src/ConfigureMentions.php @@ -122,10 +122,10 @@ private function configurePostMentions(Configurator $config): void $tag->template = ' - + - + '; diff --git a/extensions/tags/js/src/common/components/TagSelectionModal.tsx b/extensions/tags/js/src/common/components/TagSelectionModal.tsx index d0f275f8a3..496a958c81 100644 --- a/extensions/tags/js/src/common/components/TagSelectionModal.tsx +++ b/extensions/tags/js/src/common/components/TagSelectionModal.tsx @@ -194,7 +194,7 @@ export default class TagSelectionModal< {tags.map((tag) => (
  • (this.indexTag = tag)} onclick={this.toggleTag.bind(this, tag)} > - {tagIcon(tag)} + + {tagIcon(tag, { className: 'SelectTagListItem-tagIcon' })} + + {highlight(tag.name(), filter)} {tag.description() ? {tag.description()} : ''}
  • diff --git a/extensions/tags/less/common/TagSelectionModal.less b/extensions/tags/less/common/TagSelectionModal.less index 184f52bc9e..0237c9ad39 100644 --- a/extensions/tags/less/common/TagSelectionModal.less +++ b/extensions/tags/less/common/TagSelectionModal.less @@ -77,6 +77,13 @@ } } +.SelectTagListItem-checkIcon { + position: absolute; + inset: 0; + display: none; + background-color: transparent; +} + .SelectTagList { padding: 0; margin: 0; @@ -124,26 +131,27 @@ } &.selected { - .icon::before { - .fas(); - content: @fa-var-check !important; + .SelectTagListItem-checkIcon { + display: inline-block; color: var(--muted-color); font-size: 14px; - text-align: center; - vertical-align: 1px; } - - &.colored .TagIcon:before { + .SelectTagListItem-tagIcon::before { + visibility: hidden; + } + &.colored .TagIcon + .SelectTagListItem-checkIcon { color: #fff; } } - .TagIcon { - vertical-align: top; - margin-top: 3px; - margin-left: 0; - } } } +.SelectTagListItem-icon { + position: relative; + display: inline-block; + vertical-align: top; + margin-top: 3px; + margin-left: 0; +} .SelectTagListItem-name { display: inline-block; width: 150px; diff --git a/framework/core/js/src/forum/components/Composer.js b/framework/core/js/src/forum/components/Composer.js index 9c094865f5..90cd08d945 100644 --- a/framework/core/js/src/forum/components/Composer.js +++ b/framework/core/js/src/forum/components/Composer.js @@ -338,7 +338,10 @@ export default class Composer extends Component { items.add( 'minimize', extends Compone })} >
    +