diff --git a/js/src/components/Discussion/DiscussionComment.vue b/js/src/components/Discussion/DiscussionComment.vue index e1329e630..26707c4a1 100644 --- a/js/src/components/Discussion/DiscussionComment.vue +++ b/js/src/components/Discussion/DiscussionComment.vue @@ -4,7 +4,7 @@
- +
@@ -12,10 +12,10 @@ {{ comment.actor.name }} @{{ usernameWithDomain(comment.actor) }} - - {{ $t("[deleted]") }} - - + + {{ $t("[deleted]") }} + + @@ -35,24 +35,30 @@ {{ $t("Delete") }} - +
-
-
{{ $t("[This comment has been deleted]") }}
+
+
+

+ {{ $t("Edited {ago}", { ago: $timeAgo.format(new Date(comment.updatedAt)) }) }} +

+
+
+ {{ $t("[This comment has been deleted by it's author]") }} +
@@ -92,7 +98,7 @@ export default class DiscussionComment extends Vue { usernameWithDomain = usernameWithDomain; - isReportModalActive: boolean = false; + // isReportModalActive: boolean = false; toggleEditMode() { this.updatedComment = this.comment.text; @@ -133,9 +139,7 @@ article.comment { line-height: 1rem; } - span { - color: #3c376e; - } + color: #3c376e; } .icons { @@ -144,46 +148,56 @@ article.comment { } } - div.description-content { - padding: 0 1rem 0.3rem; + .text-wrapper, + .comment-deleted { + padding: 0 1rem; - /deep/ h1 { - font-size: 2rem; + & > p { + font-size: 0.85rem; + font-style: italic; } - /deep/ h2 { - font-size: 1.5rem; - } + div.description-content { + padding-bottom: 0.3rem; - /deep/ h3 { - font-size: 1.25rem; - } + /deep/ h1 { + font-size: 2rem; + } - /deep/ ul { - list-style-type: disc; - } + /deep/ h2 { + font-size: 1.5rem; + } - /deep/ li { - margin: 10px auto 10px 2rem; - } + /deep/ h3 { + font-size: 1.25rem; + } - /deep/ blockquote { - border-left: 0.2em solid #333; - display: block; - padding-left: 1em; - } + /deep/ ul { + list-style-type: disc; + } - /deep/ p { - margin: 10px auto; + /deep/ li { + margin: 10px auto 10px 2rem; + } - a { - display: inline-block; - padding: 0.3rem; - background: $secondary; - color: #111; + /deep/ blockquote { + border-left: 0.2em solid #333; + display: block; + padding-left: 1em; + } - &:empty { - display: none; + /deep/ p { + margin: 10px auto; + + a { + display: inline-block; + padding: 0.3rem; + background: $secondary; + color: #111; + + &:empty { + display: none; + } } } } diff --git a/js/src/graphql/discussion.ts b/js/src/graphql/discussion.ts index dbfd9df55..90c96a2f7 100644 --- a/js/src/graphql/discussion.ts +++ b/js/src/graphql/discussion.ts @@ -57,6 +57,7 @@ export const DISCUSSION_FIELDS_FRAGMENT = gql` lastComment { id text + insertedAt updatedAt } actor { diff --git a/js/src/i18n/en_US.json b/js/src/i18n/en_US.json index 404246474..2eca592ef 100644 --- a/js/src/i18n/en_US.json +++ b/js/src/i18n/en_US.json @@ -762,5 +762,7 @@ "Leave group": "Leave group", "Remove": "Remove", "Update": "Update", - "Search…": "Search…" + "Search…": "Search…", + "Edited {ago}": "Edited {ago}", + "[This comment has been deleted by it's author]": "[This comment has been deleted by it's author]" } diff --git a/js/src/i18n/fr_FR.json b/js/src/i18n/fr_FR.json index 86659e621..e8442adf8 100644 --- a/js/src/i18n/fr_FR.json +++ b/js/src/i18n/fr_FR.json @@ -763,5 +763,7 @@ "{title} ({count} todos)": "{title} ({count} todos)", "© The OpenStreetMap Contributors": "© Les Contributeur⋅ices OpenStreetMap", "Update": "Éditer", - "Search…": "Rechercher…" + "Search…": "Rechercher…", + "Edited {ago}": "Édité {ago}", + "[This comment has been deleted by it's author]": "[Ce commentaire a été supprimé par son auteur]" } diff --git a/js/src/types/comment.model.ts b/js/src/types/comment.model.ts index f9315378b..6bac3624f 100644 --- a/js/src/types/comment.model.ts +++ b/js/src/types/comment.model.ts @@ -59,7 +59,7 @@ export class CommentModel implements IComment { this.actor = hash.actor ? new Actor(hash.actor) : new Actor(); this.event = new EventModel(hash.event); this.replies = hash.replies; - this.updatedAt = hash.updatedAt; + this.updatedAt = new Date(hash.updatedAt as string); this.deletedAt = hash.deletedAt; this.insertedAt = new Date(hash.insertedAt as string); this.totalReplies = hash.totalReplies;