translation-waveform-audio
Version:
Waveform react audioplayer
28 lines (25 loc) • 3.16 kB
JSX
import React from 'react';
import PropTypes from 'prop-types';
import Button from './Button';
const ShuffleBtn = (props, context) => (
<Button {...props}>
<svg width="19px" height="14px" viewBox="138 23 19 14" version="1.1" xmlns="http://www.w3.org/2000/svg">
<g id="RandomBtn" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd" transform="translate(147.000000, 29.893617) scale(-1, 1) translate(-147.000000, -29.893617) translate(138.000000, 23.000000)">
<g id="Arrow-Top" transform="translate(9.000000, 6.148936) scale(-1, -1) translate(-9.000000, -6.148936) translate(0.000000, 0.212766)" fill={`${context.color}`}>
<rect id="Rectangle" x="5.74468085" y="8.75884498" width="8.42553191" height="1.64680858" />
<path d="M2.97165596,0.792575179 C2.80133561,0.258388343 3.07103657,0.0205747889 3.57244297,0.260634375 L3.86897867,0.402607507 C4.37110452,0.64301155 4.74637685,1.28459653 4.70589215,1.85362892 L4.03852507,11.2338014 L3.542177,10.9993707 C3.03253029,10.758659 2.67999589,10.1143427 2.75179077,9.56290502 C2.75179077,9.56290502 3.68618887,2.89872346 3.2562446,1.63927351 C2.82630033,0.37982355 2.97165596,0.792575179 2.97165596,0.792575179 Z" id="Rectangle-2" transform="translate(3.714344, 5.633966) rotate(-30.000000) translate(-3.714344, -5.633966)" />
<path d="M15.0557786,8.82263453 C15.5530161,7.99499578 16.3540793,7.98647683 16.8564349,8.82263453 L17.4018117,9.73039986 C17.8990492,10.5580386 17.5273405,11.2289724 16.5549875,11.2289724 L15.3572259,11.2289724 C14.3923003,11.2289724 14.0080462,10.5665576 14.5104018,9.73039986 L15.0557786,8.82263453 Z" id="Triangle" transform="translate(15.955987, 9.443198) rotate(90.000000) translate(-15.955987, -9.443198)" />
</g>
<g id="Arrow-Bottom" transform="translate(9.000000, 7.680851) scale(-1, 1) translate(-9.000000, -7.680851) translate(0.000000, 1.744681)" fill={`${context.color}`}>
<rect id="Rectangle" x="5.74468085" y="8.75884498" width="8.42553191" height="1.64680858" />
<path d="M2.97165596,0.792575179 C2.80133561,0.258388343 3.07103657,0.0205747889 3.57244297,0.260634375 L3.86897867,0.402607507 C4.37110452,0.64301155 4.74637685,1.28459653 4.70589215,1.85362892 L4.03852507,11.2338014 L3.542177,10.9993707 C3.03253029,10.758659 2.67999589,10.1143427 2.75179077,9.56290502 C2.75179077,9.56290502 3.68618887,2.89872346 3.2562446,1.63927351 C2.82630033,0.37982355 2.97165596,0.792575179 2.97165596,0.792575179 Z" id="Rectangle-2" transform="translate(3.714344, 5.633966) rotate(-30.000000) translate(-3.714344, -5.633966)" />
<path d="M15.0557786,8.82263453 C15.5530161,7.99499578 16.3540793,7.98647683 16.8564349,8.82263453 L17.4018117,9.73039986 C17.8990492,10.5580386 17.5273405,11.2289724 16.5549875,11.2289724 L15.3572259,11.2289724 C14.3923003,11.2289724 14.0080462,10.5665576 14.5104018,9.73039986 L15.0557786,8.82263453 Z" id="Triangle" transform="translate(15.955987, 9.443198) rotate(90.000000) translate(-15.955987, -9.443198)" />
</g>
</g>
</svg>
</Button>
);
ShuffleBtn.contextTypes = {
color: PropTypes.string
};
export default ShuffleBtn;