Merge remote-tracking branch 'origin/develop' into customizable-post-actions

This commit is contained in:
Henry Jameson 2025-01-16 18:12:29 +02:00
commit 41f54b687b
35 changed files with 1345 additions and 1661 deletions

0
changelog.d/batch2.skip Normal file
View file

View file

@ -0,0 +1 @@
Added missing EN translation key for status.muted_user

View file

View file

@ -16,7 +16,7 @@
"lint-fix": "eslint --fix --ext .js,.vue src test/unit/specs test/e2e/specs"
},
"dependencies": {
"@babel/runtime": "7.21.5",
"@babel/runtime": "7.26.0",
"@chenfengyuan/vue-qrcode": "2.0.0",
"@fortawesome/fontawesome-svg-core": "6.4.0",
"@fortawesome/free-regular-svg-icons": "6.4.0",
@ -24,7 +24,7 @@
"@fortawesome/vue-fontawesome": "3.0.3",
"@kazvmoe-infra/pinch-zoom-element": "1.2.0",
"@kazvmoe-infra/unicode-emoji-json": "0.4.0",
"@ruffle-rs/ruffle": "0.1.0-nightly.2024.8.21",
"@ruffle-rs/ruffle": "0.1.0-nightly.2025.1.13",
"@vuelidate/core": "2.0.3",
"@vuelidate/validators": "2.0.4",
"body-scroll-lock": "3.1.5",
@ -37,11 +37,11 @@
"localforage": "1.10.0",
"pako": "^2.1.0",
"parse-link-header": "2.0.0",
"phoenix": "1.7.7",
"punycode.js": "2.3.0",
"qrcode": "1.5.3",
"phoenix": "1.7.18",
"punycode.js": "2.3.1",
"qrcode": "1.5.4",
"querystring-es3": "0.2.1",
"url": "0.11.0",
"url": "0.11.4",
"utf8": "3.0.0",
"vue": "3.2.45",
"vue-i18n": "10",
@ -51,18 +51,18 @@
"vuex": "4.1.0"
},
"devDependencies": {
"@babel/core": "7.21.8",
"@babel/eslint-parser": "7.21.8",
"@babel/plugin-transform-runtime": "7.21.4",
"@babel/preset-env": "7.21.5",
"@babel/register": "7.21.0",
"@babel/core": "7.26.0",
"@babel/eslint-parser": "7.26.5",
"@babel/plugin-transform-runtime": "7.25.9",
"@babel/preset-env": "7.26.0",
"@babel/register": "7.25.9",
"@intlify/vue-i18n-loader": "5.0.1",
"@ungap/event-target": "0.2.4",
"@vue/babel-helper-vue-jsx-merge-props": "1.4.0",
"@vue/babel-plugin-jsx": "1.2.2",
"@vue/babel-plugin-jsx": "1.2.5",
"@vue/compiler-sfc": "3.2.45",
"@vue/test-utils": "2.2.8",
"autoprefixer": "10.4.19",
"autoprefixer": "10.4.20",
"babel-loader": "9.1.3",
"babel-plugin-lodash": "3.3.4",
"chai": "4.3.7",
@ -70,7 +70,7 @@
"chromedriver": "108.0.0",
"connect-history-api-fallback": "2.0.0",
"copy-webpack-plugin": "11.0.0",
"cross-spawn": "7.0.3",
"cross-spawn": "7.0.6",
"css-loader": "6.10.0",
"css-minimizer-webpack-plugin": "4.2.2",
"custom-event-polyfill": "1.0.7",
@ -83,14 +83,14 @@
"eslint-plugin-vue": "9.9.0",
"eslint-webpack-plugin": "3.2.0",
"eventsource-polyfill": "0.9.6",
"express": "4.18.2",
"function-bind": "1.1.1",
"express": "4.21.2",
"function-bind": "1.1.2",
"html-webpack-plugin": "5.5.1",
"http-proxy-middleware": "2.0.6",
"http-proxy-middleware": "2.0.7",
"iso-639-1": "2.1.15",
"json-loader": "0.5.7",
"karma": "6.4.4",
"karma-coverage": "2.2.0",
"karma-coverage": "2.2.1",
"karma-firefox-launcher": "2.1.3",
"karma-mocha": "2.0.1",
"karma-mocha-reporter": "2.2.5",
@ -110,7 +110,7 @@
"postcss-scss": "^4.0.6",
"sass": "1.60.0",
"sass-loader": "13.2.2",
"selenium-server": "2.53.1",
"selenium-server": "3.141.59",
"semver": "7.3.8",
"serviceworker-webpack5-plugin": "2.0.0",
"shelljs": "0.8.5",

View file

@ -35,11 +35,11 @@ export default {
{
component: 'Root',
directives: {
'--buttonDefaultHoverGlow': 'shadow | 0 0 4 --text / 0.5',
'--buttonDefaultFocusGlow': 'shadow | 0 0 4 4 --link / 0.5',
'--buttonDefaultHoverGlow': 'shadow | 0 0 1 2 --text / 0.4',
'--buttonDefaultFocusGlow': 'shadow | 0 0 1 2 --link / 0.5',
'--buttonDefaultShadow': 'shadow | 0 0 2 #000000',
'--buttonDefaultBevel': 'shadow | $borderSide(#FFFFFF top 0.2 2), $borderSide(#000000 bottom 0.2 2)',
'--buttonPressedBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2 2), $borderSide(#000000 top 0.2 2)'
'--buttonDefaultBevel': 'shadow | $borderSide(#FFFFFF top 0.2 1), $borderSide(#000000 bottom 0.2 1)',
'--buttonPressedBevel': 'shadow | inset 0 0 4 #000000, $borderSide(#FFFFFF bottom 0.2 1), $borderSide(#000000 top 0.2 1)'
}
},
{
@ -78,28 +78,28 @@ export default {
{
state: ['toggled'],
directives: {
background: '--inheritedBackground,-14.2',
background: '--accent,-24.2',
shadow: ['--buttonDefaultShadow', '--buttonPressedBevel']
}
},
{
state: ['toggled', 'hover'],
directives: {
background: '--inheritedBackground,-14.2',
background: '--accent,-24.2',
shadow: ['--buttonDefaultHoverGlow', '--buttonPressedBevel']
}
},
{
state: ['toggled', 'disabled'],
directives: {
background: '$blend(--inheritedBackground 0.25 --parent)',
background: '$blend(--accent 0.25 --parent)',
shadow: ['--buttonPressedBevel']
}
},
{
state: ['disabled'],
directives: {
background: '$blend(--inheritedBackground 0.25 --parent)',
background: '$blend(--accent 0.25 --parent)',
shadow: ['--buttonDefaultBevel']
}
},

View file

@ -66,7 +66,6 @@ const ChatMessage = {
return this.message.attachments.length > 0
},
...mapState({
betterShadow: state => state.interface.browserSupport.cssFilter,
currentUser: state => state.users.currentUser,
restrictedNicknames: state => state.instance.restrictedNicknames
}),

View file

@ -20,7 +20,6 @@
>
<UserAvatar
:compact="true"
:better-shadow="betterShadow"
:user="author"
/>
</UserPopover>

View file

@ -8,6 +8,11 @@ const DialogModal = {
default: () => {},
type: Function
}
},
computed: {
mobileCenter () {
return this.$store.getters.mergedConfig.modalMobileCenter
}
}
}

View file

@ -1,7 +1,7 @@
<template>
<span
class="dialog-container"
:class="{ 'dark-overlay': darkOverlay }"
:class="{ 'dark-overlay': darkOverlay, '-center-mobile': mobileCenter }"
@click.self.stop="onCancel()"
>
<div
@ -79,6 +79,7 @@
padding: 0.5em;
border-top: 1px solid var(--border);
display: grid;
justify-content: end;
grid-gap: 0.5em;
grid-template-columns: min-content;
grid-auto-columns: min-content;
@ -99,6 +100,10 @@
justify-content: stretch;
align-items: end;
justify-items: stretch;
&.-center-mobile {
align-items: center;
}
}
.dialog-modal.panel {

View file

@ -64,12 +64,12 @@
<div v-if="editing">
<PostStatusForm
v-if="draft.type !== 'edit'"
:disable-draft="true"
:hide-draft="true"
v-bind="postStatusFormProps"
/>
<EditStatusForm
v-else
:disable-draft="true"
:hide-draft="true"
:params="postStatusFormProps"
/>
</div>

View file

@ -15,6 +15,7 @@
class="panel-body"
:params="params"
@posted="doCloseModal"
@draft-done="doCloseModal"
@can-close="doCloseModal"
/>
</div>

View file

@ -99,11 +99,6 @@
display: inline-flex;
justify-content: center;
align-items: center;
&.-picked-reaction {
border: 1px solid var(--accent);
margin-right: -1px;
}
}
}
}
@ -154,10 +149,6 @@
}
&.-picked-reaction {
border: 1px solid var(--accent);
margin-left: -1px; // offset the border, can't use inset shadows either
margin-right: -1px;
.svg-inline--fa {
color: var(--accent);
}

View file

@ -5,18 +5,22 @@
:for="manualEntry ? name : name + '-font-switcher'"
class="label"
>
{{ label }}
{{ $t('settings.style.themes3.font.label', { label }) }}
</label>
{{ ' ' }}
<Checkbox
v-if="typeof fallback !== 'undefined'"
class="font-checkbox"
:id="name + '-o'"
:model-value="present"
@change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
>
{{ $t('settings.style.themes3.define') }}
</Checkbox>
<p v-if="modelValue?.family">
<div
v-if="modelValue?.family"
class="font-input"
>
<label
v-if="manualEntry"
:id="name + '-label'"
@ -122,7 +126,7 @@
</optgroup>
</Select>
</span>
</p>
</div>
</div>
</template>
@ -134,6 +138,15 @@
min-width: 20em;
max-width: 20em;
}
.font-input {
margin-left: 2em;
margin-top: 0.5em;
}
.font-checkbox {
margin-left: 1em;
}
}
.invalid-tooltip {

View file

@ -18,7 +18,7 @@ export default {
{
component: 'Root',
directives: {
'--defaultInputBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2), $borderSide(#000000 top 0.2)',
'--defaultInputBevel': 'shadow | $borderSide(#FFFFFF bottom 0.2), $borderSide(#000000 top 0.2), inset 0 0 2 #000000 / 0.15',
'--defaultInputHoverGlow': 'shadow | 0 0 4 --text / 0.5',
'--defaultInputFocusGlow': 'shadow | 0 0 4 4 --link / 0.5'
}

View file

@ -43,7 +43,6 @@ const Notification = {
data () {
return {
statusExpanded: false,
betterShadow: this.$store.state.interface.browserSupport.cssFilter,
unmuted: false,
showingApproveConfirmDialog: false,
showingDenyConfirmDialog: false

View file

@ -48,7 +48,6 @@
<UserAvatar
class="post-avatar"
:compact="true"
:better-shadow="betterShadow"
:user="notification.from_profile"
/>
</UserPopover>

View file

@ -38,12 +38,20 @@ export default {
roundness: 3,
blur: '5px',
shadow: [{
x: 1,
y: 1,
blur: 4,
x: 0,
y: 0,
blur: 3,
spread: 0,
color: '#000000',
alpha: 0.6
alpha: 0.5
},
{
x: 0,
y: 4,
blur: 6,
spread: 3,
color: '#000000',
alpha: 0.3
}]
}
}

View file

@ -17,7 +17,23 @@ export default {
directives: {
backgroundNoCssColor: 'yes',
background: '--fg',
shadow: []
shadow: [{
x: 0,
y: 1,
blur: 3,
spread: 0,
color: '#000000',
alpha: 0.4
},
{
x: 0,
y: 1,
blur: 0,
spread: 0,
color: '#ffffff',
alpha: 0.2,
inset: true
}]
}
}
]

View file

@ -101,6 +101,8 @@ const PostStatusForm = {
'disableSubmit',
'disablePreview',
'disableDraft',
'hideDraft',
'closeable',
'placeholder',
'maxHeight',
'postHandler',
@ -115,6 +117,7 @@ const PostStatusForm = {
],
emits: [
'posted',
'draft-done',
'resize',
'mediaplay',
'mediapause',
@ -232,6 +235,9 @@ const PostStatusForm = {
showAllScopes () {
return !this.mergedConfig.minimalScopesMode
},
hideExtraActions () {
return this.disableDraft || this.hideDraft
},
emojiUserSuggestor () {
return suggestor({
emoji: [
@ -353,10 +359,12 @@ const PostStatusForm = {
}
},
safeToSaveDraft () {
return this.newStatus.status ||
return (
this.newStatus.status ||
this.newStatus.spoilerText ||
this.newStatus.files?.length ||
this.newStatus.hasPoll
) && this.saveable
},
...mapGetters(['mergedConfig']),
...mapState({
@ -760,12 +768,20 @@ const PostStatusForm = {
this.newStatus.id = id
}
this.saveable = false
if (!this.shouldAutoSaveDraft) {
this.clearStatus()
this.$emit('draft-done')
}
})
} else if (this.newStatus.id) {
// There is a draft, but there is nothing in it, clear it
return this.abandonDraft()
.then(() => {
this.saveable = false
if (!this.shouldAutoSaveDraft) {
this.clearStatus()
this.$emit('draft-done')
}
})
}
}
@ -773,7 +789,7 @@ const PostStatusForm = {
},
maybeAutoSaveDraft () {
if (this.shouldAutoSaveDraft) {
this.saveDraft()
this.saveDraft(false)
}
},
abandonDraft () {

View file

@ -316,13 +316,12 @@
</template>
</button>
<Popover
v-if="!disableDraft"
v-if="!hideExtraActions"
class="more-post-actions"
:normal-button="true"
trigger="click"
placement="bottom"
:offset="{ y: 5 }"
:bound-to="{ x: 'container' }"
>
<template #trigger>
<FAIcon
@ -336,15 +335,20 @@
role="menu"
>
<button
v-if="!disableDraft"
class="menu-item dropdown-item"
v-if="!hideDraft || !disableDraft"
role="menu"
:disabled="!safeToSaveDraft"
:disabled="!safeToSaveDraft && saveable"
:class="{ disabled: !safeToSaveDraft }"
@click.prevent="saveDraft"
@click="close"
>
<template v-if="closeable">
{{ $t('post_status.save_to_drafts_and_close_button') }}
</template>
<template v-else>
{{ $t('post_status.save_to_drafts_button') }}
</template>
</button>
</div>
</template>

View file

@ -14,7 +14,9 @@
<PostStatusForm
class="panel-body"
v-bind="params"
:closeable="true"
@posted="resetAndClose"
@draft-done="resetAndClose"
/>
</div>
</Modal>

View file

@ -57,7 +57,7 @@
:key="style.key"
:data-theme-key="style.key"
class="button-default theme-preview"
:class="{ toggled: isStyleActive(style.key), disabled: switchInProgress }"
:class="{ toggled: isThemeActive(style.key), disabled: switchInProgress }"
@click="style.version === 'v2' ? setTheme(style.key) : setStyle(style.key)"
:disabled="switchInProgress"
>
@ -207,8 +207,39 @@
</div>
</li>
<li>
<UnitSetting
path="emojiSize"
:step="0.1"
:units="['px', 'rem']"
:reset-default="{ 'px': 32, 'rem': 2.2 }"
>
{{ $t('settings.emoji_size') }}
</UnitSetting>
<ul
class="setting-list suboptions"
>
<li>
<FloatSetting
v-if="user"
path="emojiReactionsScale"
expert="1"
>
{{ $t('settings.emoji_reactions_scale') }}
</FloatSetting>
</li>
</ul>
</li>
<li>
<UnitSetting
path="navbarSize"
:step="0.1"
:units="['px', 'rem']"
:reset-default="{ 'px': 55, 'rem': 3.5 }"
>
{{ $t('settings.navbar_size') }}
</UnitSetting>
</li>
<h3>{{ $t('settings.style.interface_font_user_override') }}</h3>
<ul class="setting-list">
<li>
<FontControl
:model-value="mergedConfig.theme3hacks.fonts.interface"
@ -249,41 +280,6 @@
@update:modelValue="v => updateFont('monospace', v)"
/>
</li>
</ul>
</li>
<li>
<UnitSetting
path="emojiSize"
:step="0.1"
:units="['px', 'rem']"
:reset-default="{ 'px': 32, 'rem': 2.2 }"
>
{{ $t('settings.emoji_size') }}
</UnitSetting>
<ul
class="setting-list suboptions"
>
<li>
<FloatSetting
v-if="user"
path="emojiReactionsScale"
expert="1"
>
{{ $t('settings.emoji_reactions_scale') }}
</FloatSetting>
</li>
</ul>
</li>
<li>
<UnitSetting
path="navbarSize"
:step="0.1"
:units="['px', 'rem']"
:reset-default="{ 'px': 55, 'rem': 3.5 }"
>
{{ $t('settings.navbar_size') }}
</UnitSetting>
</li>
<h3>{{ $t('settings.columns') }}</h3>
<li>
<UnitSetting
@ -345,6 +341,11 @@
<div class="setting-item">
<h2>{{ $t('settings.visual_tweaks') }}</h2>
<ul class="setting-list">
<li>
<BooleanSetting path="modalMobileCenter">
{{ $t('settings.mobile_center_dialog') }}
</BooleanSetting>
</li>
<li>
<ChoiceSetting
id="forcedRoundness"

View file

@ -408,9 +408,6 @@ const Status = {
currentUser () {
return this.$store.state.users.currentUser
},
betterShadow () {
return this.$store.state.interface.browserSupport.cssFilter
},
mergedConfig () {
return this.$store.getters.mergedConfig
},

View file

@ -16,11 +16,19 @@ export default {
background: '--fg',
shadow: [{
x: 0,
y: 0,
y: 1,
blur: 4,
spread: 0,
color: '#000000',
alpha: 0.6
alpha: 0.4
},
{
x: 0,
y: 2,
blur: 7,
spread: 0,
color: '#000000',
alpha: 0.3
}]
}
},

View file

@ -11,10 +11,10 @@ export default {
shadow: [{
x: 0,
y: 1,
blur: 8,
blur: 4,
spread: 0,
color: '#000000',
alpha: 0.7
alpha: 0.2
}]
}
}

View file

@ -15,14 +15,14 @@ library.add(
const UserAvatar = {
props: [
'user',
'betterShadow',
'compact',
'showActorTypeIndicator'
],
data () {
return {
showPlaceholder: false,
defaultAvatar: `${this.$store.state.instance.server + this.$store.state.instance.defaultAvatar}`
defaultAvatar: `${this.$store.state.instance.server + this.$store.state.instance.defaultAvatar}`,
betterShadow: this.$store.state.interface.browserSupport.cssFilter
}
},
components: {

View file

@ -48,7 +48,6 @@ export default {
data () {
return {
followRequestInProgress: false,
betterShadow: this.$store.state.interface.browserSupport.cssFilter,
showingConfirmMute: false,
muteExpiryAmount: 0,
muteExpiryUnit: 'minutes'

View file

@ -16,10 +16,7 @@
class="user-info-avatar -link"
@click="zoomAvatar"
>
<UserAvatar
:better-shadow="betterShadow"
:user="user"
/>
<UserAvatar :user="user" />
<div class="user-info-avatar -link -overlay">
<FAIcon
class="fa-scale-110 fa-old-padding"
@ -30,7 +27,6 @@
<UserAvatar
v-else-if="typeof avatarAction === 'function'"
class="user-info-avatar"
:better-shadow="betterShadow"
:user="user"
@click="avatarAction"
/>
@ -38,10 +34,7 @@
v-else
:to="userProfileLink(user)"
>
<UserAvatar
:better-shadow="betterShadow"
:user="user"
/>
<UserAvatar :user="user" />
</router-link>
<div class="user-summary">
<div class="top-line">

View file

@ -321,7 +321,8 @@
"auto_save_nothing_new": "Nothing new to save.",
"auto_save_saved": "Saved.",
"auto_save_saving": "Saving...",
"save_to_drafts_button": "Save to drafts"
"save_to_drafts_button": "Save to drafts",
"save_to_drafts_and_close_button": "Save to drafts and close"
},
"registration": {
"bio_optional": "Bio (optional)",
@ -381,6 +382,7 @@
"actor_type_Person": "a normal user",
"actor_type_Service": "a bot",
"actor_type_Group": "a group",
"mobile_center_dialog": "Vertically center dialogs on mobile",
"app_name": "App name",
"expert_mode": "Show advanced",
"save": "Save changes",
@ -867,7 +869,8 @@
"lookup_local_fonts": "Load list of fonts installed on this computer",
"enter_manually": "Enter font name family manually",
"entry": "Enter {fontFamily}",
"select": "Select font"
"select": "Select font",
"label": "{label} font"
}
},
"interface_font_user_override": "Override theme/browser font used",
@ -1250,6 +1253,7 @@
"external_source": "External source",
"muted_words": "Wordfiltered: {word} | Wordfiltered: {word} and {numWordsMore} more words",
"multi_reason_mute": "{main} | {main} + one more reason | {main} + {numReasonsMore} more reasons",
"muted_user": "User muted",
"thread_muted": "Thread muted",
"thread_muted_and_words": ", has words:",
"sensitive_muted": "Muting sensitive content",

View file

@ -131,6 +131,9 @@ const persistedStateOptions = {
bookmarkFolders: bookmarkFoldersModule
},
plugins,
options: {
devtools: process.env.NODE_ENV !== 'production'
},
strict: false // Socket modifies itself, let's ignore this for now.
// strict: process.env.NODE_ENV !== 'production'
})

View file

@ -142,6 +142,7 @@ export const defaultState = {
modalOnApproveFollow: undefined, // instance default
modalOnDenyFollow: undefined, // instance default
modalOnRemoveUserFromFollowers: undefined, // instance default
modalMobileCenter: undefined,
playVideosInModal: false,
useOneClickNsfw: false,
useContainFit: true,

View file

@ -82,6 +82,7 @@ const defaultState = {
modalOnApproveFollow: false,
modalOnDenyFollow: false,
modalOnRemoveUserFromFollowers: false,
modalMobileCenter: false,
loginMethod: 'password',
logo: '/static/logo.svg',
logoMargin: '.2em',

View file

@ -81,9 +81,27 @@ export const colorFunctions = {
return alphaBlend(background, amount, foreground)
}
},
boost: {
argsNeeded: 2,
documentation: 'If given color is dark makes it darker, if color is light - makes it lighter',
args: [
'color: source color',
'amount: how much darken/brighten the color'
],
exec: (args, { findColor }, { dynamicVars, staticVars }) => {
const [colorArg, amountArg] = args
const color = convert(findColor(colorArg, { dynamicVars, staticVars })).rgb
const amount = Number(amountArg)
const isLight = relativeLuminance(color) < 0.5
const mod = isLight ? -1 : 1
return brightness(amount * mod, color).rgb
}
},
mod: {
argsNeeded: 2,
documentation: 'Old function that increases or decreases brightness depending if color is dark or light. Advised against using it as it might give unexpected results.',
documentation: 'Old function that increases or decreases brightness depending if background color is dark or light. Advised against using it as it might give unexpected results.',
args: [
'color: source color',
'amount: how much darken/brighten the color'
@ -109,6 +127,7 @@ export const shadowFunctions = {
args: [
'color: border color',
'side: string indicating on which side border should be, takes either one word or two words joined by dash (i.e. "left" or "bottom-right")',
'width: border width (thickness)',
'[alpha]: (Optional) border opacity, defaults to 1 (fully opaque)',
'[inset]: (Optional) whether border should be on the inside or outside, defaults to inside'
],

View file

@ -94,7 +94,7 @@ Button:toggled:pressed {
}
Input {
background: $mod(--bg -80);
background: $boost(--bg 20);
shadow: --defaultInputBevel;
roundness: 0
}

2666
yarn.lock

File diff suppressed because it is too large Load diff