dev

asyncapi · Jan 2, 2025 · d70217f · d70217f
1 parent 97b9a5f
commit d70217f
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 5 deletions.
diff --git a/modelina-website/src/components/CodeBlock.tsx b/modelina-website/src/components/CodeBlock.tsx
@@ -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: {
@@ -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>
         )}

diff --git a/modelina-website/src/components/icons/Clipboard.tsx b/modelina-website/src/components/icons/Clipboard.tsx
@@ -1,6 +1,6 @@
 export default function IconClipboard({ className }: any) {
   return (
-    <svg className={className || 'inline-block'} fill='currentColor' viewBox='0 0 20 20'>
+    <svg className={className || 'inline-block'} fill='currentColor' viewBox='0 0 20 20' >
       <path d='M15.6 2l-1.2 3H5.6L4.4 2C3.629 2 3 2.629 3 3.4v15.2c0 .77.629 1.4 1.399 1.4h11.2c.77 0 1.4-.631 1.4-1.4V3.4C17 2.629 16.369 2 15.6 2zm-2 2l.9-2h-2.181L11.6 0H8.4l-.72 2H5.5l.899 2H13.6z' />
     </svg>
   );

diff --git a/modelina-website/src/components/icons/IconCheck.tsx b/modelina-website/src/components/icons/IconCheck.tsx
@@ -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>
+    );
+  }
+