@gravityforms/components
Version:
UI components for use in Gravity Forms development. Both React and vanilla js flavors.
56 lines (50 loc) • 4.29 kB
JavaScript
import { React, PropTypes } from '@gravityforms/libraries';
const { forwardRef } = React;
/**
* @module GravitySMTPFullLogo
* @description The Gravity SMTP Full logo.
*
* @since 3.6.6
*
* @param {object} props Component props.
* @param {number} props.height The height of the logo.
* @param {string} props.logoFill The logo fill color.
* @param {string} props.primaryColor The primary fill color.
* @param {string} props.secondaryColor The secondary fill color.
* @param {string} props.title The title of the logo.
* @param {number} props.width The width of the logo.
* @param {object|null} ref Ref to the component.
*
* @return {JSX.Element} The svg component.
* @example
* import GravitySMTPFullLogo from '@gravityforms/components/react/admin/elements/Svgs/GravitySMTPFullLogo';
*
* return (
* <GravitySMTPFullLogo height={ 32 } width={ 315 } />
* );
*
*/
const GravitySMTPFullLogo = forwardRef( ( {
height = 32,
logoFill = '#FF4F00',
primaryFill = '#1B2A45',
secondaryFill = '#8996AD',
title = '',
width = 315,
}, ref ) => {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={ width } height={ height } fill="none" viewBox="0 0 315 32" ref={ ref }>
{ title !== '' && <title>{ title }</title> }
<path fill={ primaryFill } fillRule="evenodd" d="M55.264 2.545c5.115 0 10.23 2.412 11.691 8.404h-5.407c-1.316-2.485-3.361-3.435-6.284-3.435-4.823 0-7.527 3.58-7.527 8.184 0 4.823 2.923 8.111 7.527 8.111 3.507 0 6.138-1.023 7.234-4.896h-7.015V14.31H67.54c.146 2.411.073 4.823-.804 7.16-1.973 5.116-6.577 7.308-11.472 7.308-6.796 0-13.153-4.604-13.153-13.08 0-8.55 6.357-13.153 13.153-13.153Zm39.75 24.991v.73H89.17l-5.261-8.402h-4.604v8.403h-5.48V2.765h10.96c5.846 0 9.061 4.238 9.061 8.768 0 3.216-1.68 6.065-4.603 7.527l5.772 8.476Zm-10.303-12.13c2.339 0 3.8-1.754 3.8-3.946 0-2.119-1.461-3.872-3.8-3.872h-5.48v7.818h5.48Zm20.095 12.933 1.973-4.238h10.741l2.046 4.238h5.7v-.73l-11.765-24.99h-2.557l-11.838 24.99v.73h5.7Zm10.887-8.768h-7.16l3.58-8.403 3.58 8.403Zm20.46-2.338 2.704-6.211 3.434-8.111h5.846v.804L137.176 28.34h-2.265L123.877 3.715V2.91h5.846l3.434 8.11 2.85 6.285h.146v-.073Zm17.245-14.468V28.34h5.481V2.765h-5.481Zm10.815 4.822v-4.75h21.629v4.75h-8.111V28.34h-5.334V7.587h-8.184Zm39.239.512-2.558 5.042h-.146l-2.411-4.896-3.215-5.407h-5.919v.804l8.842 14.468v10.157h5.48V18.11l8.842-14.468v-.804h-5.846l-3.069 5.261Z" clipRule="evenodd" />
<path fill={ secondaryFill } d="M231.126 5.714c-2.915 0-5.045 1.638-5.045 4.062 0 2.556 1.769 3.8 5.897 4.16 6.028.525 8.879 2.95 8.879 7.47 0 4.587-3.899 7.798-9.469 7.798-6.355 0-10.025-3.735-9.632-9.829h3.211c-.229 4.521 1.999 6.88 6.421 6.88 3.67 0 6.16-1.769 6.16-4.62 0-2.882-1.835-4.127-6.618-4.586-5.406-.491-8.158-2.883-8.158-7.01 0-4.129 3.538-7.208 8.354-7.208 5.472 0 8.944 3.472 8.715 8.747h-3.211c.164-3.8-1.769-5.864-5.504-5.864ZM256.322 28.778l-5.93-14.808-1.802-4.784.131 6.979v12.613h-3.211V3.224h4.128l5.996 15.005 2.195 5.897 2.195-5.897 5.962-15.005h4.063v25.554h-3.178V16.165l.131-6.979-1.802 4.784-5.93 14.808h-2.948ZM285.255 6.238v22.54h-3.276V6.238h-8.19V3.224h19.657v3.014h-8.191ZM300.454 15.673h6.519c2.523 0 4.718-1.507 4.718-4.717 0-3.211-2.195-4.718-4.718-4.718h-6.519v9.435Zm0 3.047v10.058h-3.276V3.224h9.894c4.423 0 7.928 2.719 7.928 7.732 0 5.045-3.505 7.764-7.928 7.764h-6.618Z" />
<path fill={ logoFill } d="M32.894 23.491 21.374.904C21.078.406 20.353 0 19.766 0H13.3c-.587 0-1.31.409-1.61.904L.168 23.49c-.298.498-.133 1.157-.012 1.816l.967 5.071c.133.59 1.008.912 1.598.912l13.793.033h.034l13.796-.033c.59 0 1.473-.323 1.598-.912l.966-5.071c.133-.6.286-1.318-.011-1.816h-.003Zm-7.205 2.074-5.424-1.626c-.773-.253-1.3-.426-1.566-.948l-1.567-4.343c-.134-.259-.306-.381-.482-.381h-.014c-.003 0-.011-.003-.017 0-.173.003-.346.125-.479.384l-1.567 4.342c-.266.523-.788.673-1.567.949L7.58 25.568c-.595 0-.836-.412-.538-.918l8.812-17.63c.346-.72 1.147-.786 1.567 0l8.812 17.63c.297.504.056.918-.539.918l-.005-.003Z" />
</svg>
);
} );
GravitySMTPFullLogo.propTypes = {
height: PropTypes.number,
title: PropTypes.string,
width: PropTypes.number,
};
GravitySMTPFullLogo.displayName = 'Svgs/GravitySMTPFullLogo';
export default GravitySMTPFullLogo;