Fix mobile height.

Add send button.
This commit is contained in:
Paul 2021-06-20 20:36:52 +01:00
parent 9e460c5b3d
commit a24bcf9f86
2 changed files with 17 additions and 10 deletions

View file

@ -8,7 +8,9 @@ import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
import { SingletonMessageRenderer, SMOOTH_SCROLL_ON_RECEIVE } from "../../../lib/renderer/Singleton"; import { SingletonMessageRenderer, SMOOTH_SCROLL_ON_RECEIVE } from "../../../lib/renderer/Singleton";
import { connectState } from "../../../redux/connector"; import { connectState } from "../../../redux/connector";
import { WithDispatcher } from "../../../redux/reducers"; import { WithDispatcher } from "../../../redux/reducers";
import IconButton from "../../ui/IconButton";
import TextArea from "../../ui/TextArea"; import TextArea from "../../ui/TextArea";
import { Send } from '@styled-icons/feather';
type Props = WithDispatcher & { type Props = WithDispatcher & {
channel: Channel; channel: Channel;
@ -70,15 +72,20 @@ function MessageBox({ channel, draft, dispatcher }: Props) {
} }
return ( return (
<TextArea <div style={{ display: 'flex' }}>
value={draft} <TextArea
onKeyDown={e => { value={draft}
if (!e.shiftKey && e.key === "Enter" && !isTouchscreenDevice) { onKeyDown={e => {
e.preventDefault(); if (!e.shiftKey && e.key === "Enter" && !isTouchscreenDevice) {
return send(); e.preventDefault();
} return send();
}} }
onChange={e => setMessage(e.currentTarget.value)} /> }}
onChange={e => setMessage(e.currentTarget.value)} />
<IconButton onClick={send}>
<Send size={20} />
</IconButton>
</div>
) )
} }

View file

@ -29,7 +29,7 @@ export default function App() {
return ( return (
<OverlappingPanels <OverlappingPanels
width="100vw" width="100vw"
height="100%" height="100vh"
leftPanel={{ width: 292, component: <LeftSidebar /> }} leftPanel={{ width: 292, component: <LeftSidebar /> }}
rightPanel={{ width: 240, component: <RightSidebar /> }} rightPanel={{ width: 240, component: <RightSidebar /> }}
docked={isTouchscreenDevice ? Docked.None : Docked.Left}> docked={isTouchscreenDevice ? Docked.None : Docked.Left}>