worldcone/cherrypick
2
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

tweak 63afde0b

Browse source
This commit is contained in:
NoriDev 2023-06-16 16:42:13 +09:00
parent 642650909d
commit 04d9cc7e3d
4 changed files with 84 additions and 74 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
packages/frontend/src/components/MkCwButton.vue
View file

@ -36,14 +36,17 @@ const toggle = () => {
<style lang="scss" module> <style lang="scss" module>
.root { .root {
display: inline-block; display: inline-block;
padding: 4px 8px; margin: 5px 0;
padding: 6px;
font-size: 0.7em; font-size: 0.7em;
color: var(--cwFg); color: var(--cwFg);
background: var(--cwBg); background: var(--cwBg);
border-radius: 2px; border-radius: 5px;
transition: background-color .25s ease-in-out;
&:hover { &:hover {
background: var(--cwHoverBg); color: var(--cwBg);
background: var(--panel);
} }
} }

12
packages/frontend/src/components/MkNote.vue
View file

@ -46,9 +46,11 @@
<MkAvatar v-if="!defaultStore.state.hideAvatarsInNote" :class="[$style.avatar, { [$style.avatarReplyTo]: appearNote.reply, [$style.showEl]: !appearNote.reply && showEl && mainRouter.currentRoute.value.name === 'index', [$style.showElTab]: !appearNote.reply && showEl && mainRouter.currentRoute.value.name !== 'index' }]" :user="appearNote.user" link preview/> <MkAvatar v-if="!defaultStore.state.hideAvatarsInNote" :class="[$style.avatar, { [$style.avatarReplyTo]: appearNote.reply, [$style.showEl]: !appearNote.reply && showEl && mainRouter.currentRoute.value.name === 'index', [$style.showElTab]: !appearNote.reply && showEl && mainRouter.currentRoute.value.name !== 'index' }]" :user="appearNote.user" link preview/>
<div :class="$style.main"> <div :class="$style.main">
<MkNoteHeader :note="appearNote" :mini="true"/> <MkNoteHeader :note="appearNote" :mini="true"/>
<div style="container-type: inline-size; padding-top: 10px;"> </div>
</div>
<div style="container-type: inline-size;">
<p v-if="appearNote.cw != null" :class="$style.cw"> <p v-if="appearNote.cw != null" :class="$style.cw">
<Mfm v-if="appearNote.cw != ''" style="margin-right: 8px;" :text="appearNote.cw" :author="appearNote.user" :i="$i"/> <Mfm v-if="appearNote.cw != ''" :text="appearNote.cw" :author="appearNote.user" :i="$i"/>
<MkCwButton v-model="showContent" :note="appearNote"/> <MkCwButton v-model="showContent" :note="appearNote"/>
</p> </p>
<div v-show="appearNote.cw == null || showContent" :class="[{ [$style.contentCollapsed]: collapsed }]"> <div v-show="appearNote.cw == null || showContent" :class="[{ [$style.contentCollapsed]: collapsed }]">
@ -84,10 +86,8 @@
</div> </div>
<MkA v-if="appearNote.channel && !inChannel" :class="$style.channel" :to="`/channels/${appearNote.channel.id}`"><i class="ti ti-device-tv"></i> {{ appearNote.channel.name }}</MkA> <MkA v-if="appearNote.channel && !inChannel" :class="$style.channel" :to="`/channels/${appearNote.channel.id}`"><i class="ti ti-device-tv"></i> {{ appearNote.channel.name }}</MkA>
</div> </div>
</div>
</div>
<div v-if="appearNote.renote" :class="$style.quote"><MkNoteSimple :note="appearNote.renote" :class="$style.quoteNote"/></div> <div v-if="appearNote.renote" :class="$style.quote"><MkNoteSimple :note="appearNote.renote" :class="$style.quoteNote"/></div>
<div style="padding-left: 10px"> <div>
<MkReactionsViewer :note="appearNote" :maxNumber="16"> <MkReactionsViewer :note="appearNote" :maxNumber="16">
<template #more> <template #more>
<button class="_button" :class="$style.reactionDetailsButton" @click="showReactions"> <button class="_button" :class="$style.reactionDetailsButton" @click="showReactions">
@ -718,7 +718,7 @@ function showReactions(): void {
.cw { .cw {
cursor: default; cursor: default;
display: block; display: grid;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow-wrap: break-word; overflow-wrap: break-word;

6
packages/frontend/src/components/MkNoteDetailed.vue
View file

@ -34,6 +34,7 @@
<MkNoteSub v-if="appearNote.reply" :note="appearNote.reply" :class="$style.replyTo"/> <MkNoteSub v-if="appearNote.reply" :note="appearNote.reply" :class="$style.replyTo"/>
<article :class="$style.note" @contextmenu.stop="onContextmenu"> <article :class="$style.note" @contextmenu.stop="onContextmenu">
<header :class="$style.noteHeader"> <header :class="$style.noteHeader">
<div style="display: flex; align-items: center;">
<MkAvatar v-if="!defaultStore.state.hideAvatarsInNote" :class="$style.noteHeaderAvatar" :user="appearNote.user" indicator link preview/> <MkAvatar v-if="!defaultStore.state.hideAvatarsInNote" :class="$style.noteHeaderAvatar" :user="appearNote.user" indicator link preview/>
<div :class="$style.noteHeaderBody"> <div :class="$style.noteHeaderBody">
<div> <div>
@ -54,8 +55,13 @@
</div> </div>
</div> </div>
<div :class="$style.noteHeaderUsername"><MkAcct :user="appearNote.user"/></div> <div :class="$style.noteHeaderUsername"><MkAcct :user="appearNote.user"/></div>
</div>
</div>
<div style="display: flex; align-items: flex-end; margin-left: auto;">
<div :class="$style.noteHeaderBody">
<MkInstanceTicker v-if="showTicker" :instance="appearNote.user.instance"/> <MkInstanceTicker v-if="showTicker" :instance="appearNote.user.instance"/>
</div> </div>
</div>
</header> </header>
<div :class="$style.noteContent"> <div :class="$style.noteContent">
<p v-if="appearNote.cw != null" :class="$style.cw"> <p v-if="appearNote.cw != null" :class="$style.cw">

9
packages/frontend/src/components/MkNoteSimple.vue
View file

@ -1,9 +1,12 @@
<template> <template>
<div :class="$style.root"> <div :class="$style.root">
<div style="display: flex; padding-bottom: 10px;">
<MkAvatar v-if="!defaultStore.state.hideAvatarsInNote" :class="[$style.avatar, { [$style.showEl]: showEl && mainRouter.currentRoute.value.name === 'index', [$style.showElTab]: showEl && mainRouter.currentRoute.value.name !== 'index' }]" :user="note.user" link preview/> <MkAvatar v-if="!defaultStore.state.hideAvatarsInNote" :class="[$style.avatar, { [$style.showEl]: showEl && mainRouter.currentRoute.value.name === 'index', [$style.showElTab]: showEl && mainRouter.currentRoute.value.name !== 'index' }]" :user="note.user" link preview/>
<div :class="$style.main"> <div :class="$style.main">
<MkNoteHeader :class="$style.header" :note="note" :mini="true"/> <MkNoteHeader :class="$style.header" :note="note" :mini="true"/>
<div style="padding-top: 10px;"> </div>
</div>
<div>
<p v-if="note.cw != null" :class="$style.cw"> <p v-if="note.cw != null" :class="$style.cw">
<Mfm v-if="note.cw != ''" style="margin-right: 8px;" :text="note.cw" :author="note.user" :i="$i" :emojiUrls="note.emojis"/> <Mfm v-if="note.cw != ''" style="margin-right: 8px;" :text="note.cw" :author="note.user" :i="$i" :emojiUrls="note.emojis"/>
<MkCwButton v-model="showContent" :note="note"/> <MkCwButton v-model="showContent" :note="note"/>
@ -13,7 +16,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
@ -45,7 +47,6 @@ onMounted(() => {
<style lang="scss" module> <style lang="scss" module>
.root { .root {
display: flex;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow: clip; overflow: clip;
@ -75,7 +76,7 @@ onMounted(() => {
.cw { .cw {
cursor: default; cursor: default;
display: block; display: grid;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow-wrap: break-word; overflow-wrap: break-word;