From 06042569f1d2f2c7217917459df007adbb113e53 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 3 Feb 2022 22:10:45 +0200 Subject: [PATCH 1/8] fix alignment issues --- src/components/mention_link/mention_link.scss | 2 +- src/components/popover/popover.vue | 2 +- src/components/status/status.scss | 10 ++++++++-- src/components/status/status.vue | 2 +- 4 files changed, 11 insertions(+), 5 deletions(-) diff --git a/src/components/mention_link/mention_link.scss b/src/components/mention_link/mention_link.scss index 03306dcc7..23d18f59f 100644 --- a/src/components/mention_link/mention_link.scss +++ b/src/components/mention_link/mention_link.scss @@ -3,7 +3,7 @@ .MentionLink { position: relative; white-space: normal; - display: inline-block; + display: inline-flex; color: var(--link); & .new, diff --git a/src/components/popover/popover.vue b/src/components/popover/popover.vue index 2e78a09ee..8588b3515 100644 --- a/src/components/popover/popover.vue +++ b/src/components/popover/popover.vue @@ -33,7 +33,7 @@ @import '../../_variables.scss'; .popover-trigger-button { - display: block; + display: inline-block; } .popover { diff --git a/src/components/status/status.scss b/src/components/status/status.scss index 71305dd7e..24c840ac0 100644 --- a/src/components/status/status.scss +++ b/src/components/status/status.scss @@ -165,16 +165,23 @@ $status-margin: 0.75em; align-content: baseline; font-size: 12px; line-height: 160%; + margin-top: 0.2em; + line-height: 130%; + max-width: 100%; align-items: stretch; } & .reply-to-popover, - & .reply-to-no-popover { + & .reply-to-no-popover, + & .mentions { min-width: 0; margin-right: 0.4em; flex-shrink: 0; } + .reply-glued-label { + margin-right: 0.5em; + } .reply-to-popover { .reply-to:hover::before { @@ -209,7 +216,6 @@ $status-margin: 0.75em; & .reply-to { white-space: nowrap; position: relative; - padding-right: 0.25em; } & .mentions-text, diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 2684e4152..3bb29db66 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -227,7 +227,7 @@ > Date: Thu, 3 Feb 2022 22:23:28 +0200 Subject: [PATCH 2/8] fix poast mentions tripping --- src/components/rich_content/rich_content.jsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx index c0d20c5e7..46bc661af 100644 --- a/src/components/rich_content/rich_content.jsx +++ b/src/components/rich_content/rich_content.jsx @@ -120,7 +120,8 @@ export default Vue.component('RichContent', { // don't include spaces when processing mentions - we'll include them // in MentionsLine lastSpacing = item - return currentMentions !== null ? item.trim() : item + // Don't remove last space in a container (fixes poast mentions) + return (index !== array.length - 1) && (currentMentions !== null) ? item.trim() : item } currentMentions = null From bfb3a4364be3f71f7c46056aeb8972f04a072703 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 3 Feb 2022 22:34:57 +0200 Subject: [PATCH 3/8] options to disable (You)s and highlighting of yourself --- src/components/mention_link/mention_link.js | 8 +++++++- src/components/mention_link/mention_link.vue | 4 ++-- src/components/settings_modal/tabs/general_tab.vue | 10 ++++++++++ src/i18n/en.json | 2 ++ src/modules/config.js | 2 ++ src/modules/instance.js | 2 ++ 6 files changed, 25 insertions(+), 3 deletions(-) diff --git a/src/components/mention_link/mention_link.js b/src/components/mention_link/mention_link.js index 5209907da..55eea1952 100644 --- a/src/components/mention_link/mention_link.js +++ b/src/components/mention_link/mention_link.js @@ -87,7 +87,7 @@ const MentionLink = { classnames () { return [ { - '-you': this.isYou, + '-you': this.isYou && this.shouldBoldenYou, '-highlighted': this.highlight }, this.highlightType @@ -115,6 +115,12 @@ const MentionLink = { shouldShowAvatar () { return this.mergedConfig.mentionLinkShowAvatar }, + shouldShowYous () { + return this.mergedConfig.mentionLinkShowYous + }, + shouldBoldenYou () { + return this.mergedConfig.mentionLinkBoldenYou + }, shouldFadeDomain () { return this.mergedConfig.mentionLinkFadeDomain }, diff --git a/src/components/mention_link/mention_link.vue b/src/components/mention_link/mention_link.vue index ac20eb5af..d8ab79fbe 100644 --- a/src/components/mention_link/mention_link.vue +++ b/src/components/mention_link/mention_link.vue @@ -45,8 +45,8 @@ v-html="'@' + serverName" /> {{ $t('status.you') }} diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index 44b1ac926..eba3b2680 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -147,6 +147,11 @@ {{ $t('settings.greentext') }} +
  • + + {{ $t('settings.show_yous') }} + +
    • +
  • + + {{ $t('settings.mention_link_bolden_you') }} + +
    • diff --git a/src/i18n/en.json b/src/i18n/en.json index 209fd1841..8fd189c6e 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -493,8 +493,10 @@ "mention_link_show_tooltip": "Show full user names as tooltip for remote users", "mention_link_show_avatar": "Show user avatar beside the link", "mention_link_fade_domain": "Fade domains (e.g. @example.org in @foo@example.org)", + "mention_link_bolden_you": "Bolden text of your mention", "fun": "Fun", "greentext": "Meme arrows", + "show_yous": "Show (You)s", "notifications": "Notifications", "notification_setting_filters": "Filters", "notification_setting_block_from_strangers": "Block notifications from users who you do not follow", diff --git a/src/modules/config.js b/src/modules/config.js index 9f2d4ef38..20979174a 100644 --- a/src/modules/config.js +++ b/src/modules/config.js @@ -76,6 +76,8 @@ export const defaultState = { mentionLinkShowTooltip: undefined, // instance default mentionLinkShowAvatar: undefined, // instance default mentionLinkFadeDomain: undefined, // instance default + mentionLinkShowYous: undefined, // instance default + mentionLinkBoldenYou: undefined, // instance default hidePostStats: undefined, // instance default hideUserStats: undefined, // instance default virtualScrolling: undefined, // instance default diff --git a/src/modules/instance.js b/src/modules/instance.js index d686f2583..1abd784f0 100644 --- a/src/modules/instance.js +++ b/src/modules/instance.js @@ -25,6 +25,8 @@ const defaultState = { mentionLinkShowTooltip: true, mentionLinkShowAvatar: false, mentionLinkFadeDomain: true, + mentionLinkShowYous: false, + mentionLinkBoldenYou: true, hideFilteredStatuses: false, // bad name: actually hides posts of muted USERS hideMutedPosts: false, From ea6114f63c972ac974f8e3055b93ae3340b6e85b Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 3 Feb 2022 22:36:13 +0200 Subject: [PATCH 4/8] better phrasing? --- src/i18n/en.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/i18n/en.json b/src/i18n/en.json index 8fd189c6e..77f7e5b0b 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -493,7 +493,7 @@ "mention_link_show_tooltip": "Show full user names as tooltip for remote users", "mention_link_show_avatar": "Show user avatar beside the link", "mention_link_fade_domain": "Fade domains (e.g. @example.org in @foo@example.org)", - "mention_link_bolden_you": "Bolden text of your mention", + "mention_link_bolden_you": "Highlight mention of you when you are mentioned", "fun": "Fun", "greentext": "Meme arrows", "show_yous": "Show (You)s", From 9a6363431d8f17cc1ee027eb498181d157fefdb7 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 3 Feb 2022 22:41:38 +0200 Subject: [PATCH 5/8] lint --- src/components/status/status.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/status/status.scss b/src/components/status/status.scss index 24c840ac0..0f527defe 100644 --- a/src/components/status/status.scss +++ b/src/components/status/status.scss @@ -164,10 +164,8 @@ $status-margin: 0.75em; position: relative; align-content: baseline; font-size: 12px; - line-height: 160%; margin-top: 0.2em; line-height: 130%; - max-width: 100%; align-items: stretch; } @@ -179,6 +177,7 @@ $status-margin: 0.75em; margin-right: 0.4em; flex-shrink: 0; } + .reply-glued-label { margin-right: 0.5em; } From a9830ff4913a56a3ff097505a4e65bb61117b4d5 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 3 Feb 2022 22:50:32 +0200 Subject: [PATCH 6/8] support width/height img attributes --- src/components/still-image/still-image.js | 11 ++++++++++- src/components/still-image/still-image.vue | 1 + 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/src/components/still-image/still-image.js b/src/components/still-image/still-image.js index 8044e9943..d7abbcb5e 100644 --- a/src/components/still-image/still-image.js +++ b/src/components/still-image/still-image.js @@ -5,7 +5,9 @@ const StillImage = { 'mimetype', 'imageLoadError', 'imageLoadHandler', - 'alt' + 'alt', + 'height', + 'width' ], data () { return { @@ -15,6 +17,13 @@ const StillImage = { computed: { animated () { return this.stopGifs && (this.mimetype === 'image/gif' || this.src.endsWith('.gif')) + }, + style () { + const appendPx = (str) => /\d$/.test(str) ? str + 'px' : str + return { + height: this.height ? appendPx(this.height) : null, + width: this.width ? appendPx(this.width) : null + } } }, methods: { diff --git a/src/components/still-image/still-image.vue b/src/components/still-image/still-image.vue index 0623b42e7..cca75fcb7 100644 --- a/src/components/still-image/still-image.vue +++ b/src/components/still-image/still-image.vue @@ -2,6 +2,7 @@
    Date: Thu, 3 Feb 2022 22:52:41 +0200 Subject: [PATCH 7/8] make chat messages behave same as posts for animated gifs --- src/components/chat_message/chat_message.scss | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/components/chat_message/chat_message.scss b/src/components/chat_message/chat_message.scss index fcfa7c8a6..5445d9f7c 100644 --- a/src/components/chat_message/chat_message.scss +++ b/src/components/chat_message/chat_message.scss @@ -1,6 +1,7 @@ @import '../../_variables.scss'; .chat-message-wrapper { + &.hovered-message-chain { .animated.Avatar { canvas { @@ -40,6 +41,12 @@ .chat-message { display: flex; padding-bottom: 0.5em; + + .status-body:hover { + --_still-image-img-visibility: visible; + --_still-image-canvas-visibility: hidden; + --_still-image-label-visibility: hidden; + } } .avatar-wrapper { From 39ecb338830a71c015688e7ec45e16e1151983d3 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 3 Feb 2022 22:58:12 +0200 Subject: [PATCH 8/8] fix amps in links --- src/components/rich_content/rich_content.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx index 46bc661af..8ebabad79 100644 --- a/src/components/rich_content/rich_content.jsx +++ b/src/components/rich_content/rich_content.jsx @@ -60,7 +60,7 @@ export default Vue.component('RichContent', { // NEVER EVER TOUCH DATA INSIDE RENDER render (h) { // Pre-process HTML - const { newHtml: html } = preProcessPerLine(this.html, this.greentext) + const { newHtml: html } = preProcessPerLine(unescape(this.html), this.greentext) let currentMentions = null // Current chain of mentions, we group all mentions together // This is used to recover spacing removed when parsing mentions let lastSpacing = ''