UX: Move wrench down, support longer reply button names

This commit is contained in:
Robin Ward 2016-05-25 17:44:56 -04:00
parent 2f19eb4735
commit 6200d61f0a
No known key found for this signature in database
GPG Key ID: 0E091E2B4ED1B83D
3 changed files with 28 additions and 19 deletions

View File

@ -3,7 +3,7 @@ export default Ember.Component.extend({
_checkSize() { _checkSize() {
const width = $(window).width(); const width = $(window).width();
this.set('showTimeline', width > 1012); this.set('showTimeline', width > 960);
}, },
didInsertElement() { didInsertElement() {

View File

@ -224,25 +224,29 @@ export default createWidget('topic-timeline', {
} }
const { currentUser } = this; const { currentUser } = this;
if (currentUser && currentUser.get('canManageTopic')) { if (currentUser) {
if (currentUser.get('canManageTopic')) {
controls.push(this.attach('topic-admin-menu-button', { topic }));
}
controls.push(this.attach('topic-notifications-button', { topic })); controls.push(this.attach('topic-notifications-button', { topic }));
} }
return [ h('div.timeline-controls', controls), const rawLabel = relativeAge(new Date(topic.last_posted_at), { addAgo: true, defaultFormat: timelineDate });
this.attach('link', { const result = [ h('div.timeline-controls', controls),
className: 'start-date', this.attach('link', {
rawLabel: timelineDate(createdAt), className: 'start-date',
action: 'jumpTop' rawLabel: timelineDate(createdAt),
}), action: 'jumpTop'
this.attach('timeline-scrollarea', attrs), }),
this.attach('link', { this.attach('timeline-scrollarea', attrs),
className: 'now-date', this.attach('link', {
icon: 'dot-circle-o', className: 'now-date',
rawLabel: relativeAge(new Date(topic.last_posted_at), { addAgo: true, defaultFormat: timelineDate }), icon: 'dot-circle-o',
action: 'jumpBottom' rawLabel,
}) ]; action: 'jumpBottom'
}) ];
if (currentUser && currentUser.get('canManageTopic')) {
result.push(h('div.timeline-footer-controls', this.attach('topic-admin-menu-button', { topic })));
}
return result;
} }
}); });

View File

@ -15,10 +15,15 @@
.topic-timeline { .topic-timeline {
margin-left: 3em; margin-left: 3em;
width: 200px; width: 150px;
.timeline-footer-controls {
margin-top: 1em;
}
.timeline-controls { .timeline-controls {
margin-bottom: 2em; margin-bottom: 2em;
line-height: 2.5em;
button { button {
margin-right: 0.5em; margin-right: 0.5em;