studio/docs
Archived
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🎨(frontend) use blockquote tag for quote block

Browse Source 
Use the blockquote tag for quote block instead of
a paragraph tag.
This commit is contained in:
Anthony LC
2025-03-13 16:25:45 +01:00
committed by Anthony LC
parent 87960d3773
commit da02d3d756
1 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/QuoteBlock.tsx
View File

@@ -3,7 +3,7 @@ import { BlockTypeSelectItem, createReactBlockSpec } from '@blocknote/react';
import { TFunction } from 'i18next'; import { TFunction } from 'i18next';
import React from 'react'; import React from 'react';
import { Text } from '@/components'; import { Box, Text } from '@/components';
import { useCunninghamTheme } from '@/cunningham'; import { useCunninghamTheme } from '@/cunningham';
import { DocsBlockNoteEditor } from '../../types'; import { DocsBlockNoteEditor } from '../../types';
@@ -23,16 +23,17 @@ export const QuoteBlock = createReactBlockSpec(
const { colorsTokens } = useCunninghamTheme(); const { colorsTokens } = useCunninghamTheme();
return ( return (
<Text <Box
as="blockquote"
className="inline-content" className="inline-content"
$margin="0 0 1rem 0" $margin="0 0 1rem 0"
$padding="0.5rem 1rem" $padding="0.5rem 1rem"
$variation="600"
style={{ style={{
borderLeft: `4px solid ${colorsTokens()['greyscale-300']}`, borderLeft: `4px solid ${colorsTokens()['greyscale-300']}`,
fontStyle: 'italic', fontStyle: 'italic',
flexGrow: 1, flexGrow: 1,
}} }}
$color="var(--c--theme--colors--greyscale-500)"
ref={props.contentRef} ref={props.contentRef}
/> />
); );