mirror of
https://github.com/flarum/framework.git
synced 2024-11-29 04:33:47 +08:00
e466dcc626
Most of #137 done. - Use FastClick to make everything feel more responsive - Use transforms for animations to make them silky smooth - Style the drawer the same as the header to keep things simple - Revert to fixed composer, but allow it to be minimised - Add a separate notifications page for mobile so it’s easy to go back - Add indicator to the menu button when there are unread notifications - Close the drawer when navigating away - Make dropdowns/modals scrollable - Many other mobile tweaks and bug fixes Didn’t take much care to keep CSS clean, due to #103
32 lines
1.2 KiB
JavaScript
32 lines
1.2 KiB
JavaScript
import Component from 'flarum/component';
|
|
import icon from 'flarum/helpers/icon';
|
|
|
|
/**
|
|
The back/pin button group in the top-left corner of Flarum's interface.
|
|
*/
|
|
export default class BackButton extends Component {
|
|
view() {
|
|
var history = app.history;
|
|
var pane = app.pane;
|
|
|
|
return m('div.back-button', {
|
|
className: this.props.className || '',
|
|
onmouseenter: pane && pane.show.bind(pane),
|
|
onmouseleave: pane && pane.onmouseleave.bind(pane),
|
|
config: this.onload.bind(this)
|
|
}, history.canGoBack() ? m('div.btn-group', [
|
|
m('button.btn.btn-default.btn-icon.back', {onclick: history.back.bind(history)}, icon('chevron-left icon')),
|
|
pane && pane.active ? m('button.btn.btn-default.btn-icon.pin'+(pane.pinned ? '.active' : ''), {onclick: pane.togglePinned.bind(pane)}, icon('thumb-tack icon')) : '',
|
|
]) : (this.props.drawer ? [
|
|
m('button.btn.btn-default.btn-icon.drawer-toggle', {
|
|
onclick: app.drawer.toggle.bind(app.drawer),
|
|
className: app.session.user() && app.session.user().unreadNotificationsCount() ? 'unread-notifications' : ''
|
|
}, icon('reorder icon'))
|
|
] : ''));
|
|
}
|
|
|
|
onload(element, isInitialized, context) {
|
|
context.retain = true;
|
|
}
|
|
}
|