OpenSource/Sharkey
OpenSource/Sharkey
1
0
Fork 0
mirror of https://activitypub.software/TransFem-org/Sharkey.git synced 2024-12-14 06:00:44 +01:00
Code Issues Projects Releases Packages Wiki Activity

chore(client): tweak ui

Browse source
This commit is contained in:
syuilo 2022-07-07 20:19:50 +09:00
parent 15a9a4b119
commit c0eba65527
3 changed files with 35 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
packages/client/src/pages/follow-requests.vue
View file

@ -1,34 +1,37 @@
<template> <template>
<div> <MkStickyContainer>
<MkPagination ref="paginationComponent" :pagination="pagination"> <template #header><MkPageHeader/></template>
<template #empty> <MkSpacer :content-max="800">
<div class="_fullinfo"> <MkPagination ref="paginationComponent" :pagination="pagination">
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/> <template #empty>
<div>{{ $ts.noFollowRequests }}</div> <div class="_fullinfo">
</div> <img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
</template> <div>{{ $ts.noFollowRequests }}</div>
<template #default="{items}"> </div>
<div class="mk-follow-requests"> </template>
<div v-for="req in items" :key="req.id" class="user _panel"> <template #default="{items}">
<MkAvatar class="avatar" :user="req.follower" :show-indicator="true"/> <div class="mk-follow-requests">
<div class="body"> <div v-for="req in items" :key="req.id" class="user _panel">
<div class="name"> <MkAvatar class="avatar" :user="req.follower" :show-indicator="true"/>
<MkA v-user-preview="req.follower.id" class="name" :to="userPage(req.follower)"><MkUserName :user="req.follower"/></MkA> <div class="body">
<p class="acct">@{{ acct(req.follower) }}</p> <div class="name">
</div> <MkA v-user-preview="req.follower.id" class="name" :to="userPage(req.follower)"><MkUserName :user="req.follower"/></MkA>
<div v-if="req.follower.description" class="description" :title="req.follower.description"> <p class="acct">@{{ acct(req.follower) }}</p>
<Mfm :text="req.follower.description" :is-note="false" :author="req.follower" :i="$i" :custom-emojis="req.follower.emojis" :plain="true" :nowrap="true"/> </div>
</div> <div v-if="req.follower.description" class="description" :title="req.follower.description">
<div class="actions"> <Mfm :text="req.follower.description" :is-note="false" :author="req.follower" :i="$i" :custom-emojis="req.follower.emojis" :plain="true" :nowrap="true"/>
<button class="_button" @click="accept(req.follower)"><i class="fas fa-check"></i></button> </div>
<button class="_button" @click="reject(req.follower)"><i class="fas fa-times"></i></button> <div class="actions">
<button class="_button" @click="accept(req.follower)"><i class="fas fa-check"></i></button>
<button class="_button" @click="reject(req.follower)"><i class="fas fa-times"></i></button>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </template>
</template> </MkPagination>
</MkPagination> </MkSpacer>
</div> </MkStickyContainer>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

4
packages/client/src/ui/_common_/statusbars.vue
View file

@ -71,6 +71,10 @@ const XUserList = defineAsyncComponent(() => import('./statusbar-user-list.vue')
padding: 0 var(--nameMargin); padding: 0 var(--nameMargin);
font-weight: bold; font-weight: bold;
color: var(--accent); color: var(--accent);
&:empty {
display: none;
}
} }
> .body { > .body {

2
packages/client/src/widgets/instance-cloud.vue
View file

@ -2,7 +2,7 @@
<MkContainer :naked="widgetProps.transparent" :show-header="false" class="mkw-instance-cloud"> <MkContainer :naked="widgetProps.transparent" :show-header="false" class="mkw-instance-cloud">
<div class=""> <div class="">
<MkTagCloud v-if="activeInstances"> <MkTagCloud v-if="activeInstances">
<li v-for="instance in activeInstances"> <li v-for="instance in activeInstances" :key="instance.id">
<a @click.prevent="onInstanceClick(instance)"> <a @click.prevent="onInstanceClick(instance)">
<img style="width: 32px;" :src="instance.iconUrl"> <img style="width: 32px;" :src="instance.iconUrl">
</a> </a>