use SkTransitionGroup in all locations that hardcode use of TransitionGroup

This commit is contained in:
Hazelnoot 2025-05-29 12:43:12 -04:00
parent 2f91c66ba2
commit 18a6f47082
6 changed files with 41 additions and 34 deletions

View file

@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="wbrkwalb">
<MkLoading v-if="fetching"/>
<TransitionGroup v-else tag="div" :name="prefer.s.animation ? 'chart' : ''" class="instances">
<SkTransitionGroup v-else tag="div" name="chart" class="instances">
<div v-for="(instance, i) in instances" :key="instance.id" class="instance">
<img :src="getInstanceIcon(instance)" alt=""/>
<div class="body">
@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<MkMiniChart class="chart" :src="charts[i].requests.received"/>
</div>
</TransitionGroup>
</SkTransitionGroup>
</div>
</MkContainer>
</template>
@ -37,6 +37,7 @@ import { misskeyApi, misskeyApiGet } from '@/utility/misskey-api.js';
import { i18n } from '@/i18n.js';
import { getProxiedImageUrlNullable } from '@/utility/media-proxy.js';
import { prefer } from '@/preferences.js';
import SkTransitionGroup from '@/components/SkTransitionGroup.vue';
const name = 'federation';

View file

@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="wbrkwala">
<MkLoading v-if="fetching"/>
<TransitionGroup v-else tag="div" :name="prefer.s.animation ? 'chart' : ''" class="tags">
<SkTransitionGroup v-else tag="div" name="chart" class="tags">
<div v-for="stat in stats" :key="stat.tag">
<div class="tag">
<MkA class="a" :to="`/tags/${ encodeURIComponent(stat.tag) }`" :title="stat.tag">#{{ stat.tag }}</MkA>
@ -18,7 +18,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<MkMiniChart class="chart" :src="stat.chart"/>
</div>
</TransitionGroup>
</SkTransitionGroup>
</div>
</MkContainer>
</template>
@ -35,6 +35,7 @@ import MkMiniChart from '@/components/MkMiniChart.vue';
import { misskeyApiGet } from '@/utility/misskey-api.js';
import { i18n } from '@/i18n.js';
import { prefer } from '@/preferences.js';
import SkTransitionGroup from '@/components/SkTransitionGroup.vue';
const name = 'hashtags';