Remove button view from reaction summary list

See #2508

diff --git a/com.woltlab.wcf/templates/reactionSummaryList.tpl b/com.woltlab.wcf/templates/reactionSummaryList.tpl
index f9108f15f9e57fe20e842f9144cd1ec7ae0880fb..8a70bae2fbb7934dd872da1534ba237a42347a92 100644 (file)
--- a/com.woltlab.wcf/templates/reactionSummaryList.tpl
+++ b/com.woltlab.wcf/templates/reactionSummaryList.tpl
@@ -2,7 +2,7 @@
        <ul class="reactionSummaryList{if $isTiny|isset && $isTiny} reactionSummaryListTiny{/if} jsOnly" data-object-type="{$objectType}" data-object-id="{$objectID}">
                {if $reactionData[$objectID]|isset && $reactionData[$objectID]->getReactions()|is_array}
                        {foreach from=$reactionData[$objectID]->getReactions() key=reactionTypeID item=reaction}
-                               <li class="reactCountButton jsTooltip" data-reaction-type-id="{$reactionTypeID}" title="{lang}wcf.reactions.summary.listReactions{/lang}">{@$reaction[renderedReactionIcon]} <span class="reactionCount">{$reaction[reactionCount]|shortUnit}</span></li>
+                               <li class="reactCountButton jsTooltip" data-reaction-type-id="{$reactionTypeID}" title="{lang}wcf.reactions.summary.listReactions{/lang}"><span class="reactionCount">{$reaction[reactionCount]|shortUnit}</span> {@$reaction[renderedReactionIcon]}</li>
                        {/foreach}
                {/if}
        </ul>

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/CountButtons.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/CountButtons.js
index b1be5b74a5941077ebf3d366613b2484d4073db4..c8673d98c176f074467b56363aa081ebf8d259b8 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/CountButtons.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/CountButtons.js
@@ -130,7 +130,6 @@ define(
                                                // create element 
                                                var createdElement = elCreate('li');
                                                createdElement.className = 'reactCountButton';
-                                               createdElement.innerHTML = REACTION_TYPES[key].renderedIcon + ' '; 
                                                elData(createdElement, 'reaction-type-id', key);
                                                
                                                var countSpan = elCreate('span');
@@ -138,6 +137,8 @@ define(
                                                countSpan.innerHTML = StringUtil.shortUnit(data[key]);
                                                createdElement.appendChild(countSpan);
                                                
+                                               createdElement.innerHTML = createdElement.innerHTML + REACTION_TYPES[key].renderedIcon;
+                                               
                                                summaryList.appendChild(createdElement);
                                                
                                                this._initReactionCountButton(createdElement, objectId);

diff --git a/wcfsetup/install/files/style/ui/reactions.scss b/wcfsetup/install/files/style/ui/reactions.scss
index 622950087de30dbac946c758fe28c3b1f47dc119..6be622e99bcbc0d83d030667700be474ba446cda 100644 (file)
--- a/wcfsetup/install/files/style/ui/reactions.scss
+++ b/wcfsetup/install/files/style/ui/reactions.scss
@@ -26,8 +26,14 @@
 }
 
 img.reactionType {
-       width: 16px;
-       height: 16px;
+       width: 24px;
+       height: 24px;
+}
+
+.reactionSummaryList {
+       span.reactionCount::after {
+               content: ' × ';
+       }
 }
 
 .reactionPopoverContent {
@@ -85,14 +91,12 @@ img.reactionType {
 
 li.reactCountButton {
        display: inline;
-       padding: 10px;
+       padding: 5px;
        cursor: pointer;
-       background-color: $wcfSidebarBackground;
        color: $wcfContentDimmedText;
 }
 
 li.reactCountButton:hover {
-       background-color: darken($wcfSidebarBackground, 5);
        color: $wcfContentText;
 }