cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-11-09 16:53:36 -05:00
Code Issues Projects Releases Packages Wiki Activity

Fix: Padding on message box.

Browse source 
Allow 20 max rows on message area.
This commit is contained in:
Paul 2021-07-05 21:07:04 +01:00
parent c246c2b77a
commit b8a4ada30c
1 changed files with 61 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

115
src/components/common/messaging/MessageBox.tsx
View file

@ -61,13 +61,18 @@ export type UploadState =
const Base = styled.div`
display: flex;
/*padding: 0 12px;*/
align-items: flex-start;
background: var(--message-box);
textarea {
font-size: 0.875rem;
background: transparent;
}
.textarea {
flex-grow: 1;
padding: 12px 0;
}
`;
const Blocked = styled.div`
@ -419,62 +424,64 @@ function MessageBox({ channel, draft }: Props) {
/>
</Action>
) : undefined}
<TextAreaAutoSize
autoFocus
hideBorder
maxRows={5}
padding={14}
id="message"
value={draft ?? ""}
onKeyUp={onKeyUp}
onKeyDown={(e) => {
if (onKeyDown(e)) return;
<div class="textarea">
<TextAreaAutoSize
autoFocus
hideBorder
maxRows={20}
padding={0}
id="message"
value={draft ?? ""}
onKeyUp={onKeyUp}
onKeyDown={(e) => {
if (onKeyDown(e)) return;
if (
e.key === "ArrowUp" &&
(!draft || draft.length === 0)
) {
e.preventDefault();
internalEmit("MessageRenderer", "edit_last");
return;
if (
e.key === "ArrowUp" &&
(!draft || draft.length === 0)
) {
e.preventDefault();
internalEmit("MessageRenderer", "edit_last");
return;
}
if (
!e.shiftKey &&
e.key === "Enter" &&
!isTouchscreenDevice
) {
e.preventDefault();
return send();
}
debouncedStopTyping(true);
}}
placeholder={
channel.channel_type === "DirectMessage"
? translate("app.main.channel.message_who", {
person: client.users.get(
client.channels.getRecipient(channel._id),
)?.username,
})
: channel.channel_type === "SavedMessages"
? translate("app.main.channel.message_saved")
: translate("app.main.channel.message_where", {
channel_name: channel.name,
})
}
if (
!e.shiftKey &&
e.key === "Enter" &&
!isTouchscreenDevice
) {
e.preventDefault();
return send();
disabled={
uploadState.type === "uploading" ||
uploadState.type === "sending"
}
debouncedStopTyping(true);
}}
placeholder={
channel.channel_type === "DirectMessage"
? translate("app.main.channel.message_who", {
person: client.users.get(
client.channels.getRecipient(channel._id),
)?.username,
})
: channel.channel_type === "SavedMessages"
? translate("app.main.channel.message_saved")
: translate("app.main.channel.message_where", {
channel_name: channel.name,
})
}
disabled={
uploadState.type === "uploading" ||
uploadState.type === "sending"
}
onChange={(e) => {
setMessage(e.currentTarget.value);
startTyping();
onChange(e);
}}
onFocus={onFocus}
onBlur={onBlur}
/>
onChange={(e) => {
setMessage(e.currentTarget.value);
startTyping();
onChange(e);
}}
onFocus={onFocus}
onBlur={onBlur}
/>
</div>
{isTouchscreenDevice && (
<Action>
<IconButton onClick={send}>