JSFiddle - React, Tailwind, and code Playground

by 규연 황

HTML

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 width="584px" height="851px" viewBox="0 0 584 851" enable-background="new 0 0 584 851" xml:space="preserve">
<g id="Layer_1_1_" display="none">
	
		<image display="inline" overflow="visible" enable-background="new    " width="585" height="852" xlink:href="75623D62.jpg"  transform="matrix(0.9987 0 0 0.9987 -0.1062 0.0732)">
	</image>
</g>
<g id="Layer_7">
	<rect x="3" y="2" fill="#97D8E9" width="584" height="851"/>
	<path fill="#5FC8D9" d="M587,514.432c0,0-151.943,76-167.964,83c0,0-82.02,26-152.02-11c0,0-145-73-164-50c0,0-27,21-39-4l-46-75
		c0,0-9.035-15-15.018-16V853h583.999V514.432H587z"/>
	<path fill="#FFFFFF" stroke="#FFFFFF" stroke-miterlimit="10" d="M470.018,117.432h83.5c0,0,2-18-19-15c0,0-17.5-33-39.5-5.5
		C495.018,96.932,467.518,94.932,470.018,117.432z"/>
	<path fill="#FFFFFF" d="M93.518,377.932h-48.5c0,0,0.5-10.5,12.5-10.5c0,0,14.5-16.5,25,0
		C82.518,367.432,95.018,370.432,93.518,377.932z"/>
	<path fill="#7FA653" d="M211.018,674.1L69.33,435.432c0,0-13.313-33-33.313,0l-148,238.668"/>
	<path fill="#749B48" d="M69.33,435.432c0,0-5.868-14.535-15.662-14.66L85.272,674.1h125.746L69.33,435.432z"/>
	<path fill="#7FA653" d="M648.296,674.1L547.304,503.984c0,0-9.488-23.522-23.744,0L418.069,674.1"/>
	<path fill="#749B48" d="M547.304,503.984c0,0-4.184-10.36-11.163-10.449L558.668,674.1h89.628L547.304,503.984z"/>
	<rect x="-1.896" y="663.396" fill="#A3CF5B" width="584" height="182.886"/>
</g>
<g id="truck">
	<g id="truck-body">
		<path fill="#F8CD1F"...