init
Zhang Chaojie
commit
c7265dac70
|
|
@ -0,0 +1,2 @@
|
|||
node_modules
|
||||
.vscode
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/src/favicon.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Vite App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,22 @@
|
|||
{
|
||||
"name": "vite-react-ts",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"start": "vite",
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.0.17",
|
||||
"@types/react-dom": "^18.0.6",
|
||||
"@vitejs/plugin-react": "^2.0.1",
|
||||
"typescript": "^4.7.4",
|
||||
"vite": "^3.0.9"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 2.6 MiB |
|
|
@ -0,0 +1,3 @@
|
|||
# https://www.robotstxt.org/robotstxt.html
|
||||
User-agent: *
|
||||
Disallow:
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
.root {
|
||||
height: 100%;
|
||||
font-family: sans-serif;
|
||||
background-color: __backgroundColor__;
|
||||
flex-basis: 100%;
|
||||
overflow-y: auto;
|
||||
/* __center__ */
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC } from 'react';
|
||||
|
||||
import classes from './App.module.css';
|
||||
import resets from './components/_resets.module.css';
|
||||
import { Yidian } from './components/Yidian/Yidian';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
}
|
||||
export const App: FC<Props> = memo(function App(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<Yidian />
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const AreaIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 192 100' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
opacity={0.1}
|
||||
d='M6.93557 64.7041L6.36701 64.2599C5.25392 63.3903 3.76795 63.1822 2.43148 63.6394C1.45764 63.9725 0.428118 64.2857 0 64.2857V100H192V57.1429C191.416 57.1429 189.716 54.233 188.561 52.1278C187.849 50.8294 186.497 50 185.016 50H184.593C183.511 50 182.505 49.449 181.922 48.5382C180.475 46.2772 177.048 46.7245 176.23 49.2812L173.873 56.6455C173.768 56.9757 173.62 57.2907 173.433 57.5827L172.512 59.0215C170.939 61.4799 167.331 61.4541 165.757 58.9957C165.022 57.8469 163.746 57.1429 162.382 57.1429H162.189C160.825 57.1429 159.555 56.4479 158.82 55.2991L156.604 51.8367C155.872 50.6923 154.607 50 153.248 50C151.776 50 150.425 49.1889 149.732 47.8905L147.487 43.6813C146.79 42.3746 145.262 41.7484 143.849 42.1901C142.576 42.5879 141.191 42.1216 140.418 41.0346L137.752 37.2858C137.353 36.7239 136.815 36.2748 136.19 35.9821L133.979 34.9454C133.074 34.5211 132.042 34.4511 131.088 34.7493L130.916 34.8032C129.194 35.3411 127.326 34.6605 126.353 33.1415L124.627 30.4441C123.919 29.3384 122.559 28.843 121.306 29.2346C119.907 29.672 118.4 29 117.79 27.6662L115.173 21.9403C114.666 20.8314 113.413 20.2727 112.249 20.6364C110.889 21.0615 109.458 20.225 109.16 18.831L108.938 17.7877C108.154 14.1125 102.863 14.2489 102.269 17.9595L100.974 26.0552C100.742 27.5049 99.4914 28.5714 98.0232 28.5714C96.8013 28.5714 95.7024 29.3154 95.2486 30.4499L92.2682 37.901C91.7611 39.1687 90.5333 40 89.1679 40C87.7776 40 86.5328 40.8615 86.043 42.1626L83.7887 48.1504C82.9784 50.303 80.5057 51.3085 78.4231 50.3322C77.9551 50.1129 77.5348 49.8037 77.1861 49.4223L73.5276 45.4208C73.2724 45.1417 73.0581 44.8278 72.891 44.4885L72.5384 43.7722C71.0088 40.6652 66.522 40.838 65.2358 44.0534L64.4855 45.9292C64.17 46.7178 63.6118 47.3855 62.8916 47.8356L60.1922 49.5227C59.6894 49.837 59.2628 50.2591 58.9431 50.7585L56.459 54.64C55.5997 55.9826 53.7716 56.2948 52.5155 55.3134C51.3006 54.3643 49.5393 54.621 48.6459 55.8774L46.6912 58.6263C46.0665 59.5047 45.1138 60.0938 44.0488 60.2602L42.3614 60.5239C41.5675 60.6479 40.8293 61.0082 40.2431 61.5578L38.4783 63.2123C37.3269 64.2918 35.6338 64.5605 34.2048 63.8906L33.8552 63.7268C32.722 63.1956 31.3842 63.3636 30.4174 64.1586C28.938 65.3752 26.7322 65.0521 25.6638 63.4623L25.5112 63.2352C24.1956 61.2775 21.358 61.1596 19.8846 63.0014L19.8128 63.0911C18.892 64.2422 17.3594 64.7105 15.9524 64.2709L15.4687 64.1197C14.3551 63.7717 13.145 63.9272 12.1556 64.5456L11.5181 64.944C10.0921 65.8353 8.26079 65.7395 6.93557 64.7041Z'
|
||||
fill='url(#paint0_linear_5711_269746)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient id='paint0_linear_5711_269746' x1={96} y1={0} x2={96} y2={100} gradientUnits='userSpaceOnUse'>
|
||||
<stop stopColor='#004DE5' />
|
||||
<stop offset={1} stopColor='#004DE5' stopOpacity={0} />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(AreaIcon);
|
||||
export { Memo as AreaIcon };
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const AreaIcon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 192 100' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
opacity={0.1}
|
||||
d='M8.09574 12.6496L4.67513 7.30489C4.60603 7.19693 4.54269 7.08667 4.48369 6.97288C3.92224 5.89001 0.83024 0 0 0V100H192V96.4286C191.253 96.4286 188.678 94.0469 187.758 93.1734C187.537 92.9639 187.346 92.7278 187.182 92.4715L184.756 88.6806C183.769 87.1383 181.624 86.8706 180.288 88.123C179.162 89.1787 177.41 89.1787 176.284 88.123L174.868 86.7961C174.127 86.1011 173.149 85.7143 172.132 85.7143H171.543C170.066 85.7143 168.709 84.9001 168.013 83.5966L166.106 80.0196C165.216 78.3509 163.265 77.5512 161.46 78.1153C160.521 78.4087 159.506 78.3399 158.615 77.9224L157.177 77.2484C156.073 76.7305 155.265 75.7365 154.983 74.5491L150.857 57.1429L150.241 54.2529C149.353 50.0924 143.402 50.1304 142.568 54.3019L142.271 55.7876C141.974 57.2752 140.453 58.1772 139.005 57.7247C137.905 57.3811 136.712 57.8157 136.091 58.7857L135.642 59.4878C134.208 61.7284 130.935 61.7284 129.501 59.4878L128 57.1429L124.454 50.4933C123.859 49.3785 122.556 48.8443 121.35 49.2211C119.97 49.6521 118.502 48.8893 118.061 47.513L117.755 46.5547C116.674 43.1785 111.897 43.1785 110.817 46.5547L109.873 49.5027C109.768 49.8328 109.62 50.1478 109.433 50.4398L107.125 54.0462C106.199 55.4923 104.087 55.4923 103.161 54.0462C102.106 52.3981 99.6176 52.6826 98.9621 54.5263L96.6344 61.0729C96.235 62.1963 95.3305 63.0664 94.1926 63.422C92.5606 63.932 90.7892 63.2868 89.8676 61.8467L86.8571 57.1429L83.0493 52.3831C82.5516 51.761 81.8794 51.3016 81.119 51.064L79.1049 50.4346C78.2067 50.1539 77.4362 49.5655 76.9289 48.7729L73.1429 42.8571L68.5714 36.4286L66.6588 33.1412C65.4443 31.0539 62.4518 30.9905 61.15 33.0245C60.1963 34.5147 58.2208 34.9594 56.7205 34.0217L56.3523 33.7916C55.4375 33.2199 54.2768 33.2199 53.362 33.7916C51.8018 34.7667 49.7408 34.0115 49.1801 32.2592L45.7143 21.4286L43.578 14.7528C42.6089 11.7241 38.5499 11.1943 36.8358 13.8727C36.6603 14.1469 36.5212 14.4427 36.422 14.7528L33.8935 22.6542C33.3038 24.4971 30.6962 24.4971 30.1065 22.6542C29.461 20.6369 26.5288 20.8932 26.2431 22.9919L25.3384 29.6355C24.8166 33.4671 19.3859 33.7552 18.4616 30.0004L18.2857 29.2857L14.4807 16.8004C14.0254 15.3065 12.6471 14.2857 11.0854 14.2857C9.87506 14.2857 8.74816 13.669 8.09574 12.6496Z'
|
||||
fill='url(#paint0_linear_5711_269750)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient id='paint0_linear_5711_269750' x1={96} y1={0} x2={96} y2={100} gradientUnits='userSpaceOnUse'>
|
||||
<stop stopColor='#FF4E4E' />
|
||||
<stop offset={1} stopColor='#FF4E4E' stopOpacity={0} />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(AreaIcon2);
|
||||
export { Memo as AreaIcon2 };
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const AreaIcon3 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 192 100' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
opacity={0.1}
|
||||
d='M3.40902 86.904C2.25552 89.4247 0.57857 92.8571 0 92.8571V100H192V0C191.28 0 188.86 3.09971 187.863 4.41793C187.573 4.80196 187.362 5.23763 187.233 5.70146L183.018 20.8503C182.911 21.2337 182.748 21.599 182.534 21.9342L178.286 28.5714L175.274 34.2188C174.369 35.915 172.374 36.7239 170.539 36.1506C169.641 35.8699 168.865 35.2798 168.357 34.4871L164.571 28.5714L161.635 23.9826C160.729 22.5676 158.853 22.1453 157.429 23.0357C156.25 23.7726 154.722 23.6235 153.708 22.6726L151.32 20.4342C151.013 20.1465 150.663 19.9091 150.282 19.7305L146.861 18.1266C146.48 17.9481 146.129 17.7106 145.823 17.4229L143.139 14.9067C142.24 14.064 141.003 13.6826 139.785 13.8728L138.923 14.0075C137.791 14.1844 136.789 14.8383 136.172 15.8034L133.73 19.618C133.067 20.6541 131.739 21.0383 130.625 20.5162C129.252 19.8725 127.629 20.6176 127.223 22.0787L123.589 35.136C123.483 35.5194 123.32 35.8847 123.105 36.2199L119.126 42.4367C118.948 42.7159 118.735 42.9718 118.493 43.1986L117.17 44.4393C115.571 45.9376 113.065 45.8716 111.548 44.2913L110.382 43.0763C110.242 42.9304 110.113 42.7741 109.997 42.6088L107.012 38.3694C105.964 36.8801 103.934 36.4699 102.389 37.4352L102.027 37.6618C101.136 38.2183 100.006 38.2183 99.116 37.6618C97.5602 36.6894 95.5068 37.4868 95.0149 39.2543L92.5594 48.0791C92.0671 49.848 89.8212 50.3848 88.5823 49.0297C87.6555 48.0161 86.0588 48.0161 85.132 49.0297L83.6235 50.6796C82.8277 51.5501 81.5584 51.8019 80.4906 51.3014C79.0185 50.6114 77.2753 51.3719 76.7798 52.9203L75.4994 56.9215C74.7378 59.3014 71.3897 59.3549 70.5525 57.0004C69.7926 54.863 66.8561 54.6448 65.7886 56.6464L64.1744 59.673C64.0584 59.8905 63.9225 60.0969 63.7685 60.2894L60.8777 63.9029C59.9815 65.0231 58.5541 65.5776 57.1367 65.3562L56.983 65.3322C55.6557 65.1248 54.5211 64.2649 53.9626 63.0432L53.7898 62.6651C52.3877 59.5981 48.0527 59.5359 46.5632 62.5614L45.7143 64.2857L44.3374 66.4371C42.8093 68.8247 39.3513 68.9091 37.7085 66.599L36.5714 65L32.7808 59.6694C32.2742 58.9571 31.5483 58.4303 30.7141 58.1696L30.5916 58.1313C28.7568 57.5579 26.7737 58.3708 25.8691 60.0669L23.9104 63.7395C23.2994 64.885 21.9601 65.4339 20.7209 65.0467C19.354 64.6196 17.8914 65.3332 17.3868 66.6734L13.7143 76.4286L10.2328 85.1322C9.6876 86.4953 7.98702 86.9541 6.83013 86.0503C5.68966 85.1593 4.01124 85.588 3.40902 86.904Z'
|
||||
fill='url(#paint0_linear_5711_269754)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient id='paint0_linear_5711_269754' x1={96} y1={0} x2={96} y2={100} gradientUnits='userSpaceOnUse'>
|
||||
<stop stopColor='#179942' />
|
||||
<stop offset={1} stopColor='#179942' stopOpacity={0} />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(AreaIcon3);
|
||||
export { Memo as AreaIcon3 };
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.mask {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.border {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon2 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.rM {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
font-family: Roboto, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
letter-spacing: -0.5px;
|
||||
position: absolute;
|
||||
left: calc(50% - -0.3914px);
|
||||
top: calc(50% - -0.6085px);
|
||||
width: 21.1304px;
|
||||
height: 16.4348px;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Avatar_Property1MediumProperty.module.css';
|
||||
import { BorderIcon } from './BorderIcon.js';
|
||||
import { MaskIcon } from './MaskIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
swap?: {
|
||||
mask?: ReactNode;
|
||||
};
|
||||
text?: {
|
||||
rM?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5401:45650 */
|
||||
export const Avatar_Property1MediumProperty: FC<Props> = memo(function Avatar_Property1MediumProperty(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.mask}>{props.swap?.mask || <MaskIcon className={classes.icon} />}</div>
|
||||
<div className={classes.border}>
|
||||
<BorderIcon className={classes.icon2} />
|
||||
</div>
|
||||
{props.text?.rM != null ? props.text?.rM : <div className={classes.rM}>RM</div>}
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const BorderIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M18 36C27.9411 36 36 27.9411 36 18C36 8.05887 27.9411 0 18 0C8.05887 0 0 8.05887 0 18C0 27.9411 8.05887 36 18 36Z'
|
||||
stroke='white'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(BorderIcon);
|
||||
export { Memo as BorderIcon };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const MaskIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M18 36C27.9411 36 36 27.9411 36 18C36 8.05887 27.9411 0 18 0C8.05887 0 0 8.05887 0 18C0 27.9411 8.05887 36 18 36Z'
|
||||
fill='#A358DF'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(MaskIcon);
|
||||
export { Memo as MaskIcon };
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.rectangle3 {
|
||||
position: absolute;
|
||||
left: 36.9048%;
|
||||
right: 4.7619%;
|
||||
top: 16.6667%;
|
||||
bottom: 25%;
|
||||
border-radius: 99px;
|
||||
background-image: linear-gradient(-46.9deg, #0077faff 0%, #0077fa59 100%);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: auto;
|
||||
}
|
||||
.union {
|
||||
position: absolute;
|
||||
left: 8px;
|
||||
top: 2px;
|
||||
width: 32px;
|
||||
height: 44px;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke {
|
||||
position: absolute;
|
||||
left: 33.3333%;
|
||||
right: 33.3333%;
|
||||
top: 41.6667%;
|
||||
bottom: 50%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon2 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke2 {
|
||||
position: absolute;
|
||||
left: 33.3333%;
|
||||
right: 33.3333%;
|
||||
top: 58.3333%;
|
||||
bottom: 33.3333%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon3 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke3 {
|
||||
position: absolute;
|
||||
left: 33.3333%;
|
||||
right: 33.3333%;
|
||||
top: 25%;
|
||||
bottom: 66.6667%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon4 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Bill.module.css';
|
||||
import { UnionIcon } from './UnionIcon.js';
|
||||
import { VectorStrokeIcon2 } from './VectorStrokeIcon2.js';
|
||||
import { VectorStrokeIcon3 } from './VectorStrokeIcon3.js';
|
||||
import { VectorStrokeIcon } from './VectorStrokeIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
swap?: {
|
||||
union?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5404:5814 */
|
||||
export const Bill: FC<Props> = memo(function Bill(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.rectangle3}></div>
|
||||
<div className={classes.union}>{props.swap?.union || <UnionIcon className={classes.icon} />}</div>
|
||||
<div className={classes.vectorStroke}>
|
||||
<VectorStrokeIcon className={classes.icon2} />
|
||||
</div>
|
||||
<div className={classes.vectorStroke2}>
|
||||
<VectorStrokeIcon2 className={classes.icon3} />
|
||||
</div>
|
||||
<div className={classes.vectorStroke3}>
|
||||
<VectorStrokeIcon3 className={classes.icon4} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const UnionIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 32 44' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M4 0C1.79081 0 0 1.79088 0 4V42C0 42.7492 0.418695 43.4355 1.08484 43.7783C1.75098 44.1211 2.55285 44.0629 3.16248 43.6275L9 39.4578L14.8375 43.6275C15.5329 44.1242 16.4671 44.1242 17.1625 43.6275L23 39.4578L28.8375 43.6275C29.4472 44.0629 30.249 44.1211 30.9152 43.7783C31.5813 43.4355 32 42.7492 32 42V4C32 1.79088 30.2092 0 28 0H4Z'
|
||||
fill='url(#paint0_linear_5711_271152)'
|
||||
/>
|
||||
<path
|
||||
d='M3.16248 43.6275L3.4531 44.0343L3.4531 44.0343L3.16248 43.6275ZM9 39.4578L9.29062 39.0509C9.11677 38.9268 8.88323 38.9268 8.70938 39.0509L9 39.4578ZM14.8375 43.6275L14.5469 44.0343L14.5469 44.0343L14.8375 43.6275ZM17.1625 43.6275L17.4531 44.0343L17.4531 44.0343L17.1625 43.6275ZM23 39.4578L23.2906 39.0509C23.1168 38.9268 22.8832 38.9268 22.7094 39.0509L23 39.4578ZM28.8375 43.6275L28.5469 44.0343L28.5469 44.0343L28.8375 43.6275ZM0.5 4C0.5 2.06702 2.06696 0.5 4 0.5V-0.5C1.51466 -0.5 -0.5 1.51474 -0.5 4H0.5ZM0.5 42V4H-0.5V42H0.5ZM1.31363 43.3338C0.814021 43.0766 0.5 42.5619 0.5 42H-0.5C-0.5 42.9365 0.0233682 43.7944 0.856047 44.2229L1.31363 43.3338ZM2.87186 43.2206C2.41464 43.5472 1.81323 43.5909 1.31363 43.3338L0.856047 44.2229C1.68872 44.6514 2.69106 44.5786 3.4531 44.0343L2.87186 43.2206ZM8.70938 39.0509L2.87186 43.2206L3.4531 44.0343L9.29062 39.8647L8.70938 39.0509ZM15.1281 43.2206L9.29062 39.0509L8.70938 39.8647L14.5469 44.0343L15.1281 43.2206ZM16.8719 43.2206C16.3503 43.5931 15.6497 43.5931 15.1281 43.2206L14.5469 44.0343C15.4161 44.6552 16.5838 44.6552 17.4531 44.0343L16.8719 43.2206ZM22.7094 39.0509L16.8719 43.2206L17.4531 44.0343L23.2906 39.8647L22.7094 39.0509ZM29.1281 43.2206L23.2906 39.0509L22.7094 39.8647L28.5469 44.0343L29.1281 43.2206ZM30.6864 43.3338C30.1868 43.5909 29.5854 43.5472 29.1281 43.2206L28.5469 44.0343C29.3089 44.5786 30.3113 44.6514 31.144 44.2229L30.6864 43.3338ZM31.5 42C31.5 42.5619 31.186 43.0766 30.6864 43.3338L31.144 44.2229C31.9766 43.7944 32.5 42.9365 32.5 42H31.5ZM31.5 4V42H32.5V4H31.5ZM28 0.5C29.933 0.5 31.5 2.06702 31.5 4H32.5C32.5 1.51474 30.4853 -0.5 28 -0.5V0.5ZM4 0.5H28V-0.5H4V0.5Z'
|
||||
fill='url(#paint1_linear_5711_271152)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id='paint0_linear_5711_271152'
|
||||
x1={32}
|
||||
y1={-0.0000013113}
|
||||
x2={-9.85947}
|
||||
y2={30.4432}
|
||||
gradientUnits='userSpaceOnUse'
|
||||
>
|
||||
<stop stopColor='#1DA4FC' stopOpacity={0.33} />
|
||||
<stop offset={1} stopColor='#1DA4FC' stopOpacity={0.17} />
|
||||
</linearGradient>
|
||||
<linearGradient
|
||||
id='paint1_linear_5711_271152'
|
||||
x1={-2.62633e-7}
|
||||
y1={44}
|
||||
x2={43.3777}
|
||||
y2={14.03}
|
||||
gradientUnits='userSpaceOnUse'
|
||||
>
|
||||
<stop stopColor='#7CC9FF' />
|
||||
<stop offset={0.296875} stopColor='#7CC9FF' stopOpacity={0.65} />
|
||||
<stop offset={0.493296} stopColor='#E7F4FE' />
|
||||
<stop offset={0.708333} stopColor='#82C1FD' stopOpacity={0.78} />
|
||||
<stop offset={1} stopColor='#82C1FD' />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(UnionIcon);
|
||||
export { Memo as UnionIcon };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 16 4' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0 2C0 0.89543 0.89543 0 2 0H14C15.1046 0 16 0.89543 16 2C16 3.10457 15.1046 4 14 4H2C0.89543 4 0 3.10457 0 2Z'
|
||||
fill='white'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon);
|
||||
export { Memo as VectorStrokeIcon };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 16 4' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0 2C0 0.89543 0.89543 0 2 0H14C15.1046 0 16 0.89543 16 2C16 3.10457 15.1046 4 14 4H2C0.89543 4 0 3.10457 0 2Z'
|
||||
fill='white'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon2);
|
||||
export { Memo as VectorStrokeIcon2 };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon3 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 16 4' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0 2C0 0.89543 0.89543 0 2 0H14C15.1046 0 16 0.89543 16 2C16 3.10457 15.1046 4 14 4H2C0.89543 4 0 3.10457 0 2Z'
|
||||
fill='white'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon3);
|
||||
export { Memo as VectorStrokeIcon3 };
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
.root {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
place-content: center;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 5px 14px;
|
||||
border-radius: 4px;
|
||||
background-color: #06f;
|
||||
}
|
||||
.text {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import { memo } from "react";
|
||||
import type { FC, ReactNode } from "react";
|
||||
|
||||
import resets from "../../_resets.module.css";
|
||||
import { _2 } from "../_2/_2";
|
||||
import { Unnamed } from "../unnamed/unnamed";
|
||||
import classes from "./Button_PrimaryDefaultRegular.module.css";
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
text?: {
|
||||
text?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5403:1599 */
|
||||
export const Button_PrimaryDefaultRegular: FC<Props> = memo(
|
||||
function Button_PrimaryDefaultRegular(props = {}) {
|
||||
return (
|
||||
<button className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
{props.text?.text != null ? (
|
||||
props.text?.text
|
||||
) : (
|
||||
<div className={classes.text}>Default</div>
|
||||
)}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
);
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
.root {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
place-content: center;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 7px 18px;
|
||||
border-radius: 4px;
|
||||
background-color: #06f;
|
||||
}
|
||||
.text {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import { memo } from "react";
|
||||
import type { FC, ReactNode } from "react";
|
||||
|
||||
import resets from "../../_resets.module.css";
|
||||
import { _2 } from "../_2/_2";
|
||||
import { Unnamed } from "../unnamed/unnamed";
|
||||
import classes from "./Button_PrimaryLargeRegular.module.css";
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
text?: {
|
||||
text?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5403:1551 */
|
||||
export const Button_PrimaryLargeRegular: FC<Props> = memo(
|
||||
function Button_PrimaryLargeRegular(props = {}) {
|
||||
return (
|
||||
<button className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
{props.text?.text != null ? (
|
||||
props.text?.text
|
||||
) : (
|
||||
<div className={classes.text}>Large</div>
|
||||
)}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
);
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
.root {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
place-content: center;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 5px 8px;
|
||||
outline: solid 1px #5249e3;
|
||||
outline-offset: -1px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.Label {
|
||||
color: #5249e3;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
font-family: PingFang SC, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
z-index: 0;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import { IconBasicDropdownChevronDown } from '../IconBasicDropdownChevronDown/IconBasicDropdownChevronDown';
|
||||
import classes from './Button_Property1SecondarybtnPr.module.css';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
iconBasicDropdownChevronDown?: string;
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
iconBackStroke?: ReactNode;
|
||||
};
|
||||
hide?: {
|
||||
iconBasicDropdownChevronDown?: boolean;
|
||||
};
|
||||
text?: {
|
||||
Label?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5415:8096 */
|
||||
export const Button_Property1SecondarybtnPr: FC<Props> = memo(function Button_Property1SecondarybtnPr(props = {}) {
|
||||
return (
|
||||
<button
|
||||
className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}
|
||||
>
|
||||
{props.text?.Label != null ? props.text?.Label : <div className={classes.Label}>Button</div>}
|
||||
{props.hide?.iconBasicDropdownChevronDown === false && (
|
||||
<IconBasicDropdownChevronDown
|
||||
className={props.classes?.iconBasicDropdownChevronDown || ''}
|
||||
swap={{
|
||||
iconBackStroke: props.swap?.iconBackStroke,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</button>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
.root {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
place-content: center;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 5px 14px;
|
||||
outline: solid 1px #dcdcdc;
|
||||
outline-offset: -1px;
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.text {
|
||||
color: #1d2129;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
z-index: 0;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import { memo } from "react";
|
||||
import type { FC, ReactNode } from "react";
|
||||
|
||||
import resets from "../../_resets.module.css";
|
||||
import { _2 } from "../_2/_2";
|
||||
import { Unnamed } from "../unnamed/unnamed";
|
||||
import classes from "./Button_TertiaryDefaultRegular.module.css";
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
text?: {
|
||||
text?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5403:1755 */
|
||||
export const Button_TertiaryDefaultRegular: FC<Props> = memo(
|
||||
function Button_TertiaryDefaultRegular(props = {}) {
|
||||
return (
|
||||
<button className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
{props.text?.text != null ? (
|
||||
props.text?.text
|
||||
) : (
|
||||
<div className={classes.text}>Default</div>
|
||||
)}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
);
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.rectangle224 {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
outline: solid 1px #c5c7d0;
|
||||
outline-offset: -1px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Checkbox_Property1WithoutLabel.module.css';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
}
|
||||
/* @figmaId 5401:45034 */
|
||||
export const Checkbox_Property1WithoutLabel: FC<Props> = memo(function Checkbox_Property1WithoutLabel(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.rectangle224}></div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.union {
|
||||
position: absolute;
|
||||
left: 1px;
|
||||
top: 2px;
|
||||
width: 22px;
|
||||
height: 19.5px;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Comment.module.css';
|
||||
import { UnionIcon } from './UnionIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
union?: string;
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
union?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5412:3617 */
|
||||
export const Comment: FC<Props> = memo(function Comment(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={`${props.classes?.union || ''} ${classes.union}`}>
|
||||
{props.swap?.union || <UnionIcon className={classes.icon} />}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const UnionIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 22 20' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M1 0C0.447715 0 0 0.447715 0 1V16C0 16.5523 0.447715 17 1 17H4.5V18.5C4.5 18.8466 4.67945 19.1684 4.97427 19.3507C5.26909 19.5329 5.63723 19.5494 5.94721 19.3944L10.7361 17H21C21.5523 17 22 16.5523 22 16V1C22 0.447715 21.5523 0 21 0H1ZM2 15V2H20V15H10.5C10.3448 15 10.1916 15.0361 10.0528 15.1056L6.5 16.882V16C6.5 15.4477 6.05228 15 5.5 15H2ZM7 7.75C7 7.19772 6.55228 6.75 6 6.75C5.44772 6.75 5 7.19772 5 7.75V9.25C5 9.80228 5.44772 10.25 6 10.25C6.55228 10.25 7 9.80228 7 9.25V7.75ZM11 6.75C11.5523 6.75 12 7.19772 12 7.75V9.25C12 9.80228 11.5523 10.25 11 10.25C10.4477 10.25 10 9.80228 10 9.25V7.75C10 7.19772 10.4477 6.75 11 6.75ZM17 7.75C17 7.19772 16.5523 6.75 16 6.75C15.4477 6.75 15 7.19772 15 7.75V9.25C15 9.80228 15.4477 10.25 16 10.25C16.5523 10.25 17 9.80228 17 9.25V7.75Z'
|
||||
fill='black'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(UnionIcon);
|
||||
export { Memo as UnionIcon };
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.vector {
|
||||
position: absolute;
|
||||
left: 25%;
|
||||
right: 25%;
|
||||
top: 39.5833%;
|
||||
bottom: 35.4167%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke {
|
||||
position: absolute;
|
||||
left: 20.8333%;
|
||||
right: 20.8331%;
|
||||
top: 35.4167%;
|
||||
bottom: 31.25%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon2 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './DownOne1.module.css';
|
||||
import { VectorIcon } from './VectorIcon.js';
|
||||
import { VectorStrokeIcon } from './VectorStrokeIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
vector?: ReactNode;
|
||||
vectorStroke?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5403:2777 */
|
||||
export const DownOne1: FC<Props> = memo(function DownOne1(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={classes.vector}>{props.swap?.vector || <VectorIcon className={classes.icon} />}</div>
|
||||
<div className={classes.vectorStroke}>
|
||||
{props.swap?.vectorStroke || <VectorStrokeIcon className={classes.icon2} />}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 12 7' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path d='M12 0.5L6 6.5L0 0.5H12Z' fill='#1D2129' />
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorIcon);
|
||||
export { Memo as VectorIcon };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 14 9' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0.0761497 1.11732C0.230931 0.743642 0.595567 0.5 1.00003 0.5H13C13.4045 0.5 13.7691 0.743642 13.9239 1.11732C14.0787 1.49099 13.9931 1.92111 13.7071 2.20711L7.70714 8.20711C7.31661 8.59763 6.68345 8.59763 6.29292 8.20711L0.292922 2.20711C0.00692445 1.92111 -0.0786313 1.49099 0.0761497 1.11732ZM3.41424 2.5L7.00003 6.08579L10.5858 2.5H3.41424Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon);
|
||||
export { Memo as VectorStrokeIcon };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse10Icon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C111.884 2.60968e-07 133.019 7.9738 149.449 22.4295C165.88 36.8851 176.48 56.8321 179.267 78.5383C182.054 100.244 176.837 122.222 164.591 140.36C152.346 158.498 133.911 171.552 112.737 177.081C91.5623 182.609 69.0988 180.233 49.5495 170.397C30.0001 160.562 14.7043 143.94 6.52399 123.642C-1.65627 103.344 -2.16049 80.7605 5.10569 60.1176C12.3719 39.4748 26.9106 22.1867 46.0015 11.488L59.201 35.0416C45.8374 42.5307 35.6603 54.6324 30.574 69.0823C25.4877 83.5323 25.8406 99.3405 31.5668 113.549C37.293 127.758 48 139.393 61.6846 146.278C75.3692 153.163 91.0936 154.827 105.916 150.956C120.738 147.086 133.642 137.948 142.214 125.252C150.786 112.556 154.438 97.1711 152.487 81.9768C150.536 66.7825 143.116 52.8196 131.615 42.7006C120.113 32.5817 105.319 27 90 27L90 0Z'
|
||||
fill='#4E5969'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse10Icon);
|
||||
export { Memo as Ellipse10Icon };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse10Icon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C111.884 2.60968e-07 133.019 7.9738 149.449 22.4295C165.88 36.8851 176.48 56.8321 179.267 78.5383C182.054 100.244 176.837 122.222 164.591 140.36C152.346 158.498 133.911 171.552 112.737 177.081C91.5623 182.609 69.0988 180.233 49.5495 170.397C30.0001 160.562 14.7043 143.94 6.52399 123.642C-1.65627 103.344 -2.16049 80.7605 5.10569 60.1176C12.3719 39.4748 26.9106 22.1867 46.0015 11.488L59.201 35.0416C45.8374 42.5307 35.6603 54.6324 30.574 69.0823C25.4877 83.5323 25.8406 99.3405 31.5668 113.549C37.293 127.758 48 139.393 61.6846 146.278C75.3692 153.163 91.0936 154.827 105.916 150.956C120.738 147.086 133.642 137.948 142.214 125.252C150.786 112.556 154.438 97.1711 152.487 81.9768C150.536 66.7825 143.116 52.8196 131.615 42.7006C120.113 32.5817 105.319 27 90 27L90 0Z'
|
||||
fill='#4E5969'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse10Icon2);
|
||||
export { Memo as Ellipse10Icon2 };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse11Icon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C112.877 2.7281e-07 134.896 8.71216 151.58 24.3654C168.264 40.0185 178.36 61.4378 179.817 84.2687C181.274 107.1 173.982 129.629 159.423 147.275C144.864 164.922 124.131 176.362 101.439 179.27C78.7475 182.178 55.7999 176.335 37.2618 162.929C18.7237 149.524 5.9865 129.561 1.63959 107.101C-2.70732 84.6403 1.66236 61.3672 13.8603 42.0131C26.0582 22.6589 45.1688 8.67633 67.307 2.90793L74.1149 29.0356C58.6182 33.0734 45.2408 42.8612 36.7022 56.4091C28.1637 69.9571 25.1049 86.2482 28.1477 101.971C31.1906 117.693 40.1066 131.667 53.0833 141.051C66.06 150.434 82.1232 154.524 98.0075 152.489C113.892 150.454 128.405 142.445 138.596 130.093C148.787 117.74 153.892 101.97 152.872 85.9881C151.852 70.0065 144.785 55.013 133.106 44.0557C121.427 33.0985 106.014 27 90 27L90 0Z'
|
||||
fill='#F3C641'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse11Icon);
|
||||
export { Memo as Ellipse11Icon };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse11Icon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C112.877 2.7281e-07 134.896 8.71216 151.58 24.3654C168.264 40.0185 178.36 61.4378 179.817 84.2687C181.274 107.1 173.982 129.629 159.423 147.275C144.864 164.922 124.131 176.362 101.439 179.27C78.7475 182.178 55.7999 176.335 37.2618 162.929C18.7237 149.524 5.9865 129.561 1.63959 107.101C-2.70732 84.6403 1.66236 61.3672 13.8603 42.0131C26.0582 22.6589 45.1688 8.67633 67.307 2.90793L74.1149 29.0356C58.6182 33.0734 45.2408 42.8612 36.7022 56.4091C28.1637 69.9571 25.1049 86.2482 28.1477 101.971C31.1906 117.693 40.1066 131.667 53.0833 141.051C66.06 150.434 82.1232 154.524 98.0075 152.489C113.892 150.454 128.405 142.445 138.596 130.093C148.787 117.74 153.892 101.97 152.872 85.9881C151.852 70.0065 144.785 55.013 133.106 44.0557C121.427 33.0985 106.014 27 90 27L90 0Z'
|
||||
fill='#F3C641'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse11Icon2);
|
||||
export { Memo as Ellipse11Icon2 };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse6Icon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M180 90C180 139.706 139.706 180 90 180C40.2944 180 0 139.706 0 90C0 40.2944 40.2944 0 90 0C139.706 0 180 40.2944 180 90ZM27 90C27 124.794 55.2061 153 90 153C124.794 153 153 124.794 153 90C153 55.2061 124.794 27 90 27C55.2061 27 27 55.2061 27 90Z'
|
||||
fill='#F53F3F'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse6Icon);
|
||||
export { Memo as Ellipse6Icon };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse6Icon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M180 90C180 139.706 139.706 180 90 180C40.2944 180 0 139.706 0 90C0 40.2944 40.2944 0 90 0C139.706 0 180 40.2944 180 90ZM27 90C27 124.794 55.2061 153 90 153C124.794 153 153 124.794 153 90C153 55.2061 124.794 27 90 27C55.2061 27 27 55.2061 27 90Z'
|
||||
fill='#F53F3F'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse6Icon2);
|
||||
export { Memo as Ellipse6Icon2 };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse6Icon3 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M180 90C180 139.706 139.706 180 90 180C40.2944 180 0 139.706 0 90C0 40.2944 40.2944 0 90 0C139.706 0 180 40.2944 180 90ZM27 90C27 124.794 55.2061 153 90 153C124.794 153 153 124.794 153 90C153 55.2061 124.794 27 90 27C55.2061 27 27 55.2061 27 90Z'
|
||||
fill='#4E5969'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse6Icon3);
|
||||
export { Memo as Ellipse6Icon3 };
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse7Icon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 190 190' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
opacity={0.2}
|
||||
d='M95 0C117.62 2.69738e-07 139.497 8.07105 156.698 22.7614C173.898 37.4518 185.292 57.7974 188.83 80.1387C192.369 102.48 187.82 125.351 176.001 144.637C164.182 163.924 145.869 178.36 124.357 185.35L112.614 149.21C125.522 145.016 136.509 136.354 143.6 124.782C150.692 113.21 153.421 99.488 151.298 86.0832C149.175 72.6785 142.339 60.4711 132.019 51.6569C121.698 42.8426 108.572 38 95 38L95 0Z'
|
||||
fill='url(#paint0_angular_5711_269762)'
|
||||
/>
|
||||
<defs>
|
||||
<radialGradient
|
||||
id='paint0_angular_5711_269762'
|
||||
cx={0}
|
||||
cy={0}
|
||||
r={1}
|
||||
gradientUnits='userSpaceOnUse'
|
||||
gradientTransform='translate(95 95) rotate(90) scale(95)'
|
||||
>
|
||||
<stop offset={0.505193} stopColor='#165DFF' />
|
||||
<stop offset={0.874606} stopColor='#0E42D2' />
|
||||
</radialGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse7Icon);
|
||||
export { Memo as Ellipse7Icon };
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse7Icon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 190 190' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
opacity={0.2}
|
||||
d='M95 0C117.62 2.69738e-07 139.497 8.07105 156.698 22.7614C173.898 37.4518 185.292 57.7974 188.83 80.1387C192.369 102.48 187.82 125.351 176.001 144.637C164.182 163.924 145.869 178.36 124.357 185.35L112.614 149.21C125.522 145.016 136.509 136.354 143.6 124.782C150.692 113.21 153.421 99.488 151.298 86.0832C149.175 72.6785 142.339 60.4711 132.019 51.6569C121.698 42.8426 108.572 38 95 38L95 0Z'
|
||||
fill='url(#paint0_angular_5711_270234)'
|
||||
/>
|
||||
<defs>
|
||||
<radialGradient
|
||||
id='paint0_angular_5711_270234'
|
||||
cx={0}
|
||||
cy={0}
|
||||
r={1}
|
||||
gradientUnits='userSpaceOnUse'
|
||||
gradientTransform='translate(95 95) rotate(90) scale(95)'
|
||||
>
|
||||
<stop offset={0.505193} stopColor='#165DFF' />
|
||||
<stop offset={0.874606} stopColor='#0E42D2' />
|
||||
</radialGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse7Icon2);
|
||||
export { Memo as Ellipse7Icon2 };
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse7Icon3 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 190 190' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
opacity={0.2}
|
||||
d='M95 0C117.62 2.69738e-07 139.497 8.07105 156.698 22.7614C173.898 37.4518 185.292 57.7974 188.83 80.1387C192.369 102.48 187.82 125.351 176.001 144.637C164.182 163.924 145.869 178.36 124.357 185.35L112.614 149.21C125.522 145.016 136.509 136.354 143.6 124.782C150.692 113.21 153.421 99.488 151.298 86.0832C149.175 72.6785 142.339 60.4711 132.019 51.6569C121.698 42.8426 108.572 38 95 38L95 0Z'
|
||||
fill='url(#paint0_angular_5711_270320)'
|
||||
/>
|
||||
<defs>
|
||||
<radialGradient
|
||||
id='paint0_angular_5711_270320'
|
||||
cx={0}
|
||||
cy={0}
|
||||
r={1}
|
||||
gradientUnits='userSpaceOnUse'
|
||||
gradientTransform='translate(95 95) rotate(90) scale(95)'
|
||||
>
|
||||
<stop offset={0.505193} stopColor='#165DFF' />
|
||||
<stop offset={0.874606} stopColor='#0E42D2' />
|
||||
</radialGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse7Icon3);
|
||||
export { Memo as Ellipse7Icon3 };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse8Icon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C111.429 2.55542e-07 132.155 7.64626 148.45 21.5635C164.745 35.4807 175.54 54.7555 178.892 75.9209C182.244 97.0864 177.934 118.753 166.738 137.025C155.541 155.296 138.192 168.973 117.812 175.595L109.468 149.917C123.734 145.281 135.879 135.707 143.716 122.917C151.554 110.127 154.571 94.9605 152.224 80.1446C149.878 65.3288 142.322 51.8365 130.915 42.0944C119.509 32.3524 105 27 90 27L90 0Z'
|
||||
fill='#0066FF'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse8Icon);
|
||||
export { Memo as Ellipse8Icon };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse8Icon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C111.429 2.55542e-07 132.155 7.64626 148.45 21.5635C164.745 35.4807 175.54 54.7555 178.892 75.9209C182.244 97.0864 177.934 118.753 166.738 137.025C155.541 155.296 138.192 168.973 117.812 175.595L109.468 149.917C123.734 145.281 135.879 135.707 143.716 122.917C151.554 110.127 154.571 94.9605 152.224 80.1446C149.878 65.3288 142.322 51.8365 130.915 42.0944C119.509 32.3524 105 27 90 27L90 0Z'
|
||||
fill='#0066FF'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse8Icon2);
|
||||
export { Memo as Ellipse8Icon2 };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse8Icon3 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C111.429 2.55542e-07 132.155 7.64626 148.45 21.5635C164.745 35.4807 175.54 54.7555 178.892 75.9209C182.244 97.0864 177.934 118.753 166.738 137.025C155.541 155.296 138.192 168.973 117.812 175.595L109.468 149.917C123.734 145.281 135.879 135.707 143.716 122.917C151.554 110.127 154.571 94.9605 152.224 80.1446C149.878 65.3288 142.322 51.8365 130.915 42.0944C119.509 32.3524 105 27 90 27L90 0Z'
|
||||
fill='#0066FF'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse8Icon3);
|
||||
export { Memo as Ellipse8Icon3 };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse9Icon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C108.093 2.1576e-07 125.766 5.45341 140.714 15.6487C155.661 25.844 167.188 40.3078 173.792 57.153C180.395 73.9982 181.768 92.4427 177.731 110.08C173.695 127.717 164.436 143.728 151.162 156.024C137.889 168.32 121.218 176.33 103.324 179.008C85.4303 181.687 67.1445 178.91 50.8525 171.04C34.5606 163.17 21.0189 150.572 11.9944 134.89C2.96983 119.208 -1.11856 101.17 0.262606 83.1298L27.1838 85.1908C26.217 97.8192 29.0789 110.446 35.3961 121.423C41.7132 132.4 51.1924 141.219 62.5968 146.728C74.0012 152.237 86.8012 154.181 99.327 152.306C111.853 150.431 123.522 144.824 132.814 136.217C142.105 127.61 148.586 116.402 151.412 104.056C154.238 91.7099 153.277 78.7988 148.654 67.0071C144.032 55.2155 135.963 45.0908 125.5 37.9541C115.037 30.8174 102.665 27 90 27L90 0Z'
|
||||
fill='#3BB346'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse9Icon);
|
||||
export { Memo as Ellipse9Icon };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse9Icon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C108.093 2.1576e-07 125.766 5.45341 140.714 15.6487C155.661 25.844 167.188 40.3078 173.792 57.153C180.395 73.9982 181.768 92.4427 177.731 110.08C173.695 127.717 164.436 143.728 151.162 156.024C137.889 168.32 121.218 176.33 103.324 179.008C85.4303 181.687 67.1445 178.91 50.8525 171.04C34.5606 163.17 21.0189 150.572 11.9944 134.89C2.96983 119.208 -1.11856 101.17 0.262606 83.1298L27.1838 85.1908C26.217 97.8192 29.0789 110.446 35.3961 121.423C41.7132 132.4 51.1924 141.219 62.5968 146.728C74.0012 152.237 86.8012 154.181 99.327 152.306C111.853 150.431 123.522 144.824 132.814 136.217C142.105 127.61 148.586 116.402 151.412 104.056C154.238 91.7099 153.277 78.7988 148.654 67.0071C144.032 55.2155 135.963 45.0908 125.5 37.9541C115.037 30.8174 102.665 27 90 27L90 0Z'
|
||||
fill='#3BB346'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse9Icon2);
|
||||
export { Memo as Ellipse9Icon2 };
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const Ellipse9Icon3 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 180 180' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M90 0C107.192 2.05017e-07 124.025 4.92429 138.507 14.1903C152.988 23.4564 164.513 36.6764 171.717 52.2865C178.921 67.8966 181.504 85.2436 179.159 102.275C176.814 119.307 169.64 135.311 158.485 148.393C147.331 161.476 132.662 171.089 116.215 176.097C99.7686 181.105 82.2315 181.297 65.6788 176.651C49.1261 172.005 34.2504 162.716 22.8116 149.881C11.3728 137.046 3.84948 121.204 1.13167 104.227L27.7922 99.9592C29.6946 111.843 34.961 122.932 42.9681 131.917C50.9753 140.901 61.3883 147.404 72.9752 150.656C84.5621 153.908 96.838 153.774 108.351 150.268C119.864 146.763 130.131 140.033 137.94 130.875C145.748 121.717 150.77 110.515 152.411 98.5927C154.053 86.6705 152.245 74.5276 147.202 63.6006C142.159 52.6735 134.092 43.4195 123.955 36.9332C113.818 30.447 102.035 27 90 27L90 0Z'
|
||||
fill='#3BB346'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(Ellipse9Icon3);
|
||||
export { Memo as Ellipse9Icon3 };
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
overflow: hidden;
|
||||
}
|
||||
.vector2 {
|
||||
position: absolute;
|
||||
left: 8.3333%;
|
||||
right: 8.3333%;
|
||||
top: 12.5%;
|
||||
bottom: 12.5%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame.module.css';
|
||||
import { VectorIcon } from './VectorIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
vector?: string;
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
vector?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5524:24083 */
|
||||
export const Frame: FC<Props> = memo(function Frame(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={classes.vector2}>{props.swap?.vector || <VectorIcon className={classes.icon} />}</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M20 8V17C20 17.2652 19.8946 17.5196 19.7071 17.7071C19.5196 17.8946 19.2652 18 19 18H1C0.734784 18 0.48043 17.8946 0.292893 17.7071C0.105357 17.5196 0 17.2652 0 17V8H20ZM20 6H0V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0H8.414L10.414 2H19C19.2652 2 19.5196 2.10536 19.7071 2.29289C19.8946 2.48043 20 2.73478 20 3V6Z'
|
||||
fill='black'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorIcon);
|
||||
export { Memo as VectorIcon };
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
overflow: hidden;
|
||||
}
|
||||
.vector2 {
|
||||
position: absolute;
|
||||
left: 8.3333%;
|
||||
right: 8.3333%;
|
||||
top: 12.5%;
|
||||
bottom: 12.5%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame2.module.css';
|
||||
import { VectorIcon } from './VectorIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
vector?: string;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5524:23922 */
|
||||
export const Frame2: FC<Props> = memo(function Frame2(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.vector2}>
|
||||
<VectorIcon className={classes.icon} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M0 0.993C0.00183004 0.730378 0.1069 0.479017 0.292513 0.293218C0.478126 0.107418 0.72938 0.00209465 0.992 0H19.008C19.556 0 20 0.445 20 0.993V17.007C19.9982 17.2696 19.8931 17.521 19.7075 17.7068C19.5219 17.8926 19.2706 17.9979 19.008 18H0.992C0.728813 17.9997 0.476497 17.895 0.290489 17.7088C0.104482 17.5226 -1.33455e-07 17.2702 0 17.007V0.993ZM4 12V14H16V12H4ZM4 4V10H10V4H4ZM12 4V6H16V4H12ZM12 8V10H16V8H12ZM6 6H8V8H6V6Z'
|
||||
fill='#0066FF'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorIcon);
|
||||
export { Memo as VectorIcon };
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
overflow: hidden;
|
||||
}
|
||||
.vectorStroke {
|
||||
position: absolute;
|
||||
left: 4.1667%;
|
||||
right: 4.1667%;
|
||||
top: 4.1667%;
|
||||
bottom: 4.1667%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke2 {
|
||||
position: absolute;
|
||||
left: 29.1667%;
|
||||
right: 25%;
|
||||
top: 33.3333%;
|
||||
bottom: 33.3333%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon2 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame3.module.css';
|
||||
import { VectorStrokeIcon2 } from './VectorStrokeIcon2.js';
|
||||
import { VectorStrokeIcon } from './VectorStrokeIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
vectorStroke?: ReactNode;
|
||||
vectorStroke2?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5403:957 */
|
||||
export const Frame3: FC<Props> = memo(function Frame3(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={classes.vectorStroke}>
|
||||
{props.swap?.vectorStroke || <VectorStrokeIcon className={classes.icon} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke2}>
|
||||
{props.swap?.vectorStroke2 || <VectorStrokeIcon2 className={classes.icon2} />}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 22 22' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M3.22183 3.22182C5.21136 1.23232 7.96273 0 11 0C14.0373 0 16.7886 1.23231 18.7782 3.22182L18.0711 3.92893L18.7782 3.22183C20.7677 5.21136 22 7.96273 22 11C22 14.0373 20.7677 16.7886 18.7782 18.7782C16.7886 20.7677 14.0373 22 11 22C7.96273 22 5.21136 20.7677 3.22183 18.7782L3.92893 18.0711L3.22182 18.7782C1.23231 16.7886 0 14.0373 0 11C0 7.96273 1.23232 5.21136 3.22182 3.22183L3.22183 3.22182ZM11 2C8.51447 2 6.26584 3.00626 4.63603 4.63604C3.00625 6.26585 2 8.51447 2 11C2 13.4855 3.00627 15.7342 4.63604 17.3639C6.26584 18.9937 8.51447 20 11 20C13.4855 20 15.7342 18.9937 17.3639 17.3639C18.9937 15.7342 20 13.4855 20 11C20 8.51447 18.9937 6.26584 17.3639 4.63604C15.7342 3.00627 13.4855 2 11 2Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon);
|
||||
export { Memo as VectorStrokeIcon };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 11 8' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M10.7071 0.292893C11.0976 0.683417 11.0976 1.31658 10.7071 1.70711L4.70711 7.70711C4.31658 8.09763 3.68342 8.09763 3.29289 7.70711L0.292893 4.70711C-0.0976311 4.31658 -0.0976311 3.68342 0.292893 3.29289C0.683417 2.90237 1.31658 2.90237 1.70711 3.29289L4 5.58579L9.29289 0.292893C9.68342 -0.0976311 10.3166 -0.0976311 10.7071 0.292893Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon2);
|
||||
export { Memo as VectorStrokeIcon2 };
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
overflow: hidden;
|
||||
}
|
||||
.subtract {
|
||||
position: absolute;
|
||||
left: 2.2041px;
|
||||
top: 0.9795px;
|
||||
width: 19.5918px;
|
||||
height: 22.0411px;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame4.module.css';
|
||||
import { SubtractIcon } from './SubtractIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
}
|
||||
/* @figmaId 5403:1009 */
|
||||
export const Frame4: FC<Props> = memo(function Frame4(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.subtract}>
|
||||
<SubtractIcon className={classes.icon} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const SubtractIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 20 24' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M9.7298 1.01872C9.9091 0.966392 10.0996 0.966417 10.2789 1.01879L19.091 3.59298C19.5088 3.71502 19.7959 4.09805 19.7959 4.53327V9.81233C19.7959 15.7827 15.9751 21.083 10.311 22.9703C10.11 23.0373 9.8927 23.0373 9.69171 22.9703C4.02605 21.0831 0.204102 15.7816 0.204102 9.80988V4.53327C0.204102 4.09796 0.491373 3.71487 0.909257 3.59291L9.7298 1.01872ZM15.5907 9.50894C15.9733 9.12638 15.9733 8.50614 15.5907 8.12359C15.2081 7.74103 14.5879 7.74103 14.2053 8.12359L9.02047 13.3085L6.28457 10.5726C5.90202 10.19 5.28177 10.19 4.89922 10.5726C4.51667 10.9551 4.51667 11.5754 4.89922 11.9579L8.32779 15.3865C8.71035 15.769 9.33059 15.769 9.71314 15.3865L15.5907 9.50894Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(SubtractIcon);
|
||||
export { Memo as SubtractIcon };
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
.root {
|
||||
width: 512px;
|
||||
height: min-content;
|
||||
place-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
._2022613 {
|
||||
color: #1d2129;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: 329px;
|
||||
height: 20px;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
._20226132 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame427319454.module.css';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
root?: string;
|
||||
};
|
||||
text?: {
|
||||
_2022613?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5521:23755 */
|
||||
export const Frame427319454: FC<Props> = memo(function Frame427319454(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
{props.text?._2022613 != null ? (
|
||||
props.text?._2022613
|
||||
) : (
|
||||
<div className={classes._2022613}>战略合作协议汇总及执行情况表(截止到2022年6月13日)</div>
|
||||
)}
|
||||
<div className={classes._20226132}>2022-06-13</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
.vector.vector {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.root {
|
||||
height: min-content;
|
||||
align-self: stretch;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
background-color: #0066ff0f;
|
||||
}
|
||||
.frame427319466 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
padding: 12px;
|
||||
border-radius: 8px;
|
||||
background-color: #ffffff8a;
|
||||
}
|
||||
.frame427319463 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
}
|
||||
.license {
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319462 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
}
|
||||
.unnamed {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._2023326 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import { Frame2 } from '../Frame2/Frame2';
|
||||
import classes from './Frame427319464.module.css';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
text?: {
|
||||
license?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5524:23894 */
|
||||
export const Frame427319464: FC<Props> = memo(function Frame427319464(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.frame427319466}>
|
||||
<Frame2 classes={{ vector: classes.vector }} />
|
||||
</div>
|
||||
<div className={classes.frame427319463}>
|
||||
{props.text?.license != null ? props.text?.license : <div className={classes.license}>License授权到期提醒</div>}
|
||||
<div className={classes.frame427319462}>
|
||||
<div className={classes.unnamed}>系统管理员</div>
|
||||
<div className={classes._2023326}>2023-03-26</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
.frame.frame {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
}
|
||||
.vector.vector {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.root {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
.frame427319470 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
padding: 28px;
|
||||
border-radius: 12px;
|
||||
background-color: #f7f8fa;
|
||||
overflow: hidden;
|
||||
}
|
||||
.unnamed {
|
||||
color: #1d2129;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
import { memo } from "react";
|
||||
import type { FC, ReactNode } from "react";
|
||||
|
||||
import resets from "../../_resets.module.css";
|
||||
import { Frame6 } from "../Frame6/Frame6";
|
||||
import classes from "./Frame427319471.module.css";
|
||||
import { VectorIcon } from "./VectorIcon.js";
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
swap?: {
|
||||
vector?: ReactNode;
|
||||
frame?: ReactNode;
|
||||
};
|
||||
text?: {
|
||||
Unnamed?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5524:24104 */
|
||||
export const Frame427319471: FC<Props> = memo(function Frame427319471(
|
||||
props = {}
|
||||
) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.frame427319470}>
|
||||
{props.swap?.frame || (
|
||||
<Frame6
|
||||
className={classes.frame}
|
||||
classes={{ vector: classes.vector }}
|
||||
swap={{
|
||||
vector: props.swap?.vector || (
|
||||
<VectorIcon className={classes.icon} />
|
||||
),
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
{props.text?.unnamed != null ? (
|
||||
props.text?.unnamed
|
||||
) : (
|
||||
<div className={classes.unnamed}>项目商机登记表</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 36 32' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M2.25 0.25H33.75C34.2141 0.25 34.6592 0.434374 34.9874 0.762563C35.3156 1.09075 35.5 1.53587 35.5 2V30C35.5 30.4641 35.3156 30.9092 34.9874 31.2374C34.6592 31.5656 34.2141 31.75 33.75 31.75H2.25C1.78587 31.75 1.34075 31.5656 1.01256 31.2374C0.684374 30.9092 0.5 30.4641 0.5 30V2C0.5 1.53587 0.684374 1.09075 1.01256 0.762563C1.34075 0.434374 1.78587 0.25 2.25 0.25ZM19.75 17.75V16H25V12.5H20.4745L24.188 8.78825L21.7118 6.312L18 10.0255L14.2882 6.312L11.812 8.79L15.5255 12.5H11V16H16.25V17.75H11V21.25H16.25V24.75H19.75V21.25H25V17.75H19.75Z'
|
||||
fill='url(#paint0_linear_5711_271080)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id='paint0_linear_5711_271080'
|
||||
x1={18}
|
||||
y1={0.25}
|
||||
x2={18}
|
||||
y2={31.75}
|
||||
gradientUnits='userSpaceOnUse'
|
||||
>
|
||||
<stop stopColor='#589BFF' />
|
||||
<stop offset={1} stopColor='#0066FF' />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorIcon);
|
||||
export { Memo as VectorIcon };
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
.vector.vector {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.root {
|
||||
height: min-content;
|
||||
align-self: stretch;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
border-radius: 8px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.frame427319497 {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
flex-direction: column;
|
||||
place-content: center;
|
||||
align-items: center;
|
||||
padding: 2px;
|
||||
border-radius: 2px;
|
||||
background-color: #0066ff0f;
|
||||
}
|
||||
._1 {
|
||||
color: #06f;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
font-weight: bold;
|
||||
font-family: DIN Alternate, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319463 {
|
||||
height: min-content;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
}
|
||||
._2023326 {
|
||||
color: #1d2129;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._12 {
|
||||
color: #1d2129;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
height: min-content;
|
||||
align-self: stretch;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import { Frame2 } from '../Frame2/Frame2';
|
||||
import classes from './Frame427319482.module.css';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
text?: {
|
||||
_1?: ReactNode;
|
||||
_12?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5527:24141 */
|
||||
export const Frame427319482: FC<Props> = memo(function Frame427319482(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.frame427319497}>
|
||||
{props.text?._12 != null ? props.text?._12 : <div className={classes._1}>1</div>}
|
||||
</div>
|
||||
<div className={classes.frame427319463}>
|
||||
<div className={classes._2023326}>2023-03-26</div>
|
||||
{props.text?._1 != null ? props.text?._1 : <div className={classes._12}>工作计划1</div>}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,110 @@
|
|||
.vector.vector {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.root {
|
||||
height: min-content;
|
||||
align-self: stretch;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
}
|
||||
.frame427319497 {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
flex-direction: column;
|
||||
place-content: center;
|
||||
align-items: center;
|
||||
padding: 2px;
|
||||
border-radius: 2px;
|
||||
background-color: #0066ff0f;
|
||||
}
|
||||
._1 {
|
||||
color: #06f;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
font-weight: bold;
|
||||
font-family: DIN Alternate, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319463 {
|
||||
height: min-content;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
}
|
||||
._2023326 {
|
||||
color: #06f;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._12 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
height: min-content;
|
||||
align-self: stretch;
|
||||
flex-direction: column;
|
||||
}
|
||||
._2 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.unnamed {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319554 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
}
|
||||
.unnamed2 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.unnamed3 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import { Frame2 } from '../Frame2/Frame2';
|
||||
import classes from './Frame427319483.module.css';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
text?: {
|
||||
_1?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5638:7289 */
|
||||
export const Frame427319483: FC<Props> = memo(function Frame427319483(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${classes.root}`}>
|
||||
<div className={classes.frame427319497}>
|
||||
{props.text?._1 != null ? props.text?._1 : <div className={classes._1}>1</div>}
|
||||
</div>
|
||||
<div className={classes.frame427319463}>
|
||||
<div className={classes._2023326}>2023-03-26 来访会议纪要</div>
|
||||
<div className={classes._12}>
|
||||
会议纪要开始新建化考点的工程，并按照预定的进度推进工程。具体工作包括选址、规划设计、建设、设备安装等各个环节的协调和监督。
|
||||
</div>
|
||||
<div className={classes._2}>
|
||||
<div className={classes.unnamed}>参会单位：</div>
|
||||
<div className={classes.frame427319554}>
|
||||
<div className={classes.unnamed2}>仪电鑫森</div>
|
||||
<div className={classes.unnamed3}>南洋万邦</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
.root {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
}
|
||||
.unnamed {
|
||||
color: #1d2129;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._1995526 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
import { memo } from "react";
|
||||
import type { FC, ReactNode } from "react";
|
||||
|
||||
import resets from "../../_resets.module.css";
|
||||
import classes from "./Frame427319520.module.css";
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
root?: string;
|
||||
};
|
||||
text?: {
|
||||
Unnamed?: ReactNode;
|
||||
_1995526?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5532:25847 */
|
||||
export const Frame427319520: FC<Props> = memo(function Frame427319520(
|
||||
props = {}
|
||||
) {
|
||||
return (
|
||||
<div
|
||||
className={`${resets.storybrainResets} ${props.classes?.root || ""} ${
|
||||
props.className || ""
|
||||
} ${classes.root}`}
|
||||
>
|
||||
{props.text?.unnamed != null ? (
|
||||
props.text?.unnamed
|
||||
) : (
|
||||
<div className={classes.unnamed}>成立时间</div>
|
||||
)}
|
||||
{props.text?._1995526 != null ? (
|
||||
props.text?._1995526
|
||||
) : (
|
||||
<div className={classes._1995526}>1995-05-26</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,277 @@
|
|||
.vector.vector {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.unnamed {
|
||||
color: #06f;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.unnamed2 {
|
||||
color: #06f;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.unnamed3 {
|
||||
color: #06f;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.root {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
background-color: #f7f8fa;
|
||||
}
|
||||
.frame427319528 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: center;
|
||||
gap: 24px;
|
||||
}
|
||||
.frame427319525 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
._2022 {
|
||||
color: #1d2129;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319529 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
}
|
||||
.frame427319526 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 24px;
|
||||
}
|
||||
._2 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.unnamed4 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._33036170 {
|
||||
color: #06f;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._22 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.unnamed5 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._100 {
|
||||
color: #06f;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319498 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 16px;
|
||||
}
|
||||
._23 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.unnamed6 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.unnamed7 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._24 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.unnamed8 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.unnamed9 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._25 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.unnamed10 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._202331 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319503 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
}
|
||||
._26 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-self: flex-start;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.unnamed11 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._2023315 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,86 @@
|
|||
import { memo } from "react";
|
||||
import type { FC } from "react";
|
||||
|
||||
import resets from "../../_resets.module.css";
|
||||
import { _Mini } from "../_Mini/_Mini";
|
||||
import { Frame } from "../Frame/Frame";
|
||||
import classes from "./Frame427319527.module.css";
|
||||
import { VectorIcon } from "./VectorIcon.js";
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
root?: string;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5532:26298 */
|
||||
export const Frame427319527: FC<Props> = memo(function Frame427319527(
|
||||
props = {}
|
||||
) {
|
||||
return (
|
||||
<div
|
||||
className={`${resets.storybrainResets} ${props.classes?.root || ""} ${
|
||||
props.className || ""
|
||||
} ${classes.root}`}
|
||||
>
|
||||
<div className={classes.frame427319528}>
|
||||
<div className={classes.frame427319525}>
|
||||
<Frame
|
||||
classes={{ vector: classes.vector }}
|
||||
swap={{
|
||||
vector: <VectorIcon className={classes.icon} />,
|
||||
}}
|
||||
/>
|
||||
<div className={classes._2022}>2022年标准化考点建设</div>
|
||||
<div className={classes.frame427319529}>
|
||||
<_Mini
|
||||
text={{
|
||||
Unnamed: <div className={classes.unnamed}>合同签订阶段</div>,
|
||||
}}
|
||||
/>
|
||||
<_Mini
|
||||
text={{
|
||||
Unnamed: <div className={classes.unnamed2}>A级</div>,
|
||||
}}
|
||||
/>
|
||||
<_Mini
|
||||
text={{
|
||||
Unnamed: <div className={classes.unnamed3}>优秀项目</div>,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className={classes.frame427319526}>
|
||||
<div className={classes._2}>
|
||||
<div className={classes.unnamed4}>合同总金额(万元)：</div>
|
||||
<div className={classes._33036170}>3303.6170</div>
|
||||
</div>
|
||||
<div className={classes._22}>
|
||||
<div className={classes.unnamed5}>项目毛利率：</div>
|
||||
<div className={classes._100}>10.00%</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={classes.frame427319498}>
|
||||
<div className={classes._23}>
|
||||
<div className={classes.unnamed6}>项目单位：</div>
|
||||
<div className={classes.unnamed7}>仪电鑫森</div>
|
||||
</div>
|
||||
<div className={classes._24}>
|
||||
<div className={classes.unnamed8}>商机板块：</div>
|
||||
<div className={classes.unnamed9}>智慧教卫</div>
|
||||
</div>
|
||||
<div className={classes._25}>
|
||||
<div className={classes.unnamed10}>招标公告发布的实际日期：</div>
|
||||
<div className={classes._202331}>2023-03-01</div>
|
||||
</div>
|
||||
<div className={classes.frame427319503}>
|
||||
<div className={classes._26}>
|
||||
<div className={classes.unnamed11}>招标文件中要求的投标日期：</div>
|
||||
<div className={classes._2023315}>2023-03-15</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M20 8V17C20 17.2652 19.8946 17.5196 19.7071 17.7071C19.5196 17.8946 19.2652 18 19 18H1C0.734784 18 0.48043 17.8946 0.292893 17.7071C0.105357 17.5196 0 17.2652 0 17V8H20ZM20 6H0V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0H8.414L10.414 2H19C19.2652 2 19.5196 2.10536 19.7071 2.29289C19.8946 2.48043 20 2.73478 20 3V6Z'
|
||||
fill='#0066FF'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorIcon);
|
||||
export { Memo as VectorIcon };
|
||||
|
|
@ -0,0 +1,201 @@
|
|||
.vector.vector {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
overflow: visible;
|
||||
}
|
||||
.root {
|
||||
position: absolute;
|
||||
left: 969px;
|
||||
top: 418px;
|
||||
width: 292px;
|
||||
height: min-content;
|
||||
padding: 16px;
|
||||
outline: solid 1px #e5e6eb;
|
||||
outline-offset: -1px;
|
||||
border-radius: 8px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.frame427319539 {
|
||||
z-index: 0;
|
||||
height: min-content;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
}
|
||||
.frame427319542 {
|
||||
height: min-content;
|
||||
align-self: stretch;
|
||||
place-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.frame427319541 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
.unnamed {
|
||||
color: #1d2129;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319537 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 1px 4px;
|
||||
border-radius: 2px;
|
||||
background-color: #f53f3f0f;
|
||||
}
|
||||
.unnamed2 {
|
||||
color: #f53f3f;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 500;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.line62 {
|
||||
width: 11px;
|
||||
max-width: 100%;
|
||||
height: 0;
|
||||
max-height: 100%;
|
||||
border-bottom: solid 1px #c9cdd4;
|
||||
margin-bottom: -1px;
|
||||
transform: matrix(0, 1, -1, 0, 0, 0);
|
||||
}
|
||||
.frame427319536 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
}
|
||||
._2 {
|
||||
color: #f53f3f;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: bold;
|
||||
font-family: DIN Alternate, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.unnamed3 {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
.frame427319534 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 16px;
|
||||
}
|
||||
._22 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.a {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._3 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._23 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.b {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._5 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._24 {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
}
|
||||
.c {
|
||||
color: #86909c;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
._1 {
|
||||
color: #4e5969;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-family: OPPOSans, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans',
|
||||
'Liberation Sans', sans-serif;
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
white-space: nowrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import { Frame2 } from '../Frame2/Frame2';
|
||||
import classes from './Frame427319538.module.css';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
root?: string;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5628:6390 */
|
||||
export const Frame427319538: FC<Props> = memo(function Frame427319538(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={classes.frame427319539}>
|
||||
<div className={classes.frame427319542}>
|
||||
<div className={classes.frame427319541}>
|
||||
<Frame2 classes={{ vector: classes.vector }} />
|
||||
<div className={classes.unnamed}>上海市大数据中心</div>
|
||||
</div>
|
||||
<div className={classes.frame427319537}>
|
||||
<div className={classes.unnamed2}>风险点</div>
|
||||
<div className={classes.line62}></div>
|
||||
<div className={classes.frame427319536}>
|
||||
<div className={classes._2}>2</div>
|
||||
<div className={classes.unnamed3}>个</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={classes.frame427319534}>
|
||||
<div className={classes._22}>
|
||||
<div className={classes.a}>A级项目：</div>
|
||||
<div className={classes._3}>3</div>
|
||||
</div>
|
||||
<div className={classes._23}>
|
||||
<div className={classes.b}>B级项目：</div>
|
||||
<div className={classes._5}>5</div>
|
||||
</div>
|
||||
<div className={classes._24}>
|
||||
<div className={classes.c}>C级项目：</div>
|
||||
<div className={classes._1}>1</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,103 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
overflow: hidden;
|
||||
}
|
||||
.vectorStroke {
|
||||
position: absolute;
|
||||
left: 6.25%;
|
||||
right: 6.25%;
|
||||
top: 35.4167%;
|
||||
bottom: 8.3333%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke2 {
|
||||
position: absolute;
|
||||
left: 6.25%;
|
||||
right: 6.25%;
|
||||
top: 10.4167%;
|
||||
bottom: 56.25%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon2 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke3 {
|
||||
position: absolute;
|
||||
left: 29.1667%;
|
||||
right: 62.5%;
|
||||
top: 4.1667%;
|
||||
bottom: 70.8333%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon3 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke4 {
|
||||
position: absolute;
|
||||
left: 62.5%;
|
||||
right: 29.1667%;
|
||||
top: 4.1667%;
|
||||
bottom: 70.8333%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon4 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke5 {
|
||||
position: absolute;
|
||||
left: 54.1667%;
|
||||
right: 25%;
|
||||
top: 66.6667%;
|
||||
bottom: 25%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon5 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke6 {
|
||||
position: absolute;
|
||||
left: 25%;
|
||||
right: 54.1667%;
|
||||
top: 66.6667%;
|
||||
bottom: 25%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon6 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke7 {
|
||||
position: absolute;
|
||||
left: 54.1667%;
|
||||
right: 25%;
|
||||
top: 50%;
|
||||
bottom: 41.6667%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon7 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.vectorStroke8 {
|
||||
position: absolute;
|
||||
left: 25%;
|
||||
right: 54.1667%;
|
||||
top: 50%;
|
||||
bottom: 41.6667%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon8 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame5.module.css';
|
||||
import { VectorStrokeIcon2 } from './VectorStrokeIcon2.js';
|
||||
import { VectorStrokeIcon3 } from './VectorStrokeIcon3.js';
|
||||
import { VectorStrokeIcon4 } from './VectorStrokeIcon4.js';
|
||||
import { VectorStrokeIcon5 } from './VectorStrokeIcon5.js';
|
||||
import { VectorStrokeIcon6 } from './VectorStrokeIcon6.js';
|
||||
import { VectorStrokeIcon7 } from './VectorStrokeIcon7.js';
|
||||
import { VectorStrokeIcon8 } from './VectorStrokeIcon8.js';
|
||||
import { VectorStrokeIcon } from './VectorStrokeIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
vectorStroke?: ReactNode;
|
||||
vectorStroke2?: ReactNode;
|
||||
vectorStroke3?: ReactNode;
|
||||
vectorStroke4?: ReactNode;
|
||||
vectorStroke5?: ReactNode;
|
||||
vectorStroke6?: ReactNode;
|
||||
vectorStroke7?: ReactNode;
|
||||
vectorStroke8?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5403:962 */
|
||||
export const Frame5: FC<Props> = memo(function Frame5(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={classes.vectorStroke}>
|
||||
{props.swap?.vectorStroke || <VectorStrokeIcon className={classes.icon} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke2}>
|
||||
{props.swap?.vectorStroke2 || <VectorStrokeIcon2 className={classes.icon2} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke3}>
|
||||
{props.swap?.vectorStroke3 || <VectorStrokeIcon3 className={classes.icon3} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke4}>
|
||||
{props.swap?.vectorStroke4 || <VectorStrokeIcon4 className={classes.icon4} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke5}>
|
||||
{props.swap?.vectorStroke5 || <VectorStrokeIcon5 className={classes.icon5} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke6}>
|
||||
{props.swap?.vectorStroke6 || <VectorStrokeIcon6 className={classes.icon6} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke7}>
|
||||
{props.swap?.vectorStroke7 || <VectorStrokeIcon7 className={classes.icon7} />}
|
||||
</div>
|
||||
<div className={classes.vectorStroke8}>
|
||||
{props.swap?.vectorStroke8 || <VectorStrokeIcon8 className={classes.icon8} />}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 22 14' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0.5 1.5C0.5 0.947715 0.947715 0.5 1.5 0.5H20.5C21.0523 0.5 21.5 0.947715 21.5 1.5V12C21.5 13.1046 20.6046 14 19.5 14H2.5C1.39544 14 0.5 13.1046 0.5 12V1.5ZM2.5 2.5V12H19.5V2.5H2.5Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon);
|
||||
export { Memo as VectorStrokeIcon };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon2 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 22 9' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0.5 2.5C0.5 1.39543 1.39543 0.5 2.5 0.5H19.5C20.6046 0.5 21.5 1.39544 21.5 2.5V7.5C21.5 8.05228 21.0523 8.5 20.5 8.5H1.5C0.947715 8.5 0.5 8.05228 0.5 7.5V2.5ZM19.5 2.5H2.5V6.5H19.5V2.5Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon2);
|
||||
export { Memo as VectorStrokeIcon2 };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon3 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 2 6' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M1 0C1.55228 0 2 0.447715 2 1V5C2 5.55228 1.55228 6 1 6C0.447715 6 0 5.55228 0 5V1C0 0.447715 0.447715 0 1 0Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon3);
|
||||
export { Memo as VectorStrokeIcon3 };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon4 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 2 6' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M1 0C1.55228 0 2 0.447715 2 1V5C2 5.55228 1.55228 6 1 6C0.447715 6 0 5.55228 0 5V1C0 0.447715 0.447715 0 1 0Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon4);
|
||||
export { Memo as VectorStrokeIcon4 };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon5 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 5 2' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0 1C0 0.447715 0.447715 0 1 0H4C4.55228 0 5 0.447715 5 1C5 1.55228 4.55228 2 4 2H1C0.447715 2 0 1.55228 0 1Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon5);
|
||||
export { Memo as VectorStrokeIcon5 };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon6 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 5 2' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0 1C0 0.447715 0.447715 0 1 0H4C4.55228 0 5 0.447715 5 1C5 1.55228 4.55228 2 4 2H1C0.447715 2 0 1.55228 0 1Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon6);
|
||||
export { Memo as VectorStrokeIcon6 };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon7 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 5 2' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0 1C0 0.447715 0.447715 0 1 0H4C4.55228 0 5 0.447715 5 1C5 1.55228 4.55228 2 4 2H1C0.447715 2 0 1.55228 0 1Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon7);
|
||||
export { Memo as VectorStrokeIcon7 };
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorStrokeIcon8 = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 5 2' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
fillRule='evenodd'
|
||||
clipRule='evenodd'
|
||||
d='M0 1C0 0.447715 0.447715 0 1 0H4C4.55228 0 5 0.447715 5 1C5 1.55228 4.55228 2 4 2H1C0.447715 2 0 1.55228 0 1Z'
|
||||
fill='#1D2129'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorStrokeIcon8);
|
||||
export { Memo as VectorStrokeIcon8 };
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
overflow: hidden;
|
||||
}
|
||||
.vector2 {
|
||||
position: absolute;
|
||||
left: 8.3333%;
|
||||
right: 8.3333%;
|
||||
top: 12.5%;
|
||||
bottom: 12.5%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame6.module.css';
|
||||
import { VectorIcon } from './VectorIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
vector?: string;
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
vector?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5524:24082 */
|
||||
export const Frame6: FC<Props> = memo(function Frame6(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={classes.vector2}>{props.swap?.vector || <VectorIcon className={classes.icon} />}</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import { memo, SVGProps } from 'react';
|
||||
|
||||
const VectorIcon = (props: SVGProps<SVGSVGElement>) => (
|
||||
<svg preserveAspectRatio='none' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
|
||||
<path
|
||||
d='M1 0H19C19.2652 0 19.5196 0.105357 19.7071 0.292893C19.8946 0.48043 20 0.734784 20 1V17C20 17.2652 19.8946 17.5196 19.7071 17.7071C19.5196 17.8946 19.2652 18 19 18H1C0.734784 18 0.48043 17.8946 0.292893 17.7071C0.105357 17.5196 0 17.2652 0 17V1C0 0.734784 0.105357 0.48043 0.292893 0.292893C0.48043 0.105357 0.734784 0 1 0ZM11 10V9H14V7H11.414L13.536 4.879L12.121 3.464L10 5.586L7.879 3.464L6.464 4.88L8.586 7H6V9H9V10H6V12H9V14H11V12H14V10H11Z'
|
||||
fill='black'
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
const Memo = memo(VectorIcon);
|
||||
export { Memo as VectorIcon };
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
.root {
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
align-items: flex-start;
|
||||
overflow: hidden;
|
||||
}
|
||||
.vector2 {
|
||||
position: absolute;
|
||||
left: 12.5%;
|
||||
right: 12.4999%;
|
||||
top: 8.3333%;
|
||||
bottom: 8.3333%;
|
||||
overflow: visible;
|
||||
}
|
||||
.icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import { memo } from 'react';
|
||||
import type { FC, ReactNode } from 'react';
|
||||
|
||||
import resets from '../../_resets.module.css';
|
||||
import classes from './Frame7.module.css';
|
||||
import { VectorIcon } from './VectorIcon.js';
|
||||
|
||||
interface Props {
|
||||
className?: string;
|
||||
classes?: {
|
||||
vector?: string;
|
||||
root?: string;
|
||||
};
|
||||
swap?: {
|
||||
vector?: ReactNode;
|
||||
};
|
||||
}
|
||||
/* @figmaId 5524:24081 */
|
||||
export const Frame7: FC<Props> = memo(function Frame7(props = {}) {
|
||||
return (
|
||||
<div className={`${resets.storybrainResets} ${props.classes?.root || ''} ${props.className || ''} ${classes.root}`}>
|
||||
<div className={classes.vector2}>{props.swap?.vector || <VectorIcon className={classes.icon} />}</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue