diff --git a/web/src/ui/MessageComposer.css b/web/src/ui/MessageComposer.css new file mode 100644 index 0000000..81d7972 --- /dev/null +++ b/web/src/ui/MessageComposer.css @@ -0,0 +1,18 @@ +div.message-composer { + display: flex; + border-top: 1px solid #ccc; + > textarea { + flex: 1; + resize: none; + font-family: sans-serif; + height: auto; + padding: .5rem; + border: none; + outline: none; + } + > button { + padding: .5rem; + border: none; + background: none; + } +} diff --git a/web/src/ui/MessageComposer.tsx b/web/src/ui/MessageComposer.tsx index fe2f95b..d4b813d 100644 --- a/web/src/ui/MessageComposer.tsx +++ b/web/src/ui/MessageComposer.tsx @@ -16,6 +16,7 @@ import React, { use, useCallback, useState } from "react" import { RoomStateStore } from "../api/statestore.ts" import { ClientContext } from "./ClientContext.ts" +import "./MessageComposer.css" interface MessageComposerProps { room: RoomStateStore @@ -30,16 +31,21 @@ const MessageComposer = ({ room }: MessageComposerProps) => { client.rpc.sendMessage(room.roomID, text) .catch(err => window.alert("Failed to send message: " + err)) }, [text, room, client]) - return
- +