fix: MFM overflowing out of note

Closes transfem-org/Sharkey#104
This commit is contained in:
Mar0xy 2023-10-22 22:48:49 +02:00
parent 6d290225ef
commit 13c5da63d7
No known key found for this signature in database
GPG key ID: 56569BBE47D2C828
5 changed files with 14 additions and 1 deletions

View file

@ -903,6 +903,7 @@ function readPromo() {
.text {
overflow-wrap: break-word;
overflow: hidden;
}
.replyIcon {

View file

@ -760,6 +760,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
.note {
padding: 32px;
font-size: 1.2em;
overflow: hidden;
&:hover > .main > .footer > .button {
opacity: 1;
@ -771,6 +772,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
position: relative;
margin-bottom: 16px;
align-items: center;
z-index: 2;
}
.noteHeaderAvatar {
@ -817,6 +819,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
.noteContent {
container-type: inline-size;
overflow-wrap: break-word;
z-index: 1;
}
.cw {

View file

@ -69,6 +69,7 @@ watch(() => props.expandAllCws, (expandAllCws) => {
.header {
margin-bottom: 2px;
z-index: 2;
}
.cw {
@ -77,12 +78,14 @@ watch(() => props.expandAllCws, (expandAllCws) => {
margin: 0;
padding: 0;
overflow-wrap: break-word;
overflow: hidden;
}
.text {
cursor: default;
margin: 0;
padding: 0;
overflow: hidden;
}
@container (min-width: 250px) {

View file

@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkAvatar :class="$style.avatar" :user="note.user" link preview/>
<div :class="$style.body">
<MkNoteHeader :class="$style.header" :note="note" :mini="true"/>
<div>
<div :class="$style.content">
<p v-if="note.cw != null" :class="$style.cw">
<Mfm v-if="note.cw != ''" style="margin-right: 8px;" :text="note.cw" :author="note.user" :i="$i"/>
<MkCwButton v-model="showContent" :note="note"/>
@ -436,6 +436,10 @@ if (props.detail) {
min-width: 0;
}
.content {
overflow: hidden;
}
.header {
margin-bottom: 2px;
}

View file

@ -164,6 +164,7 @@ const showTicker = (defaultStore.state.instanceTicker === 'always') || (defaultS
.note {
padding: 32px;
font-size: 1.2em;
overflow: hidden;
}
.noteHeader {
@ -171,6 +172,7 @@ const showTicker = (defaultStore.state.instanceTicker === 'always') || (defaultS
position: relative;
margin-bottom: 16px;
align-items: center;
z-index: 2;
}
.noteHeaderAvatar {