JSFiddle - React, Tailwind, and code Playground

by glennpierce

HTML

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   version="1.1"
   width="202"
   height="96"
   id="svg2">
   <style type="text/css">  
      @keyframes move {  
        from {  stroke-dashoffset: 0;  }  
        to   {  stroke-dashoffset: 96;  }  
      }  
      @-moz-keyframes move {  
        from {  stroke-dashoffset: 0;  }  
        to   {  stroke-dashoffset: 96;  }  
      }  
      @-webkit-keyframes move {  
        from {  stroke-dashoffset: 0;  }  
        to   {  stroke-dashoffset: 96;  }  
      }  
  </style>  
 
  <g id="layer2">
    <path
       d="m 1,80 200,0"
       id="path21"
       style="stroke:#000000;stroke-width:30" />
    <path
       d="m 1,80 200,0"
       id="path22"
       style="stroke:#0000ff;stroke-width:20" />
    <path
       d="m 1,80 200,0"
       id="path23"
       style="stroke:#0044ff;stroke-width:20;stroke-dasharray:0, 12, 72, 13;
  animation-duration: 3s;  
  -moz-animation-duration: 3s;  
  -webkit-animation-duration: 3s;  
  animation-name: move; 
  -moz-animation-name: move; 
  -webkit-animation-name: move; 
  animation-timing-function: linear; 
  -moz-animation-timing-function: linear; 
  -webkit-animation-timing-function: linear; 
  animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;  " />
    <path
       d="m 1,80 200,0"
       id="path23"
       style="stroke:#0088ff;stroke-width:20;stroke-dasharray:0, 24, 48, 24;
  animation-duration: 3s;  
  -moz-animation-duration: 3s;  
  -webkit-animation-duration: 3s;  
  animation-name: move; 
  -moz-animation-name: move; 
  -webkit-animation-name: move; 
  animation-timing-function: linear; 
  -moz-animation-timing-function: linear; 
  -webkit-animation-timing-function: linear; 
  animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count:...