IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

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

2
app/assets/javascripts/discourse/widgets/post-menu.js.es6
View File

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

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

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

3
app/assets/stylesheets/mobile/topic-post.scss
View File

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