diff --git a/.changeset/shiny-eagles-hang.md b/.changeset/shiny-eagles-hang.md new file mode 100644 index 00000000..d3f353a8 --- /dev/null +++ b/.changeset/shiny-eagles-hang.md @@ -0,0 +1,5 @@ +--- +'@cube-dev/ui-kit': patch +--- + +Update border radius size for Card and CopySnippet components. diff --git a/src/components/content/Card/Card.tsx b/src/components/content/Card/Card.tsx index f7ea0d7f..8ab689c4 100644 --- a/src/components/content/Card/Card.tsx +++ b/src/components/content/Card/Card.tsx @@ -14,7 +14,7 @@ const CardElement = tasty({ styles: { display: 'block', flow: 'column', - radius: '1r', + radius: '(@large-radius + 1bw)', fill: '#white', border: true, padding: '1.5x', diff --git a/src/components/content/CopySnippet/CopySnippet.tsx b/src/components/content/CopySnippet/CopySnippet.tsx index 93f1dc12..a2d0f561 100644 --- a/src/components/content/CopySnippet/CopySnippet.tsx +++ b/src/components/content/CopySnippet/CopySnippet.tsx @@ -73,7 +73,7 @@ const CopySnippetElement = tasty(Card, { styles: { display: 'block', fill: '#grey-light', - radius: '1r', + radius: '@large-radius', border: 0, padding: 0, @@ -82,7 +82,7 @@ const CopySnippetElement = tasty(Card, { flow: 'row', gridColumns: 'minmax(0, 1fr) auto', width: 'min 20x', - radius: '1r', + radius: '@large-radius', position: 'relative', overflow: 'hidden', }, @@ -151,6 +151,10 @@ export interface CubeCopySnippetProps extends CubeCardProps { // const HIDDEN_SYMBOL = '●'; const HIDDEN_SYMBOL = '•'; +function replaceSymbolsToHidden(str: string) { + return HIDDEN_SYMBOL.repeat(str.length); +} + function CopySnippet(allProps: CubeCopySnippetProps) { const { code = '', @@ -190,29 +194,17 @@ function CopySnippet(allProps: CubeCopySnippetProps) { if (!showHidden) { if (hideText === true) { - formattedCode = formattedCode - .split('') - .map((s) => HIDDEN_SYMBOL) - .join('') - .trim(); + formattedCode = replaceSymbolsToHidden(formattedCode); } else if (typeof hideText === 'string') { formattedCode = formattedCode.replaceAll( hideText, - hideText - .split('') - .map((s) => HIDDEN_SYMBOL) - .join('') - .trim(), + replaceSymbolsToHidden(hideText), ); } else if (Array.isArray(hideText)) { hideText.forEach((text) => { formattedCode = formattedCode.replaceAll( text, - text - .split('') - .map((s) => HIDDEN_SYMBOL) - .join('') - .trim(), + replaceSymbolsToHidden(text), ); }); }