diff options
author | Dessalines <tyhou13@gmx.com> | 2020-03-03 02:29:45 -0500 |
---|---|---|
committer | Dessalines <tyhou13@gmx.com> | 2020-03-03 02:29:45 -0500 |
commit | 44bbc459736ac53b9150903af14c20a497caf9ab (patch) | |
tree | 0bf8899cfc448e7b70230de52cec9119aa43f011 /ui/src/components/moment-time.tsx | |
parent | 5f6f51b549d42943b85d8f7dc9d193aec0935ab6 (diff) |
A first pass at adding icons, and tippy tooltips.
- Adding icons for post-listing, comment-node, and navbar.
- Adding html titles.
- Updating moment expand to use users locale.
Diffstat (limited to 'ui/src/components/moment-time.tsx')
-rw-r--r-- | ui/src/components/moment-time.tsx | 27 |
1 files changed, 24 insertions, 3 deletions
diff --git a/ui/src/components/moment-time.tsx b/ui/src/components/moment-time.tsx index fd2a7efa..a256f785 100644 --- a/ui/src/components/moment-time.tsx +++ b/ui/src/components/moment-time.tsx @@ -1,6 +1,6 @@ import { Component } from 'inferno'; import moment from 'moment'; -import { getMomentLanguage } from '../utils'; +import { getMomentLanguage, setupTippy } from '../utils'; import { i18n } from '../i18next'; interface MomentTimeProps { @@ -20,16 +20,37 @@ export class MomentTime extends Component<MomentTimeProps, any> { moment.locale(lang); } + componentDidMount() { + setupTippy(); + } + render() { if (this.props.data.updated) { return ( - <span title={this.props.data.updated} className="font-italics"> + <span + data-tippy-content={this.format(this.props.data.updated)} + className="font-italics pointer unselectable" + > {i18n.t('modified')} {moment.utc(this.props.data.updated).fromNow()} </span> ); } else { let str = this.props.data.published || this.props.data.when_; - return <span title={str}>{moment.utc(str).fromNow()}</span>; + return ( + <span + className="pointer unselectable" + data-tippy-content={this.format(str)} + > + {moment.utc(str).fromNow()} + </span> + ); } } + + format(input: string): string { + return moment + .utc(input) + .local() + .format('LLLL'); + } } |