Merge branch 'develop' into hazelnoot/following-timeline

This commit is contained in:
Hazel K 2024-10-06 11:16:43 -04:00
commit 4ca27692ac
28 changed files with 129 additions and 36 deletions

View file

@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only
@click="emit('click')"
>
<div :class="$style.name"><MkCondensedLine :minScale="0.5">{{ decoration.name }}</MkCondensedLine></div>
<MkAvatar style="width: 60px; height: 60px;" :user="$i" :decorations="[{ url: decoration.url, angle, flipH, offsetX, offsetY }]" forceShowDecoration/>
<MkAvatar style="width: 60px; height: 60px;" :user="$i" :decorations="[{ url: decoration.url, angle, flipH, offsetX, offsetY, showBelow }]" forceShowDecoration/>
<i v-if="decoration.roleIdsThatCanBeUsedThisDecoration.length > 0 && !$i.roles.some(r => decoration.roleIdsThatCanBeUsedThisDecoration.includes(r.id))" :class="$style.lock" class="ti ti-lock"></i>
</div>
</template>
@ -32,6 +32,7 @@ const props = defineProps<{
flipH?: boolean;
offsetX?: number;
offsetY?: number;
showBelow?: boolean;
}>();
const emit = defineEmits<{

View file

@ -29,6 +29,9 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkRange v-model="offsetY" continuousUpdate :min="-0.25" :max="0.25" :step="0.025" :textConverter="(v) => `${Math.floor(v * 100)}%`">
<template #label>Y {{ i18n.ts.position }}</template>
</MkRange>
<MkSwitch v-model="showBelow">
<template #label>{{ i18n.ts.showBelowAvatar }}</template>
</MkSwitch>
<MkSwitch v-model="flipH">
<template #label>{{ i18n.ts.flip }}</template>
</MkSwitch>
@ -71,12 +74,14 @@ const emit = defineEmits<{
flipH: boolean;
offsetX: number;
offsetY: number;
showBelow: boolean;
}): void;
(ev: 'update', payload: {
angle: number;
flipH: boolean;
offsetX: number;
offsetY: number;
showBelow: boolean;
}): void;
(ev: 'detach'): void;
}>();
@ -87,6 +92,7 @@ const angle = ref((props.usingIndex != null ? $i.avatarDecorations[props.usingIn
const flipH = ref((props.usingIndex != null ? $i.avatarDecorations[props.usingIndex].flipH : null) ?? false);
const offsetX = ref((props.usingIndex != null ? $i.avatarDecorations[props.usingIndex].offsetX : null) ?? 0);
const offsetY = ref((props.usingIndex != null ? $i.avatarDecorations[props.usingIndex].offsetY : null) ?? 0);
const showBelow = ref((props.usingIndex != null ? $i.avatarDecorations[props.usingIndex].showBelow : null) ?? false);
const decorationsForPreview = computed(() => {
const decoration = {
@ -96,6 +102,7 @@ const decorationsForPreview = computed(() => {
flipH: flipH.value,
offsetX: offsetX.value,
offsetY: offsetY.value,
showBelow: showBelow.value,
};
const decorations = [...$i.avatarDecorations];
if (props.usingIndex != null) {
@ -116,6 +123,7 @@ async function update() {
flipH: flipH.value,
offsetX: offsetX.value,
offsetY: offsetY.value,
showBelow: showBelow.value,
});
dialog.value.close();
}
@ -126,6 +134,7 @@ async function attach() {
flipH: flipH.value,
offsetX: offsetX.value,
offsetY: offsetY.value,
showBelow: showBelow.value,
});
dialog.value.close();
}

View file

@ -21,6 +21,7 @@ SPDX-License-Identifier: AGPL-3.0-only
:flipH="avatarDecoration.flipH"
:offsetX="avatarDecoration.offsetX"
:offsetY="avatarDecoration.offsetY"
:showBelow="avatarDecoration.showBelow"
:active="true"
@click="openDecoration(avatarDecoration, i)"
/>
@ -78,6 +79,7 @@ function openDecoration(avatarDecoration, index?: number) {
flipH: payload.flipH,
offsetX: payload.offsetX,
offsetY: payload.offsetY,
showBelow: payload.showBelow,
};
const update = [...$i.avatarDecorations, decoration];
await os.apiWithDialog('i/update', {
@ -92,6 +94,7 @@ function openDecoration(avatarDecoration, index?: number) {
flipH: payload.flipH,
offsetX: payload.offsetX,
offsetY: payload.offsetY,
showBelow: payload.showBelow,
};
const update = [...$i.avatarDecorations];
update[index] = decoration;

View file

@ -68,6 +68,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkSwitch v-model="showGapBetweenNotesInTimeline">{{ i18n.ts.showGapBetweenNotesInTimeline }}</MkSwitch>
<MkSwitch v-model="loadRawImages">{{ i18n.ts.loadRawImages }}</MkSwitch>
<MkSwitch v-model="showTickerOnReplies">{{ i18n.ts.showTickerOnReplies }}</MkSwitch>
<MkSwitch v-model="disableCatSpeak">{{ i18n.ts.disableCatSpeak }}</MkSwitch>
<MkSelect v-model="searchEngine" placeholder="Other">
<template #label>{{ i18n.ts.searchEngine }}</template>
<option
@ -400,6 +401,7 @@ const disableShowingAnimatedImages = computed(defaultStore.makeGetterSetter('dis
const forceShowAds = computed(defaultStore.makeGetterSetter('forceShowAds'));
const oneko = computed(defaultStore.makeGetterSetter('oneko'));
const loadRawImages = computed(defaultStore.makeGetterSetter('loadRawImages'));
const disableCatSpeak = computed(defaultStore.makeGetterSetter('disableCatSpeak'));
const highlightSensitiveMedia = computed(defaultStore.makeGetterSetter('highlightSensitiveMedia'));
const imageNewTab = computed(defaultStore.makeGetterSetter('imageNewTab'));
const enableFaviconNotificationDot = computed(defaultStore.makeGetterSetter('enableFaviconNotificationDot'));

View file

@ -77,6 +77,7 @@ const defaultStoreSaveKeys: (keyof typeof defaultStore['state'])[] = [
'enableFaviconNotificationDot',
'imageNewTab',
'dataSaver',
'disableCatSpeak',
'disableShowingAnimatedImages',
'emojiStyle',
'disableDrawer',

View file

@ -30,7 +30,12 @@ SPDX-License-Identifier: AGPL-3.0-only
</button>
</div>
</div>
<span v-if="$i && $i.id != user.id && user.isFollowed" class="followed">{{ i18n.ts.followsYou }}</span>
<div v-if="$i && $i.id != user.id" class="info-badges">
<span v-if="user.isFollowed">{{ i18n.ts.followsYou }}</span>
<span v-if="user.isMuted">{{ i18n.ts.muted }}</span>
<span v-if="user.isRenoteMuted">{{ i18n.ts.renoteMuted }}</span>
<span v-if="user.isBlocking">{{ i18n.ts.blocked }}</span>
</div>
<div class="actions">
<button class="menu _button" @click="menu"><i class="ti ti-dots"></i></button>
<MkFollowButton v-if="$i?.id != user.id" v-model:user="user" :inline="true" :transparent="false" :full="true" class="koudoku"/>
@ -445,15 +450,25 @@ onUnmounted(() => {
background: linear-gradient(transparent, rgba(#000, 0.7));
}
> .followed {
> .info-badges {
position: absolute;
top: 12px;
left: 12px;
padding: 4px 8px;
color: #fff;
background: rgba(0, 0, 0, 0.7);
font-size: 0.7em;
border-radius: var(--radius-sm);
display: flex;
flex-direction: row;
> * {
padding: 4px 8px;
color: #fff;
background: rgba(0, 0, 0, 0.7);
font-size: 0.7em;
border-radius: var(--radius-sm);
}
> :not(:first-child) {
margin-left: 8px;
}
}
> .actions {