extract codepen embed as a component

notes/css-waving-hand-emoji.mdx

@@ -19,12 +19,7 @@ Below are the code snippets you can grab and customize to make your own ["waving
 
 ## Demo
 
-<IFrame
-  src="https://codepen.io/jakejarvis/embed/pBZWZw/?theme-id=light&amp;default-tab=css,result"
-  height={500}
-  allowScripts
-  noScroll
-/>
+<CodePen username="jakejarvis" id="pBZWZw" defaultTab="css" />
 
 ## CSS