summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--ui/src/components/main.tsx9
-rw-r--r--ui/src/components/moment-time.tsx11
-rw-r--r--ui/src/components/post-listing.tsx8
-rw-r--r--ui/src/components/sidebar.tsx30
-rw-r--r--ui/src/components/symbols.tsx3
5 files changed, 47 insertions, 14 deletions
diff --git a/ui/src/components/main.tsx b/ui/src/components/main.tsx
index 014d82d3..3f7d8fa6 100644
--- a/ui/src/components/main.tsx
+++ b/ui/src/components/main.tsx
@@ -268,13 +268,16 @@ export class Main extends Component<any, MainState> {
<div class="card-body">
<h5 class="mb-0">{`${this.state.siteRes.site.name}`}</h5>
{this.canAdmin && (
- <ul class="list-inline mb-1 text-muted small font-weight-bold">
- <li className="list-inline-item">
+ <ul class="list-inline mb-1 text-muted font-weight-bold">
+ <li className="list-inline-item-action">
<span
class="pointer"
onClick={linkEvent(this, this.handleEditClick)}
+ data-tippy-content={i18n.t('edit')}
>
- {i18n.t('edit')}
+ <svg class="icon icon-inline">
+ <use xlinkHref="#icon-edit"></use>
+ </svg>
</span>
</li>
</ul>
diff --git a/ui/src/components/moment-time.tsx b/ui/src/components/moment-time.tsx
index a256f785..76e5fe28 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, setupTippy } from '../utils';
+import { getMomentLanguage, setupTippy, capitalizeFirstLetter } from '../utils';
import { i18n } from '../i18next';
interface MomentTimeProps {
@@ -28,10 +28,15 @@ export class MomentTime extends Component<MomentTimeProps, any> {
if (this.props.data.updated) {
return (
<span
- data-tippy-content={this.format(this.props.data.updated)}
+ data-tippy-content={`${capitalizeFirstLetter(
+ i18n.t('modified')
+ )} ${this.format(this.props.data.updated)}`}
className="font-italics pointer unselectable"
>
- {i18n.t('modified')} {moment.utc(this.props.data.updated).fromNow()}
+ <svg class="icon icon-inline mr-1">
+ <use xlinkHref="#icon-edit-2"></use>
+ </svg>
+ {moment.utc(this.props.data.updated).fromNow()}
</span>
);
} else {
diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index bc23543a..6e285ee9 100644
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -579,8 +579,14 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
<span
className="pointer"
onClick={linkEvent(this, this.handleViewSource)}
+ data-tippy-content={i18n.t('view_source')}
>
- {i18n.t('view_source')}
+ <svg
+ class={`icon icon-inline ${this.state
+ .viewSource && 'text-success'}`}
+ >
+ <use xlinkHref="#icon-eye"></use>
+ </svg>
</span>
</li>
)}
diff --git a/ui/src/components/sidebar.tsx b/ui/src/components/sidebar.tsx
index 5c8ef1a9..a78589d5 100644
--- a/ui/src/components/sidebar.tsx
+++ b/ui/src/components/sidebar.tsx
@@ -13,6 +13,7 @@ import {
getUnixTime,
pictshareAvatarThumbnail,
showAvatars,
+ setupTippy,
} from '../utils';
import { CommunityForm } from './community-form';
import { i18n } from '../i18next';
@@ -46,6 +47,10 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
this.handleEditCancel = this.handleEditCancel.bind(this);
}
+ componentDidUpdate() {
+ setupTippy();
+ }
+
render() {
return (
<div>
@@ -84,26 +89,37 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
<Link className="text-muted" to={`/c/${community.name}`}>
/c/{community.name}
</Link>
- <ul class="list-inline mb-1 text-muted small font-weight-bold">
+ <ul class="list-inline mb-1 text-muted font-weight-bold">
{this.canMod && (
<>
- <li className="list-inline-item">
+ <li className="list-inline-item-action">
<span
class="pointer"
onClick={linkEvent(this, this.handleEditClick)}
+ data-tippy-content={i18n.t('edit')}
>
- {i18n.t('edit')}
+ <svg class="icon icon-inline">
+ <use xlinkHref="#icon-edit"></use>
+ </svg>
</span>
</li>
{this.amCreator && (
- <li className="list-inline-item">
+ <li className="list-inline-item-action">
<span
class="pointer"
onClick={linkEvent(this, this.handleDeleteClick)}
+ data-tippy-content={
+ !community.deleted
+ ? i18n.t('delete')
+ : i18n.t('restore')
+ }
>
- {!community.deleted
- ? i18n.t('delete')
- : i18n.t('restore')}
+ <svg
+ class={`icon icon-inline ${community.deleted &&
+ 'text-danger'}`}
+ >
+ <use xlinkHref="#icon-trash"></use>
+ </svg>
</span>
</li>
)}
diff --git a/ui/src/components/symbols.tsx b/ui/src/components/symbols.tsx
index 09efcf68..108fbab3 100644
--- a/ui/src/components/symbols.tsx
+++ b/ui/src/components/symbols.tsx
@@ -42,6 +42,9 @@ export class Symbols extends Component<any, any> {
<symbol id="icon-edit" viewBox="0 0 24 24">
<path d="M11 3h-7c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v14c0 0.828 0.337 1.58 0.879 2.121s1.293 0.879 2.121 0.879h14c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121v-7c0-0.552-0.448-1-1-1s-1 0.448-1 1v7c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293h-14c-0.276 0-0.525-0.111-0.707-0.293s-0.293-0.431-0.293-0.707v-14c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h7c0.552 0 1-0.448 1-1s-0.448-1-1-1zM17.793 1.793l-9.5 9.5c-0.122 0.121-0.217 0.28-0.263 0.465l-1 4c-0.039 0.15-0.042 0.318 0 0.485 0.134 0.536 0.677 0.862 1.213 0.728l4-1c0.167-0.041 0.33-0.129 0.465-0.263l9.5-9.5c0.609-0.609 0.914-1.41 0.914-2.207s-0.305-1.598-0.914-2.207-1.411-0.915-2.208-0.915-1.598 0.305-2.207 0.914zM19.207 3.207c0.219-0.219 0.504-0.328 0.793-0.328s0.574 0.109 0.793 0.328 0.328 0.504 0.328 0.793-0.109 0.574-0.328 0.793l-9.304 9.304-2.114 0.529 0.529-2.114z"></path>
</symbol>
+ <symbol id="icon-edit-2" viewBox="0 0 24 24">
+ <path d="M16.293 2.293l-13.5 13.5c-0.117 0.116-0.21 0.268-0.258 0.444l-1.5 5.5c-0.046 0.163-0.049 0.346 0 0.526 0.145 0.533 0.695 0.847 1.228 0.702l5.5-1.5c0.159-0.042 0.315-0.129 0.444-0.258l13.5-13.5c0.747-0.747 1.121-1.729 1.121-2.707s-0.374-1.96-1.121-2.707-1.729-1.121-2.707-1.121-1.96 0.374-2.707 1.121zM17.707 3.707c0.357-0.357 0.824-0.535 1.293-0.535s0.936 0.178 1.293 0.536 0.535 0.823 0.535 1.292-0.178 0.936-0.535 1.293l-13.312 13.312-3.556 0.97 0.97-3.555z"></path>
+ </symbol>
<symbol id="icon-trash" viewBox="0 0 24 24">
<path d="M18 7v13c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293h-10c-0.276 0-0.525-0.111-0.707-0.293s-0.293-0.431-0.293-0.707v-13zM17 5v-1c0-0.828-0.337-1.58-0.879-2.121s-1.293-0.879-2.121-0.879h-4c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v1h-4c-0.552 0-1 0.448-1 1s0.448 1 1 1h1v13c0 0.828 0.337 1.58 0.879 2.121s1.293 0.879 2.121 0.879h10c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121v-13h1c0.552 0 1-0.448 1-1s-0.448-1-1-1zM9 5v-1c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h4c0.276 0 0.525 0.111 0.707 0.293s0.293 0.431 0.293 0.707v1z"></path>
</symbol>