mirror/cherrypick
1
1
Fork 0
mirror of https://github.com/kokonect-link/cherrypick synced 2024-12-01 00:08:31 +09:00
Code

tweak 63afde0b

Browse Source
This commit is contained in:
NoriDev 2023-06-16 20:28:02 +09:00
parent fbd5122b34
commit 2d15ed6667
2 changed files with 16 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/frontend/src/components/MkNote.vue
View File

@ -102,13 +102,14 @@
</template> </template>
</MkReactionsViewer> </MkReactionsViewer>
<footer :class="$style.footer"> <footer :class="$style.footer">
<button :class="$style.footerButton" class="_button" @click="reply()"> <button v-tooltip="i18n.ts.reply" :class="$style.footerButton" class="_button" @click="reply()">
<i class="ti ti-arrow-back-up"></i> <i class="ti ti-arrow-back-up"></i>
<p v-if="appearNote.repliesCount > 0" :class="$style.footerButtonCount">{{ appearNote.repliesCount }}</p> <p v-if="appearNote.repliesCount > 0" :class="$style.footerButtonCount">{{ appearNote.repliesCount }}</p>
</button> </button>
<button <button
v-if="canRenote" v-if="canRenote"
ref="renoteButton" ref="renoteButton"
v-tooltip="i18n.ts.renote"
:class="$style.footerButton" :class="$style.footerButton"
class="_button" class="_button"
@mousedown="renote()" @mousedown="renote()"
@ -119,20 +120,20 @@
<button v-else :class="$style.footerButton" class="_button" disabled> <button v-else :class="$style.footerButton" class="_button" disabled>
<i class="ti ti-ban"></i> <i class="ti ti-ban"></i>
</button> </button>
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.footerButton" class="_button" @mousedown="react()"> <button v-if="appearNote.myReaction == null" ref="reactButton" v-tooltip="i18n.ts.reaction" :class="$style.footerButton" class="_button" @mousedown="react()">
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ti ti-heart"></i> <i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ti ti-heart"></i>
<i v-else class="ti ti-plus"></i> <i v-else class="ti ti-plus"></i>
</button> </button>
<button v-if="appearNote.myReaction != null" ref="reactButton" :class="$style.footerButton" class="_button" @click="undoReact(appearNote)"> <button v-if="appearNote.myReaction != null" ref="reactButton" :class="$style.footerButton" class="_button" @click="undoReact(appearNote)">
<i class="ti ti-minus"></i> <i class="ti ti-minus"></i>
</button> </button>
<button v-if="defaultStore.state.showClipButtonInNoteFooter" ref="clipButton" :class="$style.footerButton" class="_button" @mousedown="clip()"> <button v-if="defaultStore.state.showClipButtonInNoteFooter" ref="clipButton" v-tooltip="i18n.ts.clip" :class="$style.footerButton" class="_button" @mousedown="clip()">
<i class="ti ti-paperclip"></i> <i class="ti ti-paperclip"></i>
</button> </button>
<MkA v-if="defaultStore.state.infoButtonForNoteActionsEnabled && defaultStore.state.showNoteActionsOnlyHover" :to="notePage(note)" :class="$style.footerButton" style="text-decoration: none;" class="_button"> <MkA v-if="defaultStore.state.infoButtonForNoteActionsEnabled && defaultStore.state.showNoteActionsOnlyHover" v-tooltip="i18n.ts.details" :to="notePage(note)" :class="$style.footerButton" style="text-decoration: none;" class="_button">
<i class="ti ti-info-circle"></i> <i class="ti ti-info-circle"></i>
</MkA> </MkA>
<button ref="menuButton" :class="$style.footerButton" class="_button" @mousedown="menu()"> <button ref="menuButton" v-tooltip="i18n.ts.more" :class="$style.footerButton" class="_button" @mousedown="menu()">
<i class="ti ti-dots"></i> <i class="ti ti-dots"></i>
</button> </button>
</footer> </footer>
@ -816,7 +817,7 @@ function showReactions(): void {
} }
.footer { .footer {
margin-bottom: -14px; margin: 7px 0 -14px;
} }
.footerButton { .footerButton {
@ -825,7 +826,7 @@ function showReactions(): void {
opacity: 0.7; opacity: 0.7;
&:not(:last-child) { &:not(:last-child) {
margin-right: 28px; margin-right: 10px;
} }
&:hover { &:hover {

27
packages/frontend/src/components/MkNoteDetailed.vue
View File

@ -113,13 +113,14 @@
</MkA> </MkA>
</div> </div>
<MkReactionsViewer ref="reactionsViewer" :note="appearNote"/> <MkReactionsViewer ref="reactionsViewer" :note="appearNote"/>
<button class="_button" :class="$style.noteFooterButton" @click="reply()"> <button v-tooltip="i18n.ts.reply" class="_button" :class="$style.noteFooterButton" @click="reply()">
<i class="ti ti-arrow-back-up"></i> <i class="ti ti-arrow-back-up"></i>
<p v-if="appearNote.repliesCount > 0" :class="$style.noteFooterButtonCount">{{ appearNote.repliesCount }}</p> <p v-if="appearNote.repliesCount > 0" :class="$style.noteFooterButtonCount">{{ appearNote.repliesCount }}</p>
</button> </button>
<button <button
v-if="canRenote" v-if="canRenote"
ref="renoteButton" ref="renoteButton"
v-tooltip="i18n.ts.renote"
class="_button" class="_button"
:class="$style.noteFooterButton" :class="$style.noteFooterButton"
@mousedown="renote()" @mousedown="renote()"
@ -130,17 +131,17 @@
<button v-else class="_button" :class="$style.noteFooterButton" disabled> <button v-else class="_button" :class="$style.noteFooterButton" disabled>
<i class="ti ti-ban"></i> <i class="ti ti-ban"></i>
</button> </button>
<button v-if="appearNote.myReaction == null" ref="reactButton" :class="$style.noteFooterButton" class="_button" @mousedown="react()"> <button v-if="appearNote.myReaction == null" ref="reactButton" v-tooltip="i18n.ts.reaction" :class="$style.noteFooterButton" class="_button" @mousedown="react()">
<i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ti ti-heart"></i> <i v-if="appearNote.reactionAcceptance === 'likeOnly'" class="ti ti-heart"></i>
<i v-else class="ti ti-plus"></i> <i v-else class="ti ti-plus"></i>
</button> </button>
<button v-if="appearNote.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(appearNote)"> <button v-if="appearNote.myReaction != null" ref="reactButton" class="_button" :class="[$style.noteFooterButton, $style.reacted]" @click="undoReact(appearNote)">
<i class="ti ti-minus"></i> <i class="ti ti-minus"></i>
</button> </button>
<button v-if="defaultStore.state.showClipButtonInNoteFooter" ref="clipButton" class="_button" :class="$style.noteFooterButton" @mousedown="clip()"> <button v-if="defaultStore.state.showClipButtonInNoteFooter" ref="clipButton" v-tooltip="i18n.ts.clip" class="_button" :class="$style.noteFooterButton" @mousedown="clip()">
<i class="ti ti-paperclip"></i> <i class="ti ti-paperclip"></i>
</button> </button>
<button ref="menuButton" class="_button" :class="$style.noteFooterButton" @mousedown="menu()"> <button ref="menuButton" v-tooltip="i18n.ts.more" class="_button" :class="$style.noteFooterButton" @mousedown="menu()">
<i class="ti ti-dots"></i> <i class="ti ti-dots"></i>
</button> </button>
</footer> </footer>
@ -640,7 +641,7 @@ if (appearNote.replyId) {
} }
.noteFooterInfo { .noteFooterInfo {
margin: 16px 0; margin: 16px 0 4px;
opacity: 0.7; opacity: 0.7;
font-size: 0.9em; font-size: 0.9em;
} }
@ -651,7 +652,7 @@ if (appearNote.replyId) {
opacity: 0.7; opacity: 0.7;
&:not(:last-child) { &:not(:last-child) {
margin-right: 28px; margin-right: 10px;
} }
&:hover { &:hover {
@ -706,14 +707,6 @@ if (appearNote.replyId) {
} }
} }
@container (max-width: 350px) {
.noteFooterButton {
&:not(:last-child) {
margin-right: 18px;
}
}
}
@container (max-width: 300px) { @container (max-width: 300px) {
.root { .root {
font-size: 0.825em; font-size: 0.825em;
@ -723,12 +716,6 @@ if (appearNote.replyId) {
width: 50px; width: 50px;
height: 50px; height: 50px;
} }
.noteFooterButton {
&:not(:last-child) {
margin-right: 12px;
}
}
} }
.muted { .muted {