use responsive gaps between note toolbar items

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

View file

@ -28,7 +28,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
</div>
<MkReactionsViewer ref="reactionsViewer" :note="note"/>
<footer :class="$style.footer">
<footer :class="$style.footer" class="_gaps _h_gaps">
<button class="_button" :class="$style.noteFooterButton" @click="reply()">
<i class="ph-arrow-u-up-left ph-bold ph-lg"></i>
<p v-if="note.repliesCount > 0" :class="$style.noteFooterButtonCount">{{ note.repliesCount }}</p>
@ -559,14 +559,6 @@ if (props.detail) {
}
}
@container (max-width: 400px) {
.noteFooterButton {
&:not(:last-child) {
margin-right: 0.7em;
}
}
}
.noteFooterButtonCount {
display: inline;
margin: 0 0 0 8px;