aboutsummaryrefslogtreecommitdiffstats
path: root/webui/src/components/CommentInput/CommentInput.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'webui/src/components/CommentInput/CommentInput.tsx')
-rw-r--r--webui/src/components/CommentInput/CommentInput.tsx20
1 files changed, 18 insertions, 2 deletions
diff --git a/webui/src/components/CommentInput/CommentInput.tsx b/webui/src/components/CommentInput/CommentInput.tsx
index f12ee8d8..babd495c 100644
--- a/webui/src/components/CommentInput/CommentInput.tsx
+++ b/webui/src/components/CommentInput/CommentInput.tsx
@@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
+import { Typography } from '@material-ui/core';
import Tab from '@material-ui/core/Tab';
import Tabs from '@material-ui/core/Tabs';
import TextField from '@material-ui/core/TextField';
@@ -15,14 +16,23 @@ const useStyles = makeStyles((theme) => ({
margin: theme.spacing(2, 0),
padding: theme.spacing(0, 2, 2, 2),
},
- textarea: {},
+ textarea: {
+ '& textarea.MuiInputBase-input': {
+ resize: 'vertical',
+ },
+ },
tabContent: {
margin: theme.spacing(2, 0),
},
preview: {
+ overflow: 'auto',
borderBottom: `solid 3px ${theme.palette.grey['200']}`,
minHeight: '5rem',
},
+ previewPlaceholder: {
+ color: theme.palette.text.secondary,
+ fontStyle: 'italic',
+ },
}));
type TabPanelProps = {
@@ -98,7 +108,13 @@ function CommentInput({ inputProps, inputText, loading, onChange }: Props) {
/>
</TabPanel>
<TabPanel value={tab} index={1} className={classes.preview}>
- <Content markdown={input} />
+ {input !== '' ? (
+ <Content markdown={input} />
+ ) : (
+ <Typography className={classes.previewPlaceholder}>
+ Nothing to preview.
+ </Typography>
+ )}
</TabPanel>
</div>
</div>