summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/MkNote.vue
diff options
context:
space:
mode:
authorHazelnoot <acomputerdog@gmail.com>2025-06-04 14:51:49 -0400
committerHazelnoot <acomputerdog@gmail.com>2025-06-04 19:07:57 -0400
commit4d024d116509564d7a7424aaee773c9256529b87 (patch)
treec22455e4b82074bd751b0f65d12e6bd948012117 /packages/frontend/src/components/MkNote.vue
parentmerge: Add option to keep CWs with "RE:" prefix (!1093) (diff)
downloadsharkey-4d024d116509564d7a7424aaee773c9256529b87.tar.gz
sharkey-4d024d116509564d7a7424aaee773c9256529b87.tar.bz2
sharkey-4d024d116509564d7a7424aaee773c9256529b87.zip
use responsive gaps between note toolbar items
Diffstat (limited to 'packages/frontend/src/components/MkNote.vue')
-rw-r--r--packages/frontend/src/components/MkNote.vue24
1 files changed, 1 insertions, 23 deletions
diff --git a/packages/frontend/src/components/MkNote.vue b/packages/frontend/src/components/MkNote.vue
index 34c33270bb..862dccd0d3 100644
--- a/packages/frontend/src/components/MkNote.vue
+++ b/packages/frontend/src/components/MkNote.vue
@@ -113,7 +113,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkA :to="`/notes/${appearNote.id}/reactions`" :class="[$style.reactionOmitted]">{{ i18n.ts.more }}</MkA>
</template>
</MkReactionsViewer>
- <footer :class="$style.footer">
+ <footer :class="$style.footer" class="_gaps _h_gaps">
<button :class="$style.footerButton" class="_button" @click.stop @click="reply()">
<i class="ti ti-arrow-back-up"></i>
<p v-if="appearNote.repliesCount > 0" :class="$style.footerButtonCount">{{ number(appearNote.repliesCount) }}</p>
@@ -1203,10 +1203,6 @@ function emitUpdReaction(emoji: string, delta: number) {
padding: 8px;
opacity: 0.7;
- &:not(:last-child) {
- margin-right: 1.5em;
- }
-
&:hover {
color: var(--MI_THEME-fgHighlighted);
}
@@ -1290,25 +1286,7 @@ function emitUpdReaction(emoji: string, delta: number) {
}
}
-@container (max-width: 400px) {
- .root:not(.showActionsOnlyHover) {
- .footerButton {
- &:not(:last-child) {
- margin-right: 0.2em;
- }
- }
- }
-}
-
@container (max-width: 350px) {
- .root:not(.showActionsOnlyHover) {
- .footerButton {
- &:not(:last-child) {
- margin-right: 0.1em;
- }
- }
- }
-
.colorBar {
top: 6px;
left: 6px;