UNPKG

@patreon/studio

Version:

Patreon Studio Design System

14 lines 3.77 kB
import cx from 'classnames'; import React from 'react'; import { tokens } from '../../tokens'; import styles from './Logo.module.css'; export function PatreonWordmark({ id, color = tokens.global.content.regular.default, height, width, 'data-tag': dataTag, className, style, }) { const classList = cx(styles.container, className); return (<div className={classList} style={style}> <svg id={id} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 544 90" style={{ fill: color, height, width }} data-tag={dataTag}> <title>Patreon wordmark</title> <path d="M0 8.26c0-3.822 2.836-6.41 7.274-6.41H28.48c19.232 0 32.3 10.602 32.3 26.136 0 15.288-12.944 26.63-32.3 26.63h-2.96c-7.397 0-11.219 3.822-11.219 9.987v17.383c0 4.932-2.835 8.014-7.15 8.014S0 86.918 0 81.986V8.26ZM14.301 30.33c0 7.767 3.946 11.465 11.466 11.465h1.85c10.602 0 18.37-4.314 18.37-13.808 0-9.493-7.768-13.808-18.37-13.808h-1.85c-7.52 0-11.466 3.699-11.466 11.466v4.685Zm46.48 52.89c0 4.069 2.835 6.781 7.15 6.781 2.836 0 5.425-1.85 6.905-5.671l2.589-6.904c2.096-5.548 5.794-8.137 9.863-8.137h23.424c4.069 0 7.767 2.589 9.863 8.137l2.589 6.904c1.48 3.822 4.069 5.671 6.904 5.671 4.316 0 7.151-2.712 7.151-6.78 0-1.11-.246-2.467-.74-3.823l-27.986-72.74C106.767 2.22 102.822 0 99 0s-7.767 2.22-9.493 6.658L61.52 79.398c-.493 1.355-.74 2.712-.74 3.821Zm27.246-33.04c0-1.357.37-2.59.987-4.44l5.301-14.67c.986-2.836 2.712-4.192 4.685-4.192 1.973 0 3.699 1.356 4.685 4.192l5.301 14.67c.617 1.85.987 3.083.987 4.44 0 3.698-2.096 6.287-7.644 6.287h-6.658c-5.548 0-7.644-2.59-7.644-6.288Zm44.507-41.672c0-3.945 2.836-6.658 7.398-6.658h56.712c4.561 0 7.397 2.713 7.397 6.658 0 3.945-2.836 6.657-7.397 6.657h-9.493c-7.521 0-11.589 3.822-11.589 12.576v54.123c0 5.055-2.836 8.137-7.274 8.137-4.439 0-7.274-3.082-7.274-8.137V27.74c0-8.754-4.069-12.576-11.589-12.576h-9.493c-4.562 0-7.398-2.712-7.398-6.657Zm84.822 73.48c0 4.93 2.836 8.013 7.151 8.013 4.315 0 7.151-3.082 7.151-8.014V62.384c0-5.548 3.205-7.89 7.15-7.89h.986c2.59 0 5.179 1.602 6.781 3.944l18.74 27.493c1.726 2.59 3.945 4.069 6.781 4.069 3.698 0 6.657-3.082 6.657-6.78 0-1.48-.493-3.083-1.602-4.686l-12.452-17.507c-1.48-2.096-2.096-3.822-2.096-5.301 0-3.082 2.712-5.301 5.918-7.644 5.794-4.315 12.082-9.986 12.082-20.835 0-15.165-11.836-25.398-31.315-25.398h-24.781c-4.439 0-7.151 2.59-7.151 6.411v73.726Zm14.302-52.768V25.52c0-8.013 4.191-11.342 10.602-11.342h6.165c10.602 0 17.383 3.945 17.383 13.069 0 9.123-7.15 13.315-17.753 13.315h-5.795c-6.411 0-10.602-3.33-10.602-11.343Zm67.191 52.52V8.26c0-3.822 2.713-6.41 7.151-6.41h46.603c4.438 0 7.15 2.588 7.15 6.41s-2.712 6.411-7.15 6.411h-29.466c-5.795 0-9.986 3.452-9.986 9.986v2.713c0 6.534 4.191 9.986 9.986 9.986h22.808c4.439 0 7.151 2.59 7.151 6.411 0 3.822-2.712 6.411-7.151 6.411H324c-5.795 0-10.849 3.575-10.849 10.85v3.451c0 7.274 5.054 10.85 10.849 10.85h28.603c4.438 0 7.15 2.589 7.15 6.41 0 3.823-2.712 6.412-7.15 6.412H306c-4.438 0-7.151-2.59-7.151-6.411ZM368.26 45c0-26.63 19.973-45 43.398-45 23.424 0 43.397 18.37 43.397 45s-19.973 45-43.397 45c-23.425 0-43.398-18.37-43.398-45Zm16.274 0c0 18.74 11.096 30.699 27.124 30.699 16.027 0 27.123-11.96 27.123-30.699 0-18.863-11.096-30.699-27.123-30.699-16.028 0-27.124 11.836-27.124 30.699Zm87.658 36.986c0 4.932 2.835 8.014 7.15 8.014 4.316 0 7.151-3.082 7.151-8.014V44.26c0-4.561 2.712-6.78 5.548-6.78 2.219 0 4.069 1.232 5.425 3.452l23.671 39.575C524.342 85.93 527.301 90 533.342 90c5.795 0 9.987-4.192 9.987-10.973V8.014c0-4.932-2.836-8.014-7.151-8.014-4.315 0-7.151 3.082-7.151 8.014V45.74c0 4.561-2.712 6.78-5.548 6.78-2.219 0-4.068-1.232-5.424-3.452L494.384 9.493C491.178 4.068 488.219 0 482.178 0c-5.794 0-9.986 4.192-9.986 10.973v71.013Z"/> </svg> </div>); } //# sourceMappingURL=PatreonWordmark.jsx.map