misty.cafe/mistykey
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

use responsive gaps between note toolbar items

Browse source
This commit is contained in:
Hazelnoot 2025-06-04 14:51:49 -04:00
parent dc35731589
commit 4d024d1165
8 changed files with 27 additions and 151 deletions
Download patch file Download diff file Expand all files Collapse all files

26
packages/frontend/src/components/MkNoteSub.vue
View file

@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkSubNoteContent :class="$style.text" :note="note" :translating="translating" :translation="translation" :expandAllCws="props.expandAllCws"/>
</div>
</div>
<footer :class="$style.footer">
<footer :class="$style.footer" class="_gaps _h_gaps">
<MkReactionsViewer ref="reactionsViewer" :note="note"/>
<button class="_button" :class="$style.noteFooterButton" @click="reply()">
<i class="ph-arrow-u-up-left ph-bold ph-lg"></i>
@ -419,12 +419,12 @@ if (props.detail) {
}
.footer {
position: relative;
z-index: 1;
margin-top: 0.4em;
width: max-content;
min-width: min-content;
max-width: fit-content;
position: relative;
z-index: 1;
margin-top: 0.4em;
width: max-content;
min-width: min-content;
max-width: fit-content;
}
.main {
@ -469,23 +469,11 @@ if (props.detail) {
padding-top: 10px;
opacity: 0.7;
&:not(:last-child) {
margin-right: 1.5em;
}
&:hover {
color: var(--MI_THEME-fgHighlighted);
}
}
@container (max-width: 400px) {
.noteFooterButton {
&:not(:last-child) {
margin-right: 0.7em;
}
}
}
.noteFooterButtonCount {
display: inline;
margin: 0 0 0 8px;