maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Multiple Reactions UI fixes (#19077)

Browse source 
* Multiple Reactions UI fixes

* Minor fixes
This commit is contained in:
Rajat Talesra 2023-02-10 10:36:04 +05:30 • committed by GitHub
parent a2461cefce
commit 0b684eb421
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 1 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
app/assets/javascripts/initializers/initializeArticleReactions.js
View file

@ -46,28 +46,6 @@ function showUserReaction(reactionName, animatedClass) {
if (reactionDrawerButton && reactionName !== 'readinglist') {
reactionDrawerButton.classList.add('user-activated', 'user-animated');
}
if (animatedClass == 'user-animated') {
const activeIcon = reactionButton.querySelector(
'.crayons-reaction__icon--active img',
);
if (activeIcon) {
const activeDrawerIcon = reactionDrawerButton.querySelector(
'.crayons-reaction__icon--active img',
);
reactionDrawerButton.originalIcon = activeDrawerIcon.outerHTML;
activeDrawerIcon.outerHTML = activeIcon.outerHTML;
setTimeout(function () {
document
.getElementById('reaction-drawer-trigger')
.querySelector('.crayons-reaction__icon--active img').outerHTML =
reactionDrawerButton.originalIcon;
}, 1500);
}
}
}
function hideUserReaction(reactionName) {

8
app/assets/stylesheets/views/article.scss
View file

@ -211,10 +211,6 @@
.crayons-reaction__icon--active {
display: block;
}
.crayons-reaction__count {
color: var(--reaction-color);
}
}
&--like {
@ -444,10 +440,6 @@
}
}
.crayons-reaction_total_count {
color: var(--btn-color); // Mobile safari button text blue bug
}
.reaction-drawer__outer:hover .reaction-drawer {
@media (min-width: $breakpoint-m) {
display: block;

2
app/views/articles/_multiple_reactions.html.erb
View file

@ -11,7 +11,7 @@
<span class="crayons-reaction__icon <%= "crayons-reaction__icon--borderless" if FeatureFlag.enabled?(:multiple_reactions) %> crayons-reaction__icon--active" style="width: 40px; height: 40px">
<%= image_tag "heart-plus-active.svg", aria_hidden: true, height: 24, width: 24 %>
</span>
<span class="crayons-reaction_total_count" id="reaction_total_count">
<span class="crayons-reaction__count" id="reaction_total_count">
<%= @article.public_reactions_count %>
</span>
</button>