HoovesSocial/hippofish
2
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

refactor: online indicator

Browse source
This commit is contained in:
ThatOneCalculator 2023-01-21 11:53:45 -08:00
parent 7b51c56169
commit eb14539989
No known key found for this signature in database
GPG key ID: 8703CACD01000000
2 changed files with 8 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
packages/client/src/components/MkUserOnlineIndicator.vue
View file

@ -27,19 +27,19 @@ const text = $computed(() => {
border-radius: 120%; // Blinkのバグか知らんけど、100%ぴったりにすると何故か若干楕円でレンダリングされる
&.online {
background: #58d4c9;
background: #9ccfd8;
}
&.active {
background: #e4bc48;
background: #f6c177;
}
&.offline {
background: #ea5353;
background: #eb6f92;
}
&.unknown {
background: #888;
background: #6e6a86;
}
}
</style>

8
packages/client/src/components/global/MkAvatar.vue
View file

@ -1,11 +1,11 @@
<template>
<span v-if="disableLink" v-user-preview="disablePreview ? undefined : user.id" class="eiwwqkts _noSelect" :class="{ cat: user.isCat, square: $store.state.squareAvatars }" :style="{ color }" :title="acct(user)" @click="onClick">
<img class="inner" :src="url" decoding="async"/>
<MkUserOnlineIndicator v-if="showIndicator" class="indicator" :user="user"/>
<MkUserOnlineIndicator v-if="showIndicator && user.instance == null" class="indicator" :user="user"/>
</span>
<MkA v-else v-user-preview="disablePreview ? undefined : user.id" class="eiwwqkts _noSelect" :class="{ cat: user.isCat, square: $store.state.squareAvatars }" :style="{ color }" :to="userPage(user)" :title="acct(user)" :target="target">
<img class="inner" :src="url" decoding="async"/>
<MkUserOnlineIndicator v-if="showIndicator" class="indicator" :user="user"/>
<MkUserOnlineIndicator v-if="showIndicator && user.instance == null" class="indicator" :user="user"/>
</MkA>
</template>
@ -96,8 +96,8 @@ watch(() => props.user.avatarBlurhash, () => {
z-index: 1;
bottom: 0;
left: 0;
width: 20%;
height: 20%;
width: 18%;
height: 18%;
}
&.square {