obvious difference between bold, header1 and header 2 in comment of ticket
This commit is contained in:
parent
c21000e658
commit
6f1d35016c
|
|
@ -48,13 +48,6 @@ function CommentFormatToolbar({
|
||||||
</Button>
|
</Button>
|
||||||
</span>
|
</span>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Tooltip title={intl.formatMessage({ id: 'commentFormatH3', defaultMessage: 'Heading 3' })}>
|
|
||||||
<span>
|
|
||||||
<Button size="small" variant="outlined" sx={btnSx} onClick={handle('h3')} disabled={disabled}>
|
|
||||||
H3
|
|
||||||
</Button>
|
|
||||||
</span>
|
|
||||||
</Tooltip>
|
|
||||||
</Box>
|
</Box>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -341,7 +341,7 @@ function CommentThread({
|
||||||
<Typography variant="caption" color="text.disabled">
|
<Typography variant="caption" color="text.disabled">
|
||||||
<FormattedMessage
|
<FormattedMessage
|
||||||
id="commentMarkdownHint"
|
id="commentMarkdownHint"
|
||||||
defaultMessage="Markdown: **bold**, #, ##, ###"
|
defaultMessage="Markdown: **bold**, #, ##"
|
||||||
/>
|
/>
|
||||||
</Typography>
|
</Typography>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Box, Typography } from '@mui/material';
|
import { Box, Typography } from '@mui/material';
|
||||||
|
|
||||||
export type FormatKind = 'bold' | 'h1' | 'h2' | 'h3';
|
export type FormatKind = 'bold' | 'h1' | 'h2';
|
||||||
|
|
||||||
function renderInline(text: string): React.ReactNode[] {
|
function renderInline(text: string): React.ReactNode[] {
|
||||||
const parts = text.split(/\*\*(.+?)\*\*/g);
|
const parts = text.split(/\*\*(.+?)\*\*/g);
|
||||||
|
|
@ -15,30 +15,31 @@ export function renderCommentBody(body: string): JSX.Element {
|
||||||
return (
|
return (
|
||||||
<Box sx={{ '& > *': { mb: 0.5 } }}>
|
<Box sx={{ '& > *': { mb: 0.5 } }}>
|
||||||
{lines.map((line, idx) => {
|
{lines.map((line, idx) => {
|
||||||
if (line.startsWith('### ')) {
|
|
||||||
return (
|
|
||||||
<Typography key={idx} variant="subtitle1" sx={{ fontWeight: 600, mt: 1 }}>
|
|
||||||
{renderInline(line.slice(4))}
|
|
||||||
</Typography>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
if (line.startsWith('## ')) {
|
if (line.startsWith('## ')) {
|
||||||
return (
|
return (
|
||||||
<Typography key={idx} variant="h6" sx={{ mt: 1.5 }}>
|
<Typography
|
||||||
|
key={idx}
|
||||||
|
variant="h6"
|
||||||
|
sx={{ fontSize: '1.15rem', fontWeight: 700, mt: 1.25 }}
|
||||||
|
>
|
||||||
{renderInline(line.slice(3))}
|
{renderInline(line.slice(3))}
|
||||||
</Typography>
|
</Typography>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
if (line.startsWith('# ')) {
|
if (line.startsWith('# ')) {
|
||||||
return (
|
return (
|
||||||
<Typography key={idx} variant="h5" sx={{ mt: 2 }}>
|
<Typography
|
||||||
|
key={idx}
|
||||||
|
variant="h4"
|
||||||
|
sx={{ fontSize: '1.6rem', fontWeight: 700, mt: 2 }}
|
||||||
|
>
|
||||||
{renderInline(line.slice(2))}
|
{renderInline(line.slice(2))}
|
||||||
</Typography>
|
</Typography>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<Typography key={idx} variant="body2" sx={{ whiteSpace: 'pre-wrap' }}>
|
<Typography key={idx} variant="body2" sx={{ whiteSpace: 'pre-wrap' }}>
|
||||||
{line ? renderInline(line) : '\u00A0'}
|
{line ? renderInline(line) : ' '}
|
||||||
</Typography>
|
</Typography>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
|
@ -68,7 +69,7 @@ export function applyFormat(
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const prefix = kind === 'h1' ? '# ' : kind === 'h2' ? '## ' : '### ';
|
const prefix = kind === 'h1' ? '# ' : '## ';
|
||||||
const lineStart = value.lastIndexOf('\n', start - 1) + 1;
|
const lineStart = value.lastIndexOf('\n', start - 1) + 1;
|
||||||
const nlAfter = value.indexOf('\n', start);
|
const nlAfter = value.indexOf('\n', start);
|
||||||
const lineEnd = nlAfter === -1 ? value.length : nlAfter;
|
const lineEnd = nlAfter === -1 ? value.length : nlAfter;
|
||||||
|
|
|
||||||
|
|
@ -573,11 +573,10 @@
|
||||||
"comments": "Kommentare",
|
"comments": "Kommentare",
|
||||||
"noComments": "Noch keine Kommentare.",
|
"noComments": "Noch keine Kommentare.",
|
||||||
"commentEdited": "(bearbeitet {time})",
|
"commentEdited": "(bearbeitet {time})",
|
||||||
"commentMarkdownHint": "Markdown: **fett**, #, ##, ###",
|
"commentMarkdownHint": "Markdown: **fett**, #, ##",
|
||||||
"commentFormatBold": "Fett",
|
"commentFormatBold": "Fett",
|
||||||
"commentFormatH1": "Überschrift 1",
|
"commentFormatH1": "Überschrift 1",
|
||||||
"commentFormatH2": "Überschrift 2",
|
"commentFormatH2": "Überschrift 2",
|
||||||
"commentFormatH3": "Überschrift 3",
|
|
||||||
"addComment": "Hinzufügen",
|
"addComment": "Hinzufügen",
|
||||||
"timeline": "Zeitverlauf",
|
"timeline": "Zeitverlauf",
|
||||||
"noTimelineEvents": "Noch keine Ereignisse.",
|
"noTimelineEvents": "Noch keine Ereignisse.",
|
||||||
|
|
|
||||||
|
|
@ -321,11 +321,10 @@
|
||||||
"comments": "Comments",
|
"comments": "Comments",
|
||||||
"noComments": "No comments yet.",
|
"noComments": "No comments yet.",
|
||||||
"commentEdited": "(edited {time})",
|
"commentEdited": "(edited {time})",
|
||||||
"commentMarkdownHint": "Markdown: **bold**, #, ##, ###",
|
"commentMarkdownHint": "Markdown: **bold**, #, ##",
|
||||||
"commentFormatBold": "Bold",
|
"commentFormatBold": "Bold",
|
||||||
"commentFormatH1": "Heading 1",
|
"commentFormatH1": "Heading 1",
|
||||||
"commentFormatH2": "Heading 2",
|
"commentFormatH2": "Heading 2",
|
||||||
"commentFormatH3": "Heading 3",
|
|
||||||
"addComment": "Add",
|
"addComment": "Add",
|
||||||
"timeline": "Timeline",
|
"timeline": "Timeline",
|
||||||
"noTimelineEvents": "No events yet.",
|
"noTimelineEvents": "No events yet.",
|
||||||
|
|
|
||||||
|
|
@ -573,11 +573,10 @@
|
||||||
"comments": "Commentaires",
|
"comments": "Commentaires",
|
||||||
"noComments": "Aucun commentaire pour le moment.",
|
"noComments": "Aucun commentaire pour le moment.",
|
||||||
"commentEdited": "(modifié {time})",
|
"commentEdited": "(modifié {time})",
|
||||||
"commentMarkdownHint": "Markdown : **gras**, #, ##, ###",
|
"commentMarkdownHint": "Markdown : **gras**, #, ##",
|
||||||
"commentFormatBold": "Gras",
|
"commentFormatBold": "Gras",
|
||||||
"commentFormatH1": "Titre 1",
|
"commentFormatH1": "Titre 1",
|
||||||
"commentFormatH2": "Titre 2",
|
"commentFormatH2": "Titre 2",
|
||||||
"commentFormatH3": "Titre 3",
|
|
||||||
"addComment": "Ajouter",
|
"addComment": "Ajouter",
|
||||||
"timeline": "Chronologie",
|
"timeline": "Chronologie",
|
||||||
"noTimelineEvents": "Aucun événement pour le moment.",
|
"noTimelineEvents": "Aucun événement pour le moment.",
|
||||||
|
|
|
||||||
|
|
@ -573,11 +573,10 @@
|
||||||
"comments": "Commenti",
|
"comments": "Commenti",
|
||||||
"noComments": "Nessun commento ancora.",
|
"noComments": "Nessun commento ancora.",
|
||||||
"commentEdited": "(modificato {time})",
|
"commentEdited": "(modificato {time})",
|
||||||
"commentMarkdownHint": "Markdown: **grassetto**, #, ##, ###",
|
"commentMarkdownHint": "Markdown: **grassetto**, #, ##",
|
||||||
"commentFormatBold": "Grassetto",
|
"commentFormatBold": "Grassetto",
|
||||||
"commentFormatH1": "Titolo 1",
|
"commentFormatH1": "Titolo 1",
|
||||||
"commentFormatH2": "Titolo 2",
|
"commentFormatH2": "Titolo 2",
|
||||||
"commentFormatH3": "Titolo 3",
|
|
||||||
"addComment": "Aggiungi",
|
"addComment": "Aggiungi",
|
||||||
"timeline": "Cronologia",
|
"timeline": "Cronologia",
|
||||||
"noTimelineEvents": "Nessun evento ancora.",
|
"noTimelineEvents": "Nessun evento ancora.",
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue