diff options
| author | Hazelnoot <acomputerdog@gmail.com> | 2025-06-04 14:51:49 -0400 |
|---|---|---|
| committer | Hazelnoot <acomputerdog@gmail.com> | 2025-06-04 19:07:57 -0400 |
| commit | 4d024d116509564d7a7424aaee773c9256529b87 (patch) | |
| tree | c22455e4b82074bd751b0f65d12e6bd948012117 /packages/frontend/src/components/MkNoteDetailed.vue | |
| parent | merge: Add option to keep CWs with "RE:" prefix (!1093) (diff) | |
| download | sharkey-4d024d116509564d7a7424aaee773c9256529b87.tar.gz sharkey-4d024d116509564d7a7424aaee773c9256529b87.tar.bz2 sharkey-4d024d116509564d7a7424aaee773c9256529b87.zip | |
use responsive gaps between note toolbar items
Diffstat (limited to 'packages/frontend/src/components/MkNoteDetailed.vue')
| -rw-r--r-- | packages/frontend/src/components/MkNoteDetailed.vue | 32 |
1 files changed, 7 insertions, 25 deletions
diff --git a/packages/frontend/src/components/MkNoteDetailed.vue b/packages/frontend/src/components/MkNoteDetailed.vue index b2f237a82e..4a8c51402c 100644 --- a/packages/frontend/src/components/MkNoteDetailed.vue +++ b/packages/frontend/src/components/MkNoteDetailed.vue @@ -118,7 +118,7 @@ SPDX-License-Identifier: AGPL-3.0-only </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> </div> - <footer :class="$style.footer"> + <footer :class="$style.footer" class="_gaps _h_gaps"> <div :class="$style.noteFooterInfo"> <div v-if="appearNote.updatedAt"> {{ i18n.ts.edited }}: <MkTime :time="appearNote.updatedAt" mode="detail"/> @@ -886,12 +886,12 @@ function animatedMFM() { } .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; } .replyTo { @@ -1083,10 +1083,6 @@ function animatedMFM() { padding: 8px; opacity: 0.7; - &:not(:last-child) { - margin-right: 1.5em; - } - &:hover { color: var(--MI_THEME-fgHighlighted); } @@ -1169,14 +1165,6 @@ function animatedMFM() { } } -@container (max-width: 350px) { - .noteFooterButton { - &:not(:last-child) { - margin-right: 0.1em; - } - } -} - @container (max-width: 300px) { .root { font-size: 0.825em; @@ -1186,12 +1174,6 @@ function animatedMFM() { width: 50px; height: 50px; } - - .noteFooterButton { - &:not(:last-child) { - margin-right: 0.1em; - } - } } .muted { |