diff options
author | Dessalines <tyhou13@gmx.com> | 2020-03-19 11:45:23 -0400 |
---|---|---|
committer | Dessalines <tyhou13@gmx.com> | 2020-03-19 11:45:23 -0400 |
commit | 47dd8acf54bf648fd374aac2fa611ca008919284 (patch) | |
tree | 881ebde1fdf9f755e3cf4426b95eb730d136534d /ui/src/components/private-message.tsx | |
parent | ed00fe46e2109060f86a88d306a2da2203387b97 (diff) |
Adding loading indicators to save and mark as read. #519
Diffstat (limited to 'ui/src/components/private-message.tsx')
-rw-r--r-- | ui/src/components/private-message.tsx | 44 |
1 files changed, 22 insertions, 22 deletions
diff --git a/ui/src/components/private-message.tsx b/ui/src/components/private-message.tsx index d9ccfc80..ef128dd4 100644 --- a/ui/src/components/private-message.tsx +++ b/ui/src/components/private-message.tsx @@ -55,7 +55,7 @@ export class PrivateMessage extends Component< render() { let message = this.props.privateMessage; return ( - <div class="mb-2"> + <div class="border-top border-light"> <div> <ul class="list-inline mb-0 text-muted small"> <li className="list-inline-item"> @@ -129,12 +129,12 @@ export class PrivateMessage extends Component< dangerouslySetInnerHTML={mdToHtml(this.messageUnlessRemoved)} /> )} - <ul class="list-inline mb-1 text-muted h5 font-weight-bold"> + <ul class="list-inline mb-0 text-muted font-weight-bold"> {!this.mine && ( <> - <li className="list-inline-item-action"> - <span - class="pointer" + <li className="list-inline-item"> + <button + class="btn btn-link btn-sm btn-animate text-muted" onClick={linkEvent(this, this.handleMarkRead)} data-tippy-content={ message.read @@ -148,37 +148,37 @@ export class PrivateMessage extends Component< > <use xlinkHref="#icon-check"></use> </svg> - </span> + </button> </li> - <li className="list-inline-item-action"> - <span - class="pointer" + <li className="list-inline-item"> + <button + class="btn btn-link btn-sm btn-animate text-muted" onClick={linkEvent(this, this.handleReplyClick)} data-tippy-content={i18n.t('reply')} > <svg class="icon icon-inline"> <use xlinkHref="#icon-reply1"></use> </svg> - </span> + </button> </li> </> )} {this.mine && ( <> - <li className="list-inline-item-action"> - <span - class="pointer" + <li className="list-inline-item"> + <button + class="btn btn-link btn-sm btn-animate text-muted" onClick={linkEvent(this, this.handleEditClick)} data-tippy-content={i18n.t('edit')} > <svg class="icon icon-inline"> <use xlinkHref="#icon-edit"></use> </svg> - </span> + </button> </li> - <li className="list-inline-item-action"> - <span - class="pointer" + <li className="list-inline-item"> + <button + class="btn btn-link btn-sm btn-animate text-muted" onClick={linkEvent(this, this.handleDeleteClick)} data-tippy-content={ !message.deleted @@ -192,13 +192,13 @@ export class PrivateMessage extends Component< > <use xlinkHref="#icon-trash"></use> </svg> - </span> + </button> </li> </> )} - <li className="list-inline-item-action"> - <span - className="pointer" + <li className="list-inline-item"> + <button + class="btn btn-link btn-sm btn-animate text-muted" onClick={linkEvent(this, this.handleViewSource)} data-tippy-content={i18n.t('view_source')} > @@ -208,7 +208,7 @@ export class PrivateMessage extends Component< > <use xlinkHref="#icon-file-text"></use> </svg> - </span> + </button> </li> </ul> </div> |