UNPKG

box-ui-elements-mlh

Version:
108 lines (103 loc) 8.01 kB
// @flow import * as React from 'react'; import AccessibleSVG from '../accessible-svg'; import { bdlBoxBlue } from '../../styles/variables'; import type { Icon } from '../flowTypes'; const IconMobileApp = ({ className = '', color = bdlBoxBlue, height = 155, title, width = 150 }: Icon) => ( <AccessibleSVG className={`icon-mobile-app ${className}`} height={height} title={title} viewBox="0 0 150 155" width={width} > <g fill="none" fillRule="evenodd"> <path className="fill-color" d="M101 2.134v-.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.004 1.004 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49c-.276 0-.5-.23-.5-.505v-.63a.993.993 0 0 1-.366-.365h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm-90.5 83.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.004 1.004 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49c-.276 0-.5-.23-.5-.505v-.63a.993.993 0 0 1-.366-.365H9.49a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm136 5.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.004 1.004 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49c-.276 0-.5-.23-.5-.505v-.63a.993.993 0 0 1-.366-.365h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm-29-78v-.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.004 1.004 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49c-.276 0-.5-.23-.5-.505v-.63a.993.993 0 0 1-.366-.365h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm-74 13.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.004 1.004 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49c-.276 0-.5-.23-.5-.505v-.63a.993.993 0 0 1-.366-.365h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm3 111.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.004 1.004 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49c-.276 0-.5-.23-.5-.505v-.63a.993.993 0 0 1-.366-.365h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zm20.938-13.925v-.403c0-.17.144-.307.312-.307.173 0 .313.134.313.307v.402a.623.623 0 0 1 .228.228h.403c.17 0 .307.144.307.312a.308.308 0 0 1-.307.313h-.402a.623.623 0 0 1-.228.228v.403c0 .17-.144.307-.312.307a.314.314 0 0 1-.313-.303v-.406a.623.623 0 0 1-.228-.228h-.403a.312.312 0 0 1-.307-.312c0-.173.134-.313.307-.313h.402a.623.623 0 0 1 .228-.228zm69.062-5.576v-.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.004 1.004 0 0 1-.366.366v.644a.5.5 0 0 1-.5.49c-.276 0-.5-.23-.5-.505v-.63a.993.993 0 0 1-.366-.365h-.644a.5.5 0 0 1-.49-.5c0-.276.215-.5.49-.5h.644c.088-.152.214-.278.366-.366zM37.937 34.71v-.403c0-.17.145-.307.313-.307.173 0 .313.134.313.307v.402a.628.628 0 0 1 .228.227h.403c.17 0 .307.145.307.313a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.227.228v.403a.313.313 0 0 1-.626.004v-.406a.628.628 0 0 1-.228-.227h-.403a.313.313 0 0 1-.307-.313c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .227-.228zm-17.5 69v-.403c0-.17.145-.307.313-.307.173 0 .313.134.313.307v.402a.623.623 0 0 1 .228.228h.403c.17 0 .307.144.307.312a.308.308 0 0 1-.307.313h-.402a.628.628 0 0 1-.227.228v.403a.313.313 0 0 1-.626.004v-.406a.623.623 0 0 1-.228-.228h-.403a.312.312 0 0 1-.307-.312c0-.173.134-.313.307-.313h.402a.628.628 0 0 1 .227-.228zm107 10.5v-.403c0-.17.145-.307.313-.307.173 0 .313.134.313.307v.402a.623.623 0 0 1 .228.228h.403c.17 0 .307.144.307.312a.308.308 0 0 1-.307.313h-.402a.623.623 0 0 1-.228.228v.403c0 .17-.144.307-.312.307a.314.314 0 0 1-.313-.303v-.406a.623.623 0 0 1-.228-.228h-.403a.312.312 0 0 1-.307-.312c0-.173.134-.313.307-.313h.402a.623.623 0 0 1 .228-.228z" fill={color} /> <g transform="translate(55 27)"> <rect className="stroke-color" fill="#FFF" height="112" rx="3.6" stroke={color} strokeWidth="2" width="61" x="3" /> <circle className="stroke-color" cx="33" cy="99" r="5" stroke={color} strokeWidth="1.8" /> <path className="stroke-color" d="M3 21h61v66H3z" fill="#FFF" stroke={color} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> <rect className="fill-color" fill={color} fillOpacity=".1" height="60" rx="2.574" width="55" x="6" y="24" /> <path className="stroke-color" d="M28 14h10" stroke={color} strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.8" /> <circle className="fill-color" cx="33" cy="8" fill={color} r="2" /> <ellipse className="fill-color" cx="32.5" cy="125" fill={color} fillOpacity=".1" rx="32.5" ry="3" /> </g> <g transform="translate(1 34)"> <rect className="stroke-color" fill="#FFF" height="60" rx="1.5" stroke={color} strokeWidth="2" width="40" x="22" /> <path className="stroke-color" d="M31 9.498C31 8.67 31.676 8 32.5 8h32.41c.83 0 1.924.528 2.437 1.166l7.716 9.6c.517.642.937 1.844.937 2.656V66.51c0 .822-.67 1.49-1.497 1.49H32.497A1.5 1.5 0 0 1 31 66.502V9.498z" fill="#FFF" stroke={color} strokeWidth="2" /> <path className="fill-color" d="M.864 28.922a1.036 1.036 0 0 0-.005.098C.86 33.396 3.93 35 9.5 35H21a1 1 0 0 0 0-2H9.5c-4.542 0-6.58-1.03-6.64-3.853v-.02c0-2.15 1.523-3.97 3.796-4.13L40.5 25c1.765 0 2.5.446 2.5 1.5 0 1.056-.735 1.5-2.5 1.5H10.887a1 1 0 0 0 0 2H40.5c2.727 0 4.5-1.073 4.5-3.5 0-2.425-1.774-3.5-4.5-3.5H6.586C3.22 23.235.96 25.854.864 28.922zM38.5 36a1 1 0 0 1 .998-1h28.004a1 1 0 1 1 0 2H39.498a.997.997 0 0 1-.998-1zm0 5a1 1 0 0 1 .998-1h28.004a1 1 0 1 1 0 2H39.498a.997.997 0 0 1-.998-1zm0 5c0-.552.445-1 .993-1h16.014c.548 0 .993.444.993 1 0 .552-.445 1-.993 1H39.493a.994.994 0 0 1-.993-1zm20.4 0a1 1 0 0 1 .99-1h4.02c.546 0 .99.444.99 1a1 1 0 0 1-.99 1h-4.02a.993.993 0 0 1-.99-1zM14.39 21H10.5a1 1 0 1 1 0-2H21a1 1 0 0 1 0 2h-6.61z" fill={color} /> <path className="fill-color" d="M33 56.095c0-.828.64-1.275 1.445-1.07 0 0 1.3.926 12.222.926 6.79 0 9.8 2.838 13.666 2.838 7.822 0 12.4-3.403 12.4-3.403.7-.436 1.267-.11 1.267.71v8.38c0 .827-.677 1.498-1.508 1.498H34.508a1.507 1.507 0 0 1-1.508-1.5v-8.378z" fill={color} fillOpacity=".1" /> <path className="stroke-color" d="M75 19h-8.385A1.617 1.617 0 0 1 65 17.385V9" stroke={color} strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" /> </g> </g> </AccessibleSVG> ); export default IconMobileApp;