mirror of
https://github.com/tulir/gomuks.git
synced 2025-04-20 10:33:41 -05:00
web/timeline/reply: make it more compact on a single line
Signed-off-by: Sumner Evans <sumner.evans@automattic.com>
This commit is contained in:
parent
0b1d5cd354
commit
5acab4bdab
2 changed files with 41 additions and 37 deletions
|
@ -2,6 +2,8 @@ blockquote.reply-body {
|
||||||
margin: 0 0 .25rem;
|
margin: 0 0 .25rem;
|
||||||
border-left: 2px solid var(--blockquote-border-color);
|
border-left: 2px solid var(--blockquote-border-color);
|
||||||
padding: .25rem .5rem;
|
padding: .25rem .5rem;
|
||||||
|
display: flex;
|
||||||
|
gap: .5rem;
|
||||||
|
|
||||||
&.sender-color-0 { border-color: var(--sender-color-0); }
|
&.sender-color-0 { border-color: var(--sender-color-0); }
|
||||||
&.sender-color-1 { border-color: var(--sender-color-1); }
|
&.sender-color-1 { border-color: var(--sender-color-1); }
|
||||||
|
@ -34,9 +36,11 @@ blockquote.reply-body {
|
||||||
|
|
||||||
> div.message-text {
|
> div.message-text {
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
-webkit-line-clamp: 2;
|
-webkit-line-clamp: 1;
|
||||||
|
line-clamp: 1;
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
flex-grow: 1;
|
||||||
color: var(--semisecondary-text-color);
|
color: var(--semisecondary-text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -61,6 +65,7 @@ blockquote.reply-body {
|
||||||
height: 1rem;
|
height: 1rem;
|
||||||
margin-right: .25rem;
|
margin-right: .25rem;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
> div.buttons {
|
> div.buttons {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
|
@ -79,5 +84,4 @@ blockquote.reply-body {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -111,6 +111,10 @@ export const ReplyBody = ({
|
||||||
<span className={`event-sender sender-color-${userColorIndex}`}>
|
<span className={`event-sender sender-color-${userColorIndex}`}>
|
||||||
{getDisplayname(event.sender, memberEvtContent)}
|
{getDisplayname(event.sender, memberEvtContent)}
|
||||||
</span>
|
</span>
|
||||||
|
</div>
|
||||||
|
<ContentErrorBoundary>
|
||||||
|
<BodyType room={room} event={event} sender={memberEvt}/>
|
||||||
|
</ContentErrorBoundary>
|
||||||
{onClose && <div className="buttons">
|
{onClose && <div className="buttons">
|
||||||
{onSetSilent && (isExplicitInThread || !isThread) && <TooltipButton
|
{onSetSilent && (isExplicitInThread || !isThread) && <TooltipButton
|
||||||
tooltipText={isSilent
|
tooltipText={isSilent
|
||||||
|
@ -134,9 +138,5 @@ export const ReplyBody = ({
|
||||||
</TooltipButton>}
|
</TooltipButton>}
|
||||||
{onClose && <button className="close-reply" onClick={onClose}><CloseIcon/></button>}
|
{onClose && <button className="close-reply" onClick={onClose}><CloseIcon/></button>}
|
||||||
</div>}
|
</div>}
|
||||||
</div>
|
|
||||||
<ContentErrorBoundary>
|
|
||||||
<BodyType room={room} event={event} sender={memberEvt}/>
|
|
||||||
</ContentErrorBoundary>
|
|
||||||
</blockquote>
|
</blockquote>
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue