aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/account_actions/account_actions.vue1
-rw-r--r--src/components/emoji_input/suggestor.js6
-rw-r--r--src/components/extra_buttons/extra_buttons.vue1
-rw-r--r--src/components/notifications/notifications.scss23
-rw-r--r--src/components/poll/poll.vue2
-rw-r--r--src/components/popover/popover.js11
-rw-r--r--src/components/post_status_form/post_status_form.vue1
-rw-r--r--src/components/post_status_modal/post_status_modal.js3
-rw-r--r--src/components/post_status_modal/post_status_modal.vue1
-rw-r--r--src/components/settings_modal/tabs/theme_tab/theme_tab.vue7
-rw-r--r--src/components/status/status.vue2
-rw-r--r--src/components/status_content/status_content.vue26
-rw-r--r--src/components/user_profile/user_profile.js8
-rw-r--r--src/components/user_profile/user_profile.vue74
-rw-r--r--src/modules/users.js6
-rw-r--r--src/services/entity_normalizer/entity_normalizer.service.js12
-rw-r--r--src/services/theme_data/pleromafe.js6
17 files changed, 153 insertions, 37 deletions
diff --git a/src/components/account_actions/account_actions.vue b/src/components/account_actions/account_actions.vue
index 744b77d5..029e7096 100644
--- a/src/components/account_actions/account_actions.vue
+++ b/src/components/account_actions/account_actions.vue
@@ -3,6 +3,7 @@
<Popover
trigger="click"
placement="bottom"
+ :bound-to="{ x: 'container' }"
>
<div
slot="content"
diff --git a/src/components/emoji_input/suggestor.js b/src/components/emoji_input/suggestor.js
index 15a71eff..8330345b 100644
--- a/src/components/emoji_input/suggestor.js
+++ b/src/components/emoji_input/suggestor.js
@@ -13,7 +13,7 @@ import { debounce } from 'lodash'
const debounceUserSearch = debounce((data, input) => {
data.updateUsersList(input)
-}, 500, { leading: true, trailing: false })
+}, 500)
export default data => input => {
const firstChar = input[0]
@@ -97,8 +97,8 @@ export const suggestUsers = data => input => {
replacement: '@' + screen_name + ' '
}))
- // BE search users if there are no matches
- if (newUsers.length === 0 && data.updateUsersList) {
+ // BE search users to get more comprehensive results
+ if (data.updateUsersList) {
debounceUserSearch(data, noPrefix)
}
return newUsers
diff --git a/src/components/extra_buttons/extra_buttons.vue b/src/components/extra_buttons/extra_buttons.vue
index bca93ea7..68db6fd8 100644
--- a/src/components/extra_buttons/extra_buttons.vue
+++ b/src/components/extra_buttons/extra_buttons.vue
@@ -3,6 +3,7 @@
trigger="click"
placement="top"
class="extra-button-popover"
+ :bound-to="{ x: 'container' }"
>
<div
slot="content"
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index b675af5a..20797cf9 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -54,25 +54,20 @@
flex-wrap: nowrap;
padding: 0.6em;
min-width: 0;
+
.avatar-container {
width: 32px;
height: 32px;
}
- .status-el {
- .status {
- padding: 0.25em 0;
- color: $fallback--faint;
- color: var(--faint, $fallback--faint);
- a {
- color: var(--faintLink);
- }
- .status-content a {
- color: var(--postFaintLink);
- }
+
+ .status-body {
+ color: $fallback--faint;
+ color: var(--faint, $fallback--faint);
+ a {
+ color: var(--faintLink);
}
- padding: 0;
- .media-body {
- margin: 0;
+ .status-content a {
+ color: var(--postFaintLink);
}
}
}
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index 56e91cca..adbb0555 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -17,7 +17,7 @@
<span class="result-percentage">
{{ percentageForOption(option.votes_count) }}%
</span>
- <span>{{ option.title }}</span>
+ <span v-html="option.title_html"></span>
</div>
<div
class="result-fill"
diff --git a/src/components/popover/popover.js b/src/components/popover/popover.js
index 5881d266..a40a9195 100644
--- a/src/components/popover/popover.js
+++ b/src/components/popover/popover.js
@@ -1,4 +1,3 @@
-
const Popover = {
name: 'Popover',
props: {
@@ -10,6 +9,9 @@ const Popover = {
// 'container' for using offsetParent as boundaries for either axis
// or 'viewport'
boundTo: Object,
+ // Takes a selector to use as a replacement for the parent container
+ // for getting boundaries for x an y axis
+ boundToSelector: String,
// Takes a top/bottom/left/right object, how much space to leave
// between boundary and popover element
margin: Object,
@@ -27,6 +29,10 @@ const Popover = {
}
},
methods: {
+ containerBoundingClientRect () {
+ const container = this.boundToSelector ? this.$el.closest(this.boundToSelector) : this.$el.offsetParent
+ return container.getBoundingClientRect()
+ },
updateStyles () {
if (this.hidden) {
this.styles = {
@@ -45,7 +51,8 @@ const Popover = {
// Minor optimization, don't call a slow reflow call if we don't have to
const parentBounds = this.boundTo &&
(this.boundTo.x === 'container' || this.boundTo.y === 'container') &&
- this.$el.offsetParent.getBoundingClientRect()
+ this.containerBoundingClientRect()
+
const margin = this.margin || {}
// What are the screen bounds for the popover? Viewport vs container
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index c4d7f7e2..e3d8d087 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -81,6 +81,7 @@
v-model="newStatus.spoilerText"
type="text"
:placeholder="$t('post_status.content_warning')"
+ :disabled="posting"
class="form-post-subject"
>
</EmojiInput>
diff --git a/src/components/post_status_modal/post_status_modal.js b/src/components/post_status_modal/post_status_modal.js
index be945400..b44354db 100644
--- a/src/components/post_status_modal/post_status_modal.js
+++ b/src/components/post_status_modal/post_status_modal.js
@@ -13,6 +13,9 @@ const PostStatusModal = {
}
},
computed: {
+ isLoggedIn () {
+ return !!this.$store.state.users.currentUser
+ },
modalActivated () {
return this.$store.state.postStatus.modalActivated
},
diff --git a/src/components/post_status_modal/post_status_modal.vue b/src/components/post_status_modal/post_status_modal.vue
index 07c58f74..dbcd321e 100644
--- a/src/components/post_status_modal/post_status_modal.vue
+++ b/src/components/post_status_modal/post_status_modal.vue
@@ -1,5 +1,6 @@
<template>
<Modal
+ v-if="isLoggedIn && !resettingForm"
:is-open="modalActivated"
class="post-form-modal-view"
@backdropClicked="closeModal"
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index fcfad23b..d14f854c 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -256,6 +256,13 @@
:label="$t('settings.links')"
/>
<ContrastRatio :contrast="previewContrast.postLink" />
+ <ColorInput
+ v-model="postGreentextColorLocal"
+ name="postGreentextColor"
+ :fallback="previewTheme.colors.cGreen"
+ :label="$t('settings.greentext')"
+ />
+ <ContrastRatio :contrast="previewContrast.postGreentext" />
<h4>{{ $t('settings.style.advanced_colors.alert') }}</h4>
<ColorInput
v-model="alertErrorColorLocal"
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 336f912a..7ec29b28 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -418,7 +418,7 @@ $status-margin: 0.75em;
max-width: 85%;
font-weight: bold;
- img {
+ img.emoji {
width: 14px;
height: 14px;
vertical-align: middle;
diff --git a/src/components/status_content/status_content.vue b/src/components/status_content/status_content.vue
index 8c2e8749..efc2485e 100644
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@@ -164,23 +164,23 @@ $status-margin: 0.75em;
word-break: break-all;
}
+ img, video {
+ max-width: 100%;
+ max-height: 400px;
+ vertical-align: middle;
+ object-fit: contain;
+
+ &.emoji {
+ width: 32px;
+ height: 32px;
+ }
+ }
+
.status-content {
font-family: var(--postFont, sans-serif);
line-height: 1.4em;
white-space: pre-wrap;
- img, video {
- max-width: 100%;
- max-height: 400px;
- vertical-align: middle;
- object-fit: contain;
-
- &.emoji {
- width: 32px;
- height: 32px;
- }
- }
-
blockquote {
margin: 0.2em 0 0.2em 2em;
font-style: italic;
@@ -226,7 +226,7 @@ $status-margin: 0.75em;
.greentext {
color: $fallback--cGreen;
- color: var(--cGreen, $fallback--cGreen);
+ color: var(--postGreentext, $fallback--cGreen);
}
.timeline :not(.panel-disabled) > {
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index 95760bf8..201727d4 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -124,6 +124,14 @@ const UserProfile = {
onTabSwitch (tab) {
this.tab = tab
this.$router.replace({ query: { tab } })
+ },
+ linkClicked ({ target }) {
+ if (target.tagName === 'SPAN') {
+ target = target.parentNode
+ }
+ if (target.tagName === 'A') {
+ window.open(target.href, '_blank')
+ }
}
},
watch: {
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 1871d46c..361a3b5c 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -11,6 +11,31 @@
:allow-zooming-avatar="true"
rounded="top"
/>
+ <div
+ v-if="user.fields_html && user.fields_html.length > 0"
+ class="user-profile-fields"
+ >
+ <dl
+ v-for="(field, index) in user.fields_html"
+ :key="index"
+ class="user-profile-field"
+ >
+ <!-- eslint-disable vue/no-v-html -->
+ <dt
+ :title="user.fields_text[index].name"
+ class="user-profile-field-name"
+ @click.prevent="linkClicked"
+ v-html="field.name"
+ />
+ <dd
+ :title="user.fields_text[index].value"
+ class="user-profile-field-value"
+ @click.prevent="linkClicked"
+ v-html="field.value"
+ />
+ <!-- eslint-enable vue/no-v-html -->
+ </dl>
+ </div>
<tab-switcher
:active-tab="tab"
:render-only-focused="true"
@@ -108,11 +133,60 @@
<script src="./user_profile.js"></script>
<style lang="scss">
+@import '../../_variables.scss';
.user-profile {
flex: 2;
flex-basis: 500px;
+ .user-profile-fields {
+ margin: 0 0.5em;
+ img {
+ object-fit: contain;
+ vertical-align: middle;
+ max-width: 100%;
+ max-height: 400px;
+
+ &.emoji {
+ width: 18px;
+ height: 18px;
+ }
+ }
+
+ .user-profile-field {
+ display: flex;
+ margin: 0.25em auto;
+ max-width: 32em;
+ border: 1px solid var(--border, $fallback--border);
+ border-radius: $fallback--inputRadius;
+ border-radius: var(--inputRadius, $fallback--inputRadius);
+
+ .user-profile-field-name {
+ flex: 0 1 30%;
+ font-weight: 500;
+ text-align: right;
+ color: var(--lightText);
+ min-width: 120px;
+ border-right: 1px solid var(--border, $fallback--border);
+ }
+
+ .user-profile-field-value {
+ flex: 1 1 70%;
+ color: var(--text);
+ margin: 0 0 0 0.25em;
+ }
+
+ .user-profile-field-name, .user-profile-field-value {
+ line-height: 18px;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+ padding: 0.5em 1.5em;
+ box-sizing: border-box;
+ }
+ }
+ }
+
.userlist-placeholder {
display: flex;
justify-content: center;
diff --git a/src/modules/users.js b/src/modules/users.js
index f9329f2a..5e32bb49 100644
--- a/src/modules/users.js
+++ b/src/modules/users.js
@@ -428,10 +428,10 @@ const users = {
store.commit('setUserForNotification', notification)
})
},
- searchUsers (store, { query }) {
- return store.rootState.api.backendInteractor.searchUsers({ query })
+ searchUsers ({ rootState, commit }, { query }) {
+ return rootState.api.backendInteractor.searchUsers({ query })
.then((users) => {
- store.commit('addNewUsers', users)
+ commit('addNewUsers', users)
return users
})
},
diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js
index c7ed65a4..3bdb92f3 100644
--- a/src/services/entity_normalizer/entity_normalizer.service.js
+++ b/src/services/entity_normalizer/entity_normalizer.service.js
@@ -56,6 +56,12 @@ export const parseUser = (data) => {
value: addEmojis(field.value, data.emojis)
}
})
+ output.fields_text = data.fields.map(field => {
+ return {
+ name: unescape(field.name.replace(/<[^>]*>/g, '')),
+ value: unescape(field.value.replace(/<[^>]*>/g, ''))
+ }
+ })
// Utilize avatar_static for gif avatars?
output.profile_image_url = data.avatar
@@ -258,6 +264,12 @@ export const parseStatus = (data) => {
output.summary_html = addEmojis(escape(data.spoiler_text), data.emojis)
output.external_url = data.url
output.poll = data.poll
+ if (output.poll) {
+ output.poll.options = (output.poll.options || []).map(field => ({
+ ...field,
+ title_html: addEmojis(field.title, data.emojis)
+ }))
+ }
output.pinned = data.pinned
output.muted = data.muted
} else {
diff --git a/src/services/theme_data/pleromafe.js b/src/services/theme_data/pleromafe.js
index 0c1fe543..b577cfab 100644
--- a/src/services/theme_data/pleromafe.js
+++ b/src/services/theme_data/pleromafe.js
@@ -356,6 +356,12 @@ export const SLOT_INHERITANCE = {
textColor: 'preserve'
},
+ postGreentext: {
+ depends: ['cGreen'],
+ layer: 'bg',
+ textColor: 'preserve'
+ },
+
border: {
depends: ['fg'],
opacity: 'border',
generated by cgit v1.2.3-70-g09d2 (git 2.49.0) at 2025-11-11 14:53:39 +0000