UNPKG

@atlaskit/logo

Version:

A logo is a visual representation of a brand or app. It can be a word, an image, or a combination of both.

33 lines (32 loc) 3.75 kB
/** * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen} * @codegen <<SignedSource::55efa621d04b80f0ae75d7170a0a085c>> * @codegenCommand yarn workspace @atlaskit/logo generate:components */ import React from 'react'; import { LogoWrapper } from '../../../utils/logo-wrapper'; // `height` is set to 100% to allow the SVG to scale with the parent element // The text color is set to "currentColor" to allow the SVG to inherit the color set by the parent based on the theme. var svg = "<svg height=\"100%\" viewBox=\"0 0 214 48\">\n <path fill=\"var(--text-color, #292A2E)\" d=\"M213.76 31.74c0 3.82-2.48 6.72-8.65 6.72-3.45 0-6.26-.78-8-1.7v-4.19c1.98 1.15 5.29 2.25 8.19 2.25 3.04 0 4.6-1.24 4.6-3.04 0-1.75-1.33-2.76-5.7-3.82-5.11-1.24-7.27-3.22-7.27-6.99 0-4 3.08-6.44 8.33-6.44 2.99 0 5.7.74 7.41 1.66v4.09c-2.76-1.38-5.01-2.12-7.45-2.12-2.9 0-4.46 1.01-4.46 2.81 0 1.61 1.1 2.62 5.34 3.63 5.11 1.24 7.68 3.13 7.68 7.13m-26.63-.86c0 2.02 1.2 3.4 3.63 3.4.92 0 1.79-.18 2.48-.32v3.82c-.69.18-1.47.37-2.67.37-4.92 0-7.31-2.9-7.31-7.18V18.68h-3.73V15h3.73v-4.88h3.86V15h6.12v3.68h-6.12zm-11.04-6.35V38h-3.96V25.21c0-4.74-1.66-7.08-5.43-7.08-3.68 0-6.21 2.44-6.21 7.08V38h-3.96V5.39h3.96v13.43c1.52-2.71 4.28-4.28 7.59-4.28 5.15 0 8 3.5 8 9.98m-29.37 11.64v-2.3c-1.47 3.04-4.23 4.6-7.77 4.6-6.07 0-9.11-5.2-9.11-11.96 0-6.49 3.17-11.96 9.57-11.96 3.36 0 5.93 1.52 7.31 4.51V15h3.86v20.93c0 6.76-3.17 11.32-11.41 11.32-3.86 0-5.98-.51-8.19-1.24v-3.87c2.53.83 5.15 1.38 8 1.38 5.75 0 7.73-3.08 7.73-7.36m-13.01-9.66c0 5.52 2.21 8.28 6.3 8.28 3.54 0 6.72-2.25 6.72-7.36v-1.84c0-5.11-2.9-7.36-6.26-7.36-4.46 0-6.76 2.94-6.76 8.28M120.56 8.93c0-1.75 1.15-2.76 2.76-2.76s2.76 1.01 2.76 2.76-1.15 2.76-2.76 2.76-2.76-1.01-2.76-2.76M121.3 38V15h3.96v23zm-4.57-6.26c0 3.82-2.48 6.72-8.65 6.72-3.45 0-6.26-.78-8-1.7v-4.19c1.98 1.15 5.29 2.25 8.19 2.25 3.04 0 4.6-1.24 4.6-3.04 0-1.75-1.33-2.76-5.7-3.82-5.11-1.24-7.27-3.22-7.27-6.99 0-4 3.08-6.44 8.33-6.44 2.99 0 5.7.74 7.41 1.66v4.09c-2.76-1.38-5.01-2.12-7.45-2.12-2.9 0-4.46 1.01-4.46 2.81 0 1.61 1.1 2.62 5.34 3.63 5.11 1.24 7.68 3.13 7.68 7.13m-21.41-7.21V38h-3.96V24.11c0-4.14-1.66-5.98-5.43-5.98-3.68 0-6.21 2.44-6.21 7.08V38h-3.96V15h3.96v3.77c1.47-2.71 4.19-4.23 7.27-4.23 5.29 0 8.33 3.63 8.33 9.98M64.55 7.78h4.14V38h-4.14z\"/>\n <path fill=\"var(--tile-color,#DDDEE1)\" d=\"M0 12C0 5.373 5.373 0 12 0h24c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12H12C5.373 48 0 42.627 0 36z\"/>\n <path fill=\"var(--icon-color, #101214)\" d=\"M36.5 37.5h-25v-4h25zM18.25 31h-6.5v-9h6.5zm9 0h-6.5V18h6.5zm2.53-13.93c1.15.51 1.46.72 1.66.93l.1.12c.24.3.47.82 1.12 2.47l.97 2.49h2.61V31h-6.5V17.06zm6.7-8.85c.68 1.73 1.01 2.59 1.64 3.24.62.65 1.47 1.02 3.16 1.76l.73.32v1.01l-.72.32q-.53.23-.96.43c-1.08.49-1.71.82-2.2 1.34l-.11.12c-.52.6-.85 1.39-1.4 2.82l-.12.3-.5 1.2h-1l-.48-1.22c-.25-.65-.46-1.17-.65-1.61-.32-.73-.6-1.22-.99-1.63-.5-.53-1.16-.87-2.28-1.37q-.26-.12-.57-.25l-.31-.14-.72-.32v-1.01l.73-.32c.61-.27 1.11-.49 1.53-.69l.18-.09q.11-.05.21-.11l.16-.09a7 7 0 0 0 .33-.19 5 5 0 0 0 .29-.2 4 4 0 0 0 .45-.39c.62-.65.96-1.51 1.64-3.24L35 7h1z\"/>\n</svg>\n"; /** * __InsightsLogo__ * * An internal component to represent the logo for Insights. * */ export function InsightsLogo(_ref) { var _ref$size = _ref.size, size = _ref$size === void 0 ? 'medium' : _ref$size, _ref$appearance = _ref.appearance, appearance = _ref$appearance === void 0 ? 'brand' : _ref$appearance, _ref$label = _ref.label, label = _ref$label === void 0 ? 'Insights' : _ref$label, testId = _ref.testId; return /*#__PURE__*/React.createElement(LogoWrapper, { svg: svg, label: label, appearance: appearance, size: size, testId: testId }); }