logo component
This commit is contained in:
parent
18de9fd073
commit
e6a32b0b91
src/components
|
@ -1,17 +1,12 @@
|
|||
import React from "react";
|
||||
import '../Qrcode.css';
|
||||
import logo from "../../qrbtf-logo.svg";
|
||||
import InputText from "../../containers/app/InputText";
|
||||
|
||||
const logoStyle = {
|
||||
background: `url(${logo})`,
|
||||
backgroundRepeat: 'no-repeat',
|
||||
backgroundPosition: 'left'
|
||||
};
|
||||
import QrbtfLogo from "../svg/QrbtfLogo";
|
||||
|
||||
const PartHeader = () => (
|
||||
<div className="Qr-Centered">
|
||||
<div style={logoStyle}>
|
||||
<div>
|
||||
<QrbtfLogo />
|
||||
<h1 className="Qr-title"> </h1>
|
||||
</div>
|
||||
<p className="Qr-subtitle">参数化二维码生成器 <sup className="Gray">测试版</sup></p>
|
||||
|
|
|
@ -0,0 +1,472 @@
|
|||
import * as React from "react"
|
||||
|
||||
function QrbtfLogo(props) {
|
||||
return (
|
||||
<svg viewBox="71 71 2521 686" {...props}>
|
||||
<g fill="none" strokeWidth={18}>
|
||||
<g strokeDasharray="600,600" strokeDashoffset={600}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="2.2s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="1.7s"
|
||||
values="-600; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M2407.38 576V417.92c0-2.078 0-4.157-.004-6.235l-.005-2.002a627.587 627.587 0 00-.024-3.732 371.187 371.187 0 00-.05-3.61c-.022-1.155-.051-2.31-.09-3.465a180.675 180.675 0 00-.137-3.307 136.027 136.027 0 00-.196-3.14c-.074-.99-.16-1.98-.26-2.968a88.781 88.781 0 00-.331-2.812 75.628 75.628 0 00-.404-2.658 66.999 66.999 0 00-.48-2.521 62.67 62.67 0 00-1.215-4.814 64.154 64.154 0 00-1.19-3.62 74.396 74.396 0 00-5.005-10.995 74.163 74.163 0 00-93.513-32.244 74.247 74.247 0 00-16.95 9.952 74.224 74.224 0 00-16.53 18.063 74.082 74.082 0 00-7.98 16.447 61.644 61.644 0 00-1.977 7.21 67.403 67.403 0 00-.479 2.522c-.15.883-.285 1.77-.404 2.658a88.487 88.487 0 00-.33 2.812c-.102.988-.188 1.978-.261 2.968a136.027 136.027 0 00-.196 3.14 179.787 179.787 0 00-.138 3.307c-.038 1.155-.067 2.31-.089 3.466-.023 1.203-.039 2.406-.05 3.609a611.07 611.07 0 00-.03 5.734c-.003 2.078-.003 4.157-.003 6.235V576"
|
||||
/>
|
||||
</g>
|
||||
<g strokeDasharray="288,288" strokeDashoffset={288}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="2.2s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="1.7s"
|
||||
values="-288; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M2259.06 576V288"
|
||||
/>
|
||||
</g>
|
||||
<g strokeDasharray="600,600" strokeDashoffset={600}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="2.2s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="1.7s"
|
||||
values="-600; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M2555.7 576V417.92c0-2.078 0-4.157-.004-6.235a890.055 890.055 0 00-.029-5.734 380.954 380.954 0 00-.05-3.61c-.022-1.155-.051-2.31-.09-3.465a180.675 180.675 0 00-.137-3.307 139.471 139.471 0 00-.196-3.14c-.074-.99-.16-1.98-.26-2.968a88.781 88.781 0 00-.331-2.812 75.628 75.628 0 00-.404-2.658 66.801 66.801 0 00-.48-2.521 62.118 62.118 0 00-1.215-4.814 63.784 63.784 0 00-1.19-3.62 74.396 74.396 0 00-5.005-10.995 74.216 74.216 0 00-11.75-15.734 74.201 74.201 0 00-24.276-16.51 74.214 74.214 0 00-18.933-5.145 74.197 74.197 0 00-29.258 1.943 74.2 74.2 0 00-26.246 13.154 74.19 74.19 0 00-21.336 26.68 74.109 74.109 0 00-3.173 7.83 61.644 61.644 0 00-1.977 7.21 67.61 67.61 0 00-.48 2.522c-.15.883-.285 1.77-.404 2.658a89.37 89.37 0 00-.33 2.812c-.102.988-.187 1.978-.261 2.968a136.027 136.027 0 00-.196 3.14 182.48 182.48 0 00-.138 3.307c-.038 1.155-.067 2.31-.09 3.466a387.756 387.756 0 00-.05 3.609 654.104 654.104 0 00-.028 5.734c-.004 2.078-.004 4.157-.004 6.235V576"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<g
|
||||
fill="none"
|
||||
strokeDasharray="679,679"
|
||||
strokeDashoffset={679}
|
||||
strokeWidth={18}
|
||||
>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="2.05s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="1.55s"
|
||||
values="679; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M2119.04 432a107.978 107.978 0 00-7.583-39.753 107.986 107.986 0 00-60.663-60.664 107.984 107.984 0 00-59.406-5.78 107.988 107.988 0 00-56.715 29.828 107.991 107.991 0 00-29.83 96.02 107.988 107.988 0 0029.827 56.715A107.99 107.99 0 002011.04 540a107.985 107.985 0 0039.753-7.583 107.991 107.991 0 0066.443-80.765A107.995 107.995 0 002119.04 432z"
|
||||
/>
|
||||
</g>
|
||||
<g
|
||||
fill="none"
|
||||
strokeDasharray="475,475"
|
||||
strokeDashoffset={475}
|
||||
strokeWidth={18}
|
||||
>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.9s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="1.4s"
|
||||
values="475; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M1810.827 342.464a107.986 107.986 0 00-54.74-18.316 108 108 0 1054.74 197.388"
|
||||
/>
|
||||
</g>
|
||||
<g>
|
||||
<animateTransform
|
||||
attributeName="transform"
|
||||
type="translate"
|
||||
begin="1.75s"
|
||||
values="1507.655 530.172"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
additive="sum"
|
||||
/>
|
||||
<animateTransform
|
||||
attributeName="transform"
|
||||
type="scale"
|
||||
begin="1.75s"
|
||||
values="0; 1"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
additive="sum"
|
||||
/>
|
||||
<animateTransform
|
||||
attributeName="transform"
|
||||
type="translate"
|
||||
begin="1.75s"
|
||||
values="-1507.655 -530.172"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
additive="sum"
|
||||
/>
|
||||
<animateTransform
|
||||
attributeName="transform"
|
||||
type="scale"
|
||||
values={0}
|
||||
dur="1.75s"
|
||||
additive="sum"
|
||||
/>
|
||||
<path d="M1553.483 530.172a45.826 45.826 0 00-62.697-42.61 45.823 45.823 0 00-28.959 42.61A45.823 45.823 0 001507.655 576a45.823 45.823 0 0045.828-45.828z" />
|
||||
</g>
|
||||
<g fill="none" strokeWidth={18}>
|
||||
<g strokeDasharray="235,235" strokeDashoffset={235}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.6s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="1.1s"
|
||||
values="235; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M1230.626 324h230.4"
|
||||
/>
|
||||
</g>
|
||||
<g strokeDasharray="560,560" strokeDashoffset={560}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.6s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="1.1s"
|
||||
values="560; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M1460.146 121.75a72.053 72.053 0 00-24.33-11.466 72.023 72.023 0 00-40.059 1.181 72.055 72.055 0 00-23.653 12.915 72.072 72.072 0 00-9.584 9.52 72.038 72.038 0 00-12.721 22.514 67.392 67.392 0 00-1.323 4.27 66.701 66.701 0 00-1.14 4.888c-.3 1.544-.55 3.097-.757 4.655a97.901 97.901 0 00-.53 5.036c-.146 1.822-.249 3.649-.321 5.476a206.353 206.353 0 00-.143 5.928 371.593 371.593 0 00-.009 6.353c.007 1.164.018 2.327.03 3.491.02 1.76.044 3.52.067 5.28.027 2.018.054 4.036.076 6.053a1246.942 1246.942 0 01.077 16.156v352"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<g fill="none" strokeWidth={18}>
|
||||
<g strokeDasharray="235,235" strokeDashoffset={235}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.45s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.95s"
|
||||
values="235; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M959.222 324h230.4"
|
||||
/>
|
||||
</g>
|
||||
<g strokeDasharray="430,430" strokeDashoffset={430}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.45s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.95s"
|
||||
values="430; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M1074.422 208.8v230.4a4582.118 4582.118 0 01-.008 8.728l-.01 4.62-.001 1.847c-.001 1.642 0 3.284.01 4.925.01 1.569.026 3.137.056 4.706.028 1.475.067 2.95.125 4.426.041 1.048.092 2.096.155 3.143.04.667.084 1.333.135 2a99.8 99.8 0 00.356 3.77c.133 1.17.29 2.336.476 3.497.175 1.096.376 2.188.605 3.273a61.087 61.087 0 002.073 7.448 72.097 72.097 0 008.524 16.954 72.007 72.007 0 0039.151 28.526 72.023 72.023 0 0032.596 1.888 72.026 72.026 0 0030.077-12.702"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<g fill="none" strokeWidth={18}>
|
||||
<g strokeDasharray="504,504" strokeDashoffset={504}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.3s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.8s"
|
||||
values="504; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M679.557 72v504"
|
||||
/>
|
||||
</g>
|
||||
<g strokeDasharray="679,679" strokeDashoffset={679}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.3s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.8s"
|
||||
values="679; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M679.557 432a107.986 107.986 0 007.583 39.753 107.99 107.99 0 0060.662 60.664 107.988 107.988 0 0079.509 0 107.99 107.99 0 0060.663-60.662 107.996 107.996 0 00-24.048-116.121 107.991 107.991 0 00-96.02-29.831 107.985 107.985 0 00-56.715 29.828A107.991 107.991 0 00679.557 432z"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<g fill="none" strokeWidth={18}>
|
||||
<g strokeDasharray="288,288" strokeDashoffset={288}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.15s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.65s"
|
||||
values="-288; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M468.049 576V288"
|
||||
/>
|
||||
</g>
|
||||
<g strokeDasharray="340,340" strokeDashoffset={340}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1.15s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.65s"
|
||||
values="-340; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M582.37 337.75a72.032 72.032 0 00-29.386-12.578 72.031 72.031 0 00-24.08-.304 72.068 72.068 0 00-15.476 4.235 72.02 72.02 0 00-26.353 18.136 72.002 72.002 0 00-15.127 25.392 59.246 59.246 0 00-2.174 8.153c-.181.934-.341 1.873-.483 2.815-.089.59-.17 1.183-.246 1.776a91.27 91.27 0 00-.34 3.122c-.102 1.111-.187 2.224-.257 3.337a153.872 153.872 0 00-.18 3.554 198.122 198.122 0 00-.116 3.762c-.03 1.317-.05 2.634-.065 3.951-.014 1.37-.023 2.741-.028 4.112l-.007 2.515c-.003 2.09-.003 4.181-.003 6.272v160"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<g fill="none" strokeWidth={18}>
|
||||
<g strokeDasharray="679,679" strokeDashoffset={679}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.5s"
|
||||
values="679; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeLinejoin="round"
|
||||
d="M324 432a107.986 107.986 0 00-7.583-39.753 107.99 107.99 0 00-60.662-60.664 107.988 107.988 0 00-79.508 0 107.99 107.99 0 00-60.664 60.662 107.988 107.988 0 000 79.508 107.99 107.99 0 0060.662 60.664 107.988 107.988 0 0079.508 0 107.99 107.99 0 0060.664-60.662A107.988 107.988 0 00324 432z"
|
||||
/>
|
||||
</g>
|
||||
<g strokeDasharray="468,468" strokeDashoffset={468}>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-width"
|
||||
begin="1s"
|
||||
values="18; 72"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<animate
|
||||
attributeType="CSS"
|
||||
attributeName="stroke-dashoffset"
|
||||
begin="0.5s"
|
||||
values="468; 0"
|
||||
dur="1s"
|
||||
fill="freeze"
|
||||
calcMode="spline"
|
||||
keySplines="0.8 0 0.2 1"
|
||||
/>
|
||||
<path stroke="currentColor" strokeLinejoin="round" d="M324 288v468" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
)
|
||||
}
|
||||
|
||||
export default QrbtfLogo
|
Loading…
Reference in New Issue