box-ui-elements-mlh
Version:
46 lines (42 loc) • 3.89 kB
Flow
// @flow
import * as React from 'react';
import classNames from 'classnames';
import AccessibleSVG from '../accessible-svg';
import { bdlBoxBlue, bdlBoxBlue40 } from '../../styles/variables';
type Props = {
className?: string,
height?: number,
primaryColor?: string,
secondaryColor?: string,
title?: string | React.Element<any>,
width?: number,
};
const SandboxesEmptyState = ({
className = '',
primaryColor = bdlBoxBlue40,
secondaryColor = bdlBoxBlue,
height = 85,
title,
width = 130,
}: Props) => (
<AccessibleSVG
className={classNames('bdl-SandboxesEmptyState', className)}
height={height}
title={title}
viewBox="0 0 130 85"
width={width}
>
<path
d="M77 6.634v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629A1.005 1.005 0 0 1 76.634 8h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm-75.5 53.5v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644A.5.5 0 0 1 4 61c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644A.5.5 0 0 1 2 63a.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366H.49A.5.5 0 0 1 0 61c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm126 15v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm-19-56.5v-.642a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644a.5.5 0 0 1 .49.5c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm-85-17.5V.492a.501.501 0 0 1 1-.002v.644c.152.088.278.214.366.366h.644A.5.5 0 0 1 26 2c0 .276-.215.5-.49.5h-.644a1.005 1.005 0 0 1-.366.366v.644A.5.5 0 0 1 24 4a.506.506 0 0 1-.5-.505v-.629a1.005 1.005 0 0 1-.366-.366h-.644A.5.5 0 0 1 22 2c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm-5.563 8.075v-.402a.313.313 0 0 1 .625 0v.402a.628.628 0 0 1 .23.229h.401c.17 0 .307.144.307.312a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.229.228v.402a.313.313 0 0 1-.625.004v-.406a.628.628 0 0 1-.228-.229h-.402A.313.313 0 0 1 17 9.75c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .229-.228zm-11.5 65v-.402a.313.313 0 0 1 .625 0v.402a.628.628 0 0 1 .23.228h.401c.17 0 .307.145.307.313a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.229.228v.402a.313.313 0 0 1-.625.004v-.406a.628.628 0 0 1-.228-.228h-.402a.313.313 0 0 1-.307-.313c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .229-.228zm107 8.5v-.402a.313.313 0 0 1 .626 0v.402a.628.628 0 0 1 .228.228h.402c.17 0 .307.145.307.313a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.228.228v.402a.313.313 0 0 1-.626.004v-.406a.628.628 0 0 1-.228-.228h-.402a.313.313 0 0 1-.307-.313c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .228-.228z"
fill={secondaryColor}
fillRule="evenodd"
/>
<path
d="M38 41.838V54.81c.73 3.646 2.768 3.998 4.941 3.446a7.27 7.27 0 0 1 5.6-2.635 7.297 7.297 0 0 1 0 14.594 7.27 7.27 0 0 1-5.6-2.635c-2.173-.552-4.212-.2-4.941 3.446V84h42.162V71.027c.73-3.646 2.768-3.998 4.941-3.446a7.27 7.27 0 0 0 5.6 2.635 7.297 7.297 0 0 0 0-14.594 7.27 7.27 0 0 0-5.6 2.635c-2.173.552-4.212.2-4.94-3.446V41.838H67.188c-3.646-.73-3.999-2.768-3.446-4.941a7.27 7.27 0 0 0 2.635-5.6 7.297 7.297 0 0 0-14.594 0 7.27 7.27 0 0 0 2.635 5.6c.553 2.173.2 4.212-3.446 4.94H38z"
fill="none"
stroke={primaryColor}
strokeWidth="2"
/>
</AccessibleSVG>
);
export default SandboxesEmptyState;