diff --git a/README.md b/README.md index 73ae8b062..edbb1339e 100644 --- a/README.md +++ b/README.md @@ -21,6 +21,8 @@ ## 細かい変更点 +- 「フォローされています」の表示を目立たせられるように + - デフォルトの表示は目立たないため - 最大 15 件の投稿を固定できるように - 5 件は少ないと思ったため - 投稿ボタンを巨大にできるように diff --git a/locales/en-US.yml b/locales/en-US.yml index e4b6dd307..d929c9fda 100644 --- a/locales/en-US.yml +++ b/locales/en-US.yml @@ -1146,6 +1146,7 @@ languageForTranslation: "Language used for post translation" addRe: "Add \"re:\" at the beginning of comment in reply to a post with a content warning" showBigPostButton: "Show a bigger post button in the posting form" confirm: "Confirm" +emphasizeFollowed: "Highlight the \"Follows you\" sign on your follower info" _sensitiveMediaDetection: description: "Reduces the effort of server moderation through automatically recognizing diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index cc2c0dc6f..de600390b 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -998,6 +998,7 @@ addRe: "閲覧注意の投稿への返信で、注釈の先頭に\"re:\"を追 detectPostLanguage: "投稿の言語を自動検出し、外国語の投稿に翻訳ボタンを表示する" languageForTranslation: "投稿翻訳に使用する言語" showBigPostButton: "投稿ボタンを巨大にする" +emphasizeFollowed: "フォロワーのアカウントに表示される「フォローされています」の表示を強調する" _sensitiveMediaDetection: description: "機械学習を使って自動でセンシティブなメディアを検出し、モデレーションに役立てられます。サーバーの負荷が少し増えます。" diff --git a/packages/client/src/components/MkUserInfo.vue b/packages/client/src/components/MkUserInfo.vue index d2c189be5..ccc9a4ad9 100644 --- a/packages/client/src/components/MkUserInfo.vue +++ b/packages/client/src/components/MkUserInfo.vue @@ -10,6 +10,7 @@ {{ i18n.ts.followsYou }} @@ -92,12 +93,15 @@ import XShowMoreButton from "@/components/MkShowMoreButton.vue"; import MkNumber from "@/components/MkNumber.vue"; import { userPage } from "@/filters/user"; import { i18n } from "@/i18n"; +import { defaultStore } from "@/store"; const props = defineProps<{ user: misskey.entities.UserDetailed; detailed?: boolean; }>(); +const emphasizeFollowed = defaultStore.state.emphasizeFollowed; + let isLong = $ref( props.detailed && props.user.description && @@ -142,6 +146,11 @@ let collapsed = $ref(isLong); font-size: 0.7em; border-radius: 6px; } + + > .followed-emph { + background: var(--accent); + font-size: 1em; + } &.detailed::after { content: ""; background-image: var(--blur, inherit); diff --git a/packages/client/src/pages/settings/general.vue b/packages/client/src/pages/settings/general.vue index b434df466..9c0dd9135 100644 --- a/packages/client/src/pages/settings/general.vue +++ b/packages/client/src/pages/settings/general.vue @@ -198,6 +198,12 @@ {{ i18n.ts.squareAvatars }} + {{ i18n.ts.emphasizeFollowed + }}{{ + i18n.ts.originalFeature + }} {{ i18n.ts.seperateRenoteQuote }} @@ -428,13 +434,15 @@ const replaceChatButtonWithAccountButton = computed( const replaceWidgetsButtonWithReloadButton = computed( defaultStore.makeGetterSetter("replaceWidgetsButtonWithReloadButton"), ); -const addRe = computed(defaultStore.makeGetterSetter("addRe")); const detectPostLanguage = computed( defaultStore.makeGetterSetter("detectPostLanguage"), ); const showBigPostButton = computed( defaultStore.makeGetterSetter("showBigPostButton"), ); +const emphasizeFollowed = computed( + defaultStore.makeGetterSetter("emphasizeFollowed"), +); watch(swipeOnDesktop, () => { defaultStore.set("swipeOnMobile", true); diff --git a/packages/client/src/pages/user/home.vue b/packages/client/src/pages/user/home.vue index bf6e5d344..d9bd28df7 100644 --- a/packages/client/src/pages/user/home.vue +++ b/packages/client/src/pages/user/home.vue @@ -76,6 +76,9 @@ user.isFollowed " class="followed" + :class="{ + 'followed-emph': emphasizeFollowed, + }" >{{ i18n.ts.followsYou }} @@ -142,6 +145,9 @@ user.isFollowed " class="followed" + :class="{ + 'followed-emph': emphasizeFollowed, + }" >{{ i18n.ts.followsYou }}
@@ -404,6 +410,7 @@ const XPhotos = defineAsyncComponent(() => import("./index.photos.vue")); const XActivity = defineAsyncComponent(() => import("./index.activity.vue")); const hideFollowButton = defaultStore.state.hideFollowButtons; +const emphasizeFollowed = defaultStore.state.emphasizeFollowed; const emit = defineEmits(["refresh"]); const props = withDefaults( @@ -552,6 +559,11 @@ onUnmounted(() => { border-radius: 6px; } + > .followed-emph { + background: var(--accent); + font-size: 1em; + } + > .title { position: absolute; bottom: 0; @@ -581,6 +593,11 @@ onUnmounted(() => { font-size: 0.7em; border-radius: 24px; } + + > .followed-emph { + background: var(--accent); + font-size: 1em; + } } > .bottom { @@ -690,6 +707,11 @@ onUnmounted(() => { font-size: 0.7em; border-radius: 24px; } + + > .followed-emph { + background: var(--accent); + font-size: 1em; + } } > .followedWindow { diff --git a/packages/client/src/store.ts b/packages/client/src/store.ts index abc07a448..870c8bccb 100644 --- a/packages/client/src/store.ts +++ b/packages/client/src/store.ts @@ -370,6 +370,10 @@ export const defaultStore = markRaw( where: "device", default: false, }, + emphasizeFollowed: { + where: "deviceAccount", + default: true, + }, }), );