Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 8 additions & 4 deletions modelina-website/src/components/CodeBlock.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import Highlight from 'react-syntax-highlighter';

import Caption from './Caption';
import IconClipboard from './icons/Clipboard';
import IconCheck from './icons/IconCheck';

const theme = {
hljs: {
Expand Down Expand Up @@ -270,10 +271,13 @@ export default function CodeBlock({
className='absolute right-2 top-1 z-50 cursor-pointer bg-code-editor-dark text-xs text-gray-500 hover:text-gray-300 focus:outline-none'
title='Copy to clipboard'
>
{showIsCopied && <span className='mr-2 inline-block pl-2 pt-1'>Copied!</span>}
<span className='inline-block pt-1'>
<IconClipboard className='-mt-0.5 inline-block size-4' />
</span>
<span>
{showIsCopied ? (
<IconCheck className='mt-2 mr-1 inline-block size-4' />
) : (
<IconClipboard className='mt-2 mr-1 inline-block size-4' />
)}
</span>
</button>
</div>
)}
Expand Down
21 changes: 21 additions & 0 deletions modelina-website/src/components/icons/IconCheck.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
export default function IconCheck({ className }: any) {
return (
<svg
className={className || 'inline-block'}
fill='currentColor'
viewBox='0 0 22 22'

>
<circle cx='12' cy='12' r='10' className='text-gray-500' />
<path
d='M7 12l3 3 7-7'
fill='none'
stroke='#252f3f'
strokeWidth='2'
strokeLinecap='round'
strokeLinejoin='round'
/>
</svg>
);
}

Loading