summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--ui/assets/css/main.css4
-rw-r--r--ui/src/components/comment-node.tsx156
-rw-r--r--ui/src/components/post-listing.tsx7
-rw-r--r--ui/src/components/symbols.tsx8
-rw-r--r--ui/src/utils.ts6
-rw-r--r--ui/translations/en.json21
6 files changed, 116 insertions, 86 deletions
diff --git a/ui/assets/css/main.css b/ui/assets/css/main.css
index d206a508..64f086b3 100644
--- a/ui/assets/css/main.css
+++ b/ui/assets/css/main.css
@@ -74,10 +74,6 @@
border-top: 2px solid var(--dark);
}
-.comment-node {
- margin-bottom: 10px;
-}
-
.vote-bar {
margin-top: -6.5px;
}
diff --git a/ui/src/components/comment-node.tsx b/ui/src/components/comment-node.tsx
index ecf5e2aa..820dd901 100644
--- a/ui/src/components/comment-node.tsx
+++ b/ui/src/components/comment-node.tsx
@@ -131,47 +131,13 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
node.comment.parent_id && !this.props.noIndent ? 'ml-4' : ''
}`}
>
- {!this.state.collapsed && (
- <div
- className={`vote-bar mr-2 float-left small text-center ${this.props
- .viewOnly && 'no-click'}`}
- >
- <button
- className={`vote-animate btn btn-link p-0 ${
- this.state.my_vote == 1 ? 'text-info' : 'text-muted'
- }`}
- onClick={linkEvent(node, this.handleCommentUpvote)}
- data-tippy-content={i18n.t('upvote')}
- >
- <svg class="icon upvote">
- <use xlinkHref="#icon-arrow-up"></use>
- </svg>
- </button>
- <div class={`unselectable font-weight-bold text-muted`}>
- {this.state.score}
- </div>
- {WebSocketService.Instance.site.enable_downvotes && (
- <button
- className={`vote-animate btn btn-link p-0 ${
- this.state.my_vote == -1 ? 'text-danger' : 'text-muted'
- }`}
- onClick={linkEvent(node, this.handleCommentDownvote)}
- data-tippy-content={i18n.t('downvote')}
- >
- <svg class="icon downvote">
- <use xlinkHref="#icon-arrow-down"></use>
- </svg>
- </button>
- )}
- </div>
- )}
<div
id={`comment-${node.comment.id}`}
- className={`details comment-node ml-4 ${
+ className={`details comment-node mb-1 ${
this.isCommentNew ? 'mark' : ''
}`}
>
- <ul class="list-inline mb-0 text-muted small">
+ <ul class="list-inline mb-1 text-muted small">
<li className="list-inline-item">
<Link
className="text-info"
@@ -208,22 +174,37 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
{i18n.t('banned')}
</li>
)}
- <li className="list-inline-item">
- <span className="text-info">
- <svg class="small icon icon-inline mr-1">
- <use xlinkHref="#icon-arrow-up"></use>
- </svg>
- {this.state.upvotes}
- </span>
- </li>
- <li className="list-inline-item">
- <span className="text-danger">
- <svg class="small icon icon-inline mr-1">
- <use xlinkHref="#icon-arrow-down"></use>
- </svg>
- {this.state.downvotes}
- </span>
- </li>
+ <span
+ class="unselectable pointer mr-2"
+ data-tippy-content={i18n.t('number_of_points', {
+ count: this.state.score,
+ })}
+ >
+ <li className="list-inline-item">
+ <span className="text-danger">
+ <svg class="small icon icon-inline mr-1">
+ <use xlinkHref="#icon-heart"></use>
+ </svg>
+ {this.state.score}
+ </span>
+ </li>
+ <li className="list-inline-item">
+ <span className="text-info">
+ <svg class="small icon icon-inline mr-1">
+ <use xlinkHref="#icon-arrow-up"></use>
+ </svg>
+ {this.state.upvotes}
+ </span>
+ </li>
+ <li className="list-inline-item">
+ <span className="text-danger">
+ <svg class="small icon icon-inline mr-1">
+ <use xlinkHref="#icon-arrow-down"></use>
+ </svg>
+ {this.state.downvotes}
+ </span>
+ </li>
+ </span>
{this.props.showCommunity && (
<li className="list-inline-item">
<span> {i18n.t('to')} </span>
@@ -272,7 +253,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
dangerouslySetInnerHTML={mdToHtml(this.commentUnlessRemoved)}
/>
)}
- <ul class="list-inline mb-1 text-muted font-weight-bold h5">
+ <ul class="list-inline mb-0 text-muted font-weight-bold h5">
{this.props.markable && (
<li className="list-inline-item-action">
<span
@@ -296,29 +277,43 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
{UserService.Instance.user && !this.props.viewOnly && (
<>
<li className="list-inline-item-action">
- <span
- class="pointer"
- onClick={linkEvent(this, this.handleReplyClick)}
- data-tippy-content={i18n.t('reply')}
+ <button
+ className={`vote-animate btn btn-link p-0 mb-1 ${
+ this.state.my_vote == 1 ? 'text-info' : 'text-muted'
+ }`}
+ onClick={linkEvent(node, this.handleCommentUpvote)}
+ data-tippy-content={i18n.t('upvote')}
>
- <svg class="icon icon-inline">
- <use xlinkHref="#icon-reply1"></use>
+ <svg class="icon">
+ <use xlinkHref="#icon-arrow-up"></use>
</svg>
- </span>
+ </button>
</li>
+ {WebSocketService.Instance.site.enable_downvotes && (
+ <li className="list-inline-item-action">
+ <button
+ className={`vote-animate btn btn-link p-0 mb-1 ${
+ this.state.my_vote == -1
+ ? 'text-danger'
+ : 'text-muted'
+ }`}
+ onClick={linkEvent(node, this.handleCommentDownvote)}
+ data-tippy-content={i18n.t('downvote')}
+ >
+ <svg class="icon">
+ <use xlinkHref="#icon-arrow-down"></use>
+ </svg>
+ </button>
+ </li>
+ )}
<li className="list-inline-item-action">
<span
class="pointer"
- onClick={linkEvent(this, this.handleSaveCommentClick)}
- data-tippy-content={
- node.comment.saved ? i18n.t('unsave') : i18n.t('save')
- }
+ onClick={linkEvent(this, this.handleReplyClick)}
+ data-tippy-content={i18n.t('reply')}
>
- <svg
- class={`icon icon-inline ${node.comment.saved &&
- 'text-warning'}`}
- >
- <use xlinkHref="#icon-star"></use>
+ <svg class="icon icon-inline">
+ <use xlinkHref="#icon-reply1"></use>
</svg>
</span>
</li>
@@ -342,7 +337,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
title={i18n.t('link')}
>
<svg class="icon icon-inline">
- <use xlinkHref="#icon-external-link"></use>
+ <use xlinkHref="#icon-link"></use>
</svg>
</Link>
</li>
@@ -362,6 +357,27 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
<>
<li className="list-inline-item-action">
<span
+ class="pointer"
+ onClick={linkEvent(
+ this,
+ this.handleSaveCommentClick
+ )}
+ data-tippy-content={
+ node.comment.saved
+ ? i18n.t('unsave')
+ : i18n.t('save')
+ }
+ >
+ <svg
+ class={`icon icon-inline ${node.comment.saved &&
+ 'text-warning'}`}
+ >
+ <use xlinkHref="#icon-star"></use>
+ </svg>
+ </span>
+ </li>
+ <li className="list-inline-item-action">
+ <span
className="pointer"
onClick={linkEvent(this, this.handleViewSource)}
data-tippy-content={i18n.t('view_source')}
diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index b6cb3f51..e170c711 100644
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -266,7 +266,12 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
<use xlinkHref="#icon-arrow-up"></use>
</svg>
</button>
- <div class={`unselectable font-weight-bold text-muted px-1`}>
+ <div
+ class={`unselectable pointer font-weight-bold text-muted px-1`}
+ data-tippy-content={i18n.t('number_of_points', {
+ count: this.state.score,
+ })}
+ >
{this.state.score}
</div>
{WebSocketService.Instance.site.enable_downvotes && (
diff --git a/ui/src/components/symbols.tsx b/ui/src/components/symbols.tsx
index 0c7169d5..b5d7dcdf 100644
--- a/ui/src/components/symbols.tsx
+++ b/ui/src/components/symbols.tsx
@@ -15,6 +15,12 @@ export class Symbols extends Component<any, any> {
xmlnsXlink="http://www.w3.org/1999/xlink"
>
<defs>
+ <symbol id="icon-heart" viewBox="0 0 24 24">
+ <path d="M20.133 5.317c0.88 0.881 1.319 2.031 1.319 3.184s-0.44 2.303-1.319 3.182l-8.133 8.133-8.133-8.133c-0.879-0.879-1.318-2.029-1.318-3.183s0.439-2.304 1.318-3.183 2.029-1.318 3.183-1.318 2.304 0.439 3.183 1.318l1.060 1.060c0.391 0.391 1.024 0.391 1.414 0l1.062-1.062c0.879-0.879 2.029-1.318 3.182-1.317s2.303 0.44 3.182 1.319zM21.547 3.903c-1.269-1.269-2.934-1.904-4.596-1.905s-3.327 0.634-4.597 1.903l-0.354 0.355-0.353-0.353c-1.269-1.269-2.935-1.904-4.597-1.904s-3.328 0.635-4.597 1.904-1.904 2.935-1.904 4.597 0.635 3.328 1.904 4.597l8.84 8.84c0.391 0.391 1.024 0.391 1.414 0l8.84-8.84c1.269-1.269 1.904-2.934 1.905-4.596s-0.634-3.327-1.905-4.598z"></path>
+ </symbol>
+ <symbol id="icon-link" viewBox="0 0 24 24">
+ <path d="M9.199 13.599c0.992 1.327 2.43 2.126 3.948 2.345s3.123-0.142 4.45-1.134c0.239-0.179 0.465-0.375 0.655-0.568l2.995-2.995c1.163-1.204 1.722-2.751 1.696-4.285s-0.639-3.061-1.831-4.211c-1.172-1.132-2.688-1.692-4.199-1.683-1.492 0.008-2.984 0.571-4.137 1.683l-1.731 1.721c-0.392 0.389-0.394 1.023-0.004 1.414s1.023 0.394 1.414 0.004l1.709-1.699c0.77-0.742 1.763-1.117 2.76-1.123 1.009-0.006 2.016 0.367 2.798 1.122 0.795 0.768 1.203 1.783 1.221 2.808s-0.355 2.054-1.11 2.836l-3.005 3.005c-0.114 0.116-0.263 0.247-0.428 0.37-0.885 0.662-1.952 0.902-2.967 0.756s-1.971-0.678-2.632-1.563c-0.331-0.442-0.957-0.533-1.4-0.202s-0.533 0.957-0.202 1.4zM14.801 10.401c-0.992-1.327-2.43-2.126-3.948-2.345s-3.124 0.142-4.451 1.134c-0.239 0.179-0.464 0.375-0.655 0.568l-2.995 2.995c-1.163 1.204-1.722 2.751-1.696 4.285s0.639 3.061 1.831 4.211c1.172 1.132 2.688 1.692 4.199 1.683 1.492-0.008 2.984-0.571 4.137-1.683l1.723-1.723c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.696 1.698c-0.77 0.742-1.763 1.117-2.76 1.123-1.009 0.006-2.016-0.367-2.798-1.122-0.795-0.768-1.203-1.783-1.221-2.808s0.355-2.054 1.11-2.836l3.005-3.005c0.114-0.116 0.263-0.247 0.428-0.37 0.885-0.662 1.952-0.902 2.967-0.756s1.971 0.678 2.632 1.563c0.331 0.442 0.957 0.533 1.4 0.202s0.533-0.957 0.202-1.4z"></path>
+ </symbol>
<symbol id="icon-minus-square" viewBox="0 0 24 24">
<path d="M5 2c-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-14c0-0.828-0.337-1.58-0.879-2.121s-1.293-0.879-2.121-0.879zM5 4h14c0.276 0 0.525 0.111 0.707 0.293s0.293 0.431 0.293 0.707v14c0 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.293zM8 13h8c0.552 0 1-0.448 1-1s-0.448-1-1-1h-8c-0.552 0-1 0.448-1 1s0.448 1 1 1z"></path>
</symbol>
@@ -58,7 +64,7 @@ export class Symbols extends Component<any, any> {
<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>
<symbol id="icon-reply1" viewBox="0 0 20 20">
- <path d="M15 17v-2.99c0-0.003 0-0.006 0-0.010 0-2.209-1.791-4-4-4 0 0-0 0-0 0h-3v5l-6-6 6-6v5h3c3.314 0 6 2.686 6 6v0 3h-2z"></path>
+ <path d="M19 16.685c0 0-2.225-9.732-11-9.732v-3.984l-7 6.573 7 6.69v-4.357c4.763-0.001 8.516 0.421 11 4.81z"></path>
</symbol>
<symbol id="icon-star" viewBox="0 0 24 24">
<path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path>
diff --git a/ui/src/utils.ts b/ui/src/utils.ts
index 5987070c..46b393d9 100644
--- a/ui/src/utils.ts
+++ b/ui/src/utils.ts
@@ -446,7 +446,7 @@ export function setupTribute(): Tribute {
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: mentionDropdownFetchLimit,
- menuShowMinLength: 3,
+ menuShowMinLength: 2,
},
// Users
{
@@ -460,7 +460,7 @@ export function setupTribute(): Tribute {
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: mentionDropdownFetchLimit,
- menuShowMinLength: 3,
+ menuShowMinLength: 2,
},
// Communities
@@ -475,7 +475,7 @@ export function setupTribute(): Tribute {
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: mentionDropdownFetchLimit,
- menuShowMinLength: 3,
+ menuShowMinLength: 2,
},
],
});
diff --git a/ui/translations/en.json b/ui/translations/en.json
index 1f959396..b097b3f1 100644
--- a/ui/translations/en.json
+++ b/ui/translations/en.json
@@ -4,14 +4,16 @@
"no_posts": "No Posts.",
"create_a_post": "Create a post",
"create_post": "Create Post",
- "number_of_posts": "{{count}} Posts",
+ "number_of_posts": "{{count}} Post",
+ "number_of_posts_plural": "{{count}} Posts",
"posts": "Posts",
"related_posts": "These posts might be related",
"cross_posts": "This link has also been posted to:",
"cross_post": "cross-post",
"cross_posted_to": "cross-posted to: ",
"comments": "Comments",
- "number_of_comments": "{{count}} Comments",
+ "number_of_comments": "{{count}} Comment",
+ "number_of_comments_plural": "{{count}} Comments",
"remove_comment": "Remove Comment",
"communities": "Communities",
"users": "Users",
@@ -21,7 +23,8 @@
"subscribed_to_communities": "Subscribed to <1>communities</1>",
"trending_communities": "Trending <1>communities</1>",
"list_of_communities": "List of communities",
- "number_of_communities": "{{count}} Communities",
+ "number_of_communities": "{{count}} Community",
+ "number_of_communities_plural": "{{count}} Communities",
"community_reqs": "lowercase, underscores, and no spaces.",
"create_private_message": "Create Private Message",
"send_secure_message": "Send Secure Message",
@@ -79,10 +82,14 @@
"creator": "creator",
"username": "Username",
"email_or_username": "Email or Username",
- "number_of_users": "{{count}} Users",
- "number_of_subscribers": "{{count}} Subscribers",
- "number_of_points": "{{count}} Points",
- "number_online": "{{count}} Users Online",
+ "number_of_users": "{{count}} User",
+ "number_of_users_plural": "{{count}} Users",
+ "number_of_subscribers": "{{count}} Subscriber",
+ "number_of_subscribers_plural": "{{count}} Subscribers",
+ "number_of_points": "{{count}} Point",
+ "number_of_points_plural": "{{count}} Points",
+ "number_online": "{{count}} User Online",
+ "number_online_plural": "{{count}} Users Online",
"name": "Name",
"title": "Title",
"category": "Category",
generated by cgit v1.2.3 (git 2.25.1) at 2024-06-09 10:48:40 +0000