Thomas des Francs
9477bb3677
## Summary - update AI chat message typography and list line-height for readability - apply richer markdown-section styling for headings, spacing, separators, and inline code - keep links non-underlined by default with underline on hover, using accent11 for link color - preserve previous AI chat table design while keeping other markdown improvements ## Validation - yarn eslint packages/twenty-front/src/modules/ai/components/LazyMarkdownRenderer.tsx packages/twenty-front/src/modules/ai/components/AIChatMessage.tsx --------- Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
40 lines
1.0 KiB
TypeScript
40 lines
1.0 KiB
TypeScript
import styled from '@emotion/styled';
|
|
import { useJsonTreeContextOrThrow } from '@ui/json-visualizer/hooks/useJsonTreeContextOrThrow';
|
|
import { type JsonNodeHighlighting } from '@ui/json-visualizer/types/JsonNodeHighlighting';
|
|
|
|
const StyledText = styled.span<{
|
|
highlighting: JsonNodeHighlighting | undefined;
|
|
}>`
|
|
align-items: center;
|
|
box-sizing: border-box;
|
|
color: ${({ theme, highlighting }) =>
|
|
highlighting === 'blue'
|
|
? theme.color.blue8
|
|
: highlighting === 'red'
|
|
? theme.color.red8
|
|
: theme.font.color.tertiary};
|
|
display: inline-flex;
|
|
height: 24px;
|
|
line-height: 1;
|
|
`;
|
|
|
|
export const JsonNodeValue = ({
|
|
valueAsString,
|
|
highlighting,
|
|
}: {
|
|
valueAsString: string;
|
|
highlighting?: JsonNodeHighlighting | undefined;
|
|
}) => {
|
|
const { onNodeValueClick } = useJsonTreeContextOrThrow();
|
|
|
|
const handleClick = () => {
|
|
onNodeValueClick?.(valueAsString);
|
|
};
|
|
|
|
return (
|
|
<StyledText highlighting={highlighting} onClick={handleClick}>
|
|
{valueAsString}
|
|
</StyledText>
|
|
);
|
|
};
|