UX: Apply `btn-flat` class to flat buttons on posts

This commit is contained in:
Robin Ward 2017-07-25 11:59:29 -04:00
parent 3152eabbb0
commit f2e592c1ab
4 changed files with 28 additions and 12 deletions

View File

@ -1,7 +1,8 @@
import { createWidget } from 'discourse/widgets/widget';
import { iconNode } from 'discourse/helpers/fa-icon-node';
export default createWidget('button', {
const ButtonClass = {
tagName: 'button.widget-button',
buildClasses(attrs) {
@ -59,4 +60,10 @@ export default createWidget('button', {
}
return this.sendWidgetAction(attrs.action);
}
});
};
export default createWidget('button', ButtonClass);
createWidget('flat-button', jQuery.extend(ButtonClass, {
tagName: 'button.widget-button.btn-flat'
}));

View File

@ -230,7 +230,7 @@ export default createWidget('post-menu', {
if (builder) {
const buttonAtts = builder(attrs, this.state, this.siteSettings);
if (buttonAtts) {
return this.attach('button', buttonAtts);
return this.attach('flat-button', buttonAtts);
}
}
},

View File

@ -53,17 +53,23 @@ section.post-menu-area {
nav.post-controls {
.like-count {
font-size: inherit;
margin-right: -5px;
}
padding: 0;
padding: 0;
.highlight-action {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%));
}
a, button {
.like-count {
font-size: inherit;
margin-right: -5px;
}
.highlight-action {
color: dark-light-choose(scale-color($primary, $lightness: 60%), scale-color($secondary, $lightness: 40%));
}
a, button {
color: dark-light-choose(scale-color($primary, $lightness: 75%), scale-color($secondary, $lightness: 25%));
i.fa {
opacity: 1.0;
}
margin-right: 2px;
display: inline-block;
}

View File

@ -47,6 +47,9 @@ span.badge-posts {
nav.post-controls {
clear: both;
i.fa {
opacity: 1.0;
}
}
.who-liked {