diff options
| author | syuilo <Syuilotan@yahoo.co.jp> | 2021-04-10 12:40:50 +0900 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-04-10 12:40:50 +0900 |
| commit | d3fe02fb3e8dd7bfc45c246d54d45acccd5959c7 (patch) | |
| tree | 4cd72e5e5868e89ef3dd83ada99495da2bd7cd85 /src/client/pages/messaging | |
| parent | Fix punycode deprecation warning (#7426) (diff) | |
| download | misskey-d3fe02fb3e8dd7bfc45c246d54d45acccd5959c7.tar.gz misskey-d3fe02fb3e8dd7bfc45c246d54d45acccd5959c7.tar.bz2 misskey-d3fe02fb3e8dd7bfc45c246d54d45acccd5959c7.zip | |
Default UI redesign (#7429)
* wip
* wip
* wip
* wip
* Update default.sidebar.vue
* wip
* wip
* wip
* wip
* wip
* wip
* wip
* wip
* wip
* Update sticky-sidebar.ts
* wip
* wip
* Update messaging-room.form.vue
* Update timeline.vue
Diffstat (limited to 'src/client/pages/messaging')
| -rw-r--r-- | src/client/pages/messaging/index.vue | 68 | ||||
| -rw-r--r-- | src/client/pages/messaging/messaging-room.form.vue | 4 |
2 files changed, 35 insertions, 37 deletions
diff --git a/src/client/pages/messaging/index.vue b/src/client/pages/messaging/index.vue index c906b968a4..114a01ec3c 100644 --- a/src/client/pages/messaging/index.vue +++ b/src/client/pages/messaging/index.vue @@ -1,40 +1,38 @@ <template> -<div class="_section"> - <div class="mk-messaging _content" v-size="{ max: [400] }"> - <MkButton @click="start" primary class="start"><Fa :icon="faPlus"/> {{ $ts.startMessaging }}</MkButton> +<div class="yweeujhr _root" v-size="{ max: [400] }"> + <MkButton @click="start" primary class="start"><Fa :icon="faPlus"/> {{ $ts.startMessaging }}</MkButton> - <div class="history" v-if="messages.length > 0"> - <MkA v-for="(message, i) in messages" - class="message _panel" - :class="{ isMe: isMe(message), isRead: message.groupId ? message.reads.includes($i.id) : message.isRead }" - :to="message.groupId ? `/my/messaging/group/${message.groupId}` : `/my/messaging/${getAcct(isMe(message) ? message.recipient : message.user)}`" - :data-index="i" - :key="message.id" - v-anim="i" - > - <div> - <MkAvatar class="avatar" :user="message.groupId ? message.user : isMe(message) ? message.recipient : message.user"/> - <header v-if="message.groupId"> - <span class="name">{{ message.group.name }}</span> - <MkTime :time="message.createdAt" class="time"/> - </header> - <header v-else> - <span class="name"><MkUserName :user="isMe(message) ? message.recipient : message.user"/></span> - <span class="username">@{{ acct(isMe(message) ? message.recipient : message.user) }}</span> - <MkTime :time="message.createdAt" class="time"/> - </header> - <div class="body"> - <p class="text"><span class="me" v-if="isMe(message)">{{ $ts.you }}:</span>{{ message.text }}</p> - </div> + <div class="history" v-if="messages.length > 0"> + <MkA v-for="(message, i) in messages" + class="message _block _isolated" + :class="{ isMe: isMe(message), isRead: message.groupId ? message.reads.includes($i.id) : message.isRead }" + :to="message.groupId ? `/my/messaging/group/${message.groupId}` : `/my/messaging/${getAcct(isMe(message) ? message.recipient : message.user)}`" + :data-index="i" + :key="message.id" + v-anim="i" + > + <div> + <MkAvatar class="avatar" :user="message.groupId ? message.user : isMe(message) ? message.recipient : message.user"/> + <header v-if="message.groupId"> + <span class="name">{{ message.group.name }}</span> + <MkTime :time="message.createdAt" class="time"/> + </header> + <header v-else> + <span class="name"><MkUserName :user="isMe(message) ? message.recipient : message.user"/></span> + <span class="username">@{{ acct(isMe(message) ? message.recipient : message.user) }}</span> + <MkTime :time="message.createdAt" class="time"/> + </header> + <div class="body"> + <p class="text"><span class="me" v-if="isMe(message)">{{ $ts.you }}:</span>{{ message.text }}</p> </div> - </MkA> - </div> - <div class="_fullinfo" v-if="!fetching && messages.length == 0"> - <img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/> - <div>{{ $ts.noHistory }}</div> - </div> - <MkLoading v-if="fetching"/> + </div> + </MkA> </div> + <div class="_fullinfo" v-if="!fetching && messages.length == 0"> + <img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/> + <div>{{ $ts.noHistory }}</div> + </div> + <MkLoading v-if="fetching"/> </div> </template> @@ -167,10 +165,10 @@ export default defineComponent({ </script> <style lang="scss" scoped> -.mk-messaging { +.yweeujhr { > .start { - margin: 0 auto var(--margin) auto; + margin: var(--margin) auto var(--margin) auto; } > .history { diff --git a/src/client/pages/messaging/messaging-room.form.vue b/src/client/pages/messaging/messaging-room.form.vue index 5826b8d0d2..c547e18850 100644 --- a/src/client/pages/messaging/messaging-room.form.vue +++ b/src/client/pages/messaging/messaging-room.form.vue @@ -1,5 +1,5 @@ <template> -<div class="mk-messaging-form _panel" +<div class="pemppnzi _block" @dragover.stop="onDragover" @drop.stop="onDrop" > @@ -230,7 +230,7 @@ export default defineComponent({ </script> <style lang="scss" scoped> -.mk-messaging-form { +.pemppnzi { position: relative; > textarea { |