Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: Janky animations when liking or expanding the post menu

This commit is contained in:
Robin Ward 2016-02-09 17:45:32 -05:00
parent 9ec44f755c
commit 65d0426ff1
3 changed files with 60 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/assets/javascripts/discourse/components/scrolling-post-stream.js.es6
View File

@ -130,6 +130,15 @@ export default MountWidget.extend({
$(window).bind('scroll.post-stream', debouncedScroll);
this._scrollTriggered();
this.$().on('mouseenter.post-stream', 'button.widget-button', e => {
$('button.widget-button').removeClass('d-hover');
$(e.target).addClass('d-hover');
});
this.$().on('mouseleave.post-stream', 'button.widget-button', () => {
$('button.widget-button').removeClass('d-hover');
});
this.appEvents.on('post-stream:refresh', postId => {
if (postId) {
keyDirty(`post-${postId}`);
@ -143,6 +152,8 @@ export default MountWidget.extend({
$(document).unbind('touchmove.post-stream');
$(window).unbind('scroll.post-stream');
this.appEvents.off('post-stream:refresh');
this.$().off('mouseenter.post-stream');
this.$().off('mouseleave.post-stream');
}
});

4
app/assets/javascripts/discourse/widgets/button.js.es6
View File

@ -2,7 +2,7 @@ import { createWidget } from 'discourse/widgets/widget';
import { iconNode } from 'discourse/helpers/fa-icon';
export default createWidget('button', {
tagName: 'button',
tagName: 'button.widget-button',
buildClasses() {
if (this.attrs.className) { return this.attrs.className; }
@ -42,7 +42,7 @@ export default createWidget('button', {
const attrs = this.attrs;
if (attrs.disabled) { return; }
$(`button`).blur();
$(`button.widget-button`).removeClass('d-hover').blur();
return this.sendWidgetAction(attrs.action);
}
});

95
app/assets/stylesheets/desktop/topic-post.scss
View File

@ -139,65 +139,64 @@ nav.post-controls {
background: transparent;
border: none;
margin-left: 3px;
transition: all linear 0.15s;
&:hover {
background: dark-light-diff($primary, $secondary, 90%, -60%);
color: $primary;
}
&.d-hover {
background: dark-light-diff($primary, $secondary, 90%, -60%);
color: $primary;
}
&:active {
box-shadow: inset 0 1px 3px rgba(0,0,0, .4);
}
&:active {
box-shadow: inset 0 1px 3px rgba(0,0,0, .4);
}
&.hidden {
display: none;
}
&.admin {
position: relative;
}
&.hidden {
display: none;
}
&.admin {
position: relative;
}
&.delete:hover {
background: $danger;
color: $secondary;
}
&.delete.d-hover {
background: $danger;
color: $secondary;
}
&.like:hover {
color: $love;
background: dark-light-diff($love, $secondary, 85%, -60%)
}
&.like.d-hover {
color: $love;
background: dark-light-diff($love, $secondary, 85%, -60%)
}
&.has-like {color: $love;}
&.has-like[disabled]:hover {
background: transparent;
}
&.has-like[disabled]:active {
box-shadow: none;
}
&.has-like {color: $love;}
&.has-like[disabled]:hover {
background: transparent;
}
&.has-like[disabled]:active {
box-shadow: none;
}
&.wikied {
color: green;
}
&.wikied {
color: green;
}
&.bookmark {padding: 8px 11px; }
&.bookmark {padding: 8px 11px; }
.read-icon {
&:before {
font-family: "FontAwesome";
content: "\f02e";
}
&.unseen {
&:before {
content: "\f097";
}
}
&.bookmarked {
&:before {
color: $tertiary;
}
}
.read-icon {
&:before {
font-family: "FontAwesome";
content: "\f02e";
}
&.unseen {
&:before {
content: "\f097";
}
}
&.bookmarked {
&:before {
color: $tertiary;
}
}
}
}
.post-admin-menu {
background-color: $secondary;