More additions to icons.
- Adding edit and trash icons for sidebars - Adding pencil edit instead of modified.
This commit is contained in:
parent
fe5bd0341a
commit
b3b4b79775
5 changed files with 47 additions and 14 deletions
9
ui/src/components/main.tsx
vendored
9
ui/src/components/main.tsx
vendored
|
|
@ -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>
|
||||
|
|
|
|||
11
ui/src/components/moment-time.tsx
vendored
11
ui/src/components/moment-time.tsx
vendored
|
|
@ -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 {
|
||||
|
|
|
|||
8
ui/src/components/post-listing.tsx
vendored
8
ui/src/components/post-listing.tsx
vendored
|
|
@ -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>
|
||||
)}
|
||||
|
|
|
|||
30
ui/src/components/sidebar.tsx
vendored
30
ui/src/components/sidebar.tsx
vendored
|
|
@ -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>
|
||||
)}
|
||||
|
|
|
|||
3
ui/src/components/symbols.tsx
vendored
3
ui/src/components/symbols.tsx
vendored
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in a new issue