kylefang/connect
1
0
Fork 0
mirror of https://github.com/zhigang1992/connect.git synced 2026-04-28 09:25:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): add icons -- checkmark-circle, close, exclamation-mark-circle

Browse Source
This commit is contained in:
Thomas Osmonson
2020-05-07 18:16:22 -05:00
committed by Hank Stoever
parent 37a10146af
commit 3b9273d2f1
4 changed files with 47 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
packages/ui/src/icons/checkmark-circle-icon.tsx Normal file
View File

@@ -0,0 +1,13 @@
import React from 'react';
import { Box, BoxProps } from '../box';
export const CheckmarkCircleIcon: React.FC<BoxProps> = props => (
<Box {...props}>
<svg width="100%" viewBox="0 0 16 17" fill="none">
<path
d="M7.99613 16.9961C12.3809 16.9961 16 13.377 16 8.99996C16 4.61523 12.3731 0.996094 7.9884 0.996094C3.61141 0.996094 0 4.61523 0 8.99996C0 13.377 3.61914 16.9961 7.99613 16.9961ZM6.94442 13.0367C6.65056 13.0367 6.41856 12.9052 6.1943 12.6423L3.96713 9.92794C3.82794 9.75781 3.75834 9.56448 3.75834 9.37889C3.75834 8.96129 4.08313 8.64423 4.47753 8.64423C4.71725 8.64423 4.91832 8.74476 5.11165 8.97676L6.92122 11.2581L10.4089 5.69015C10.579 5.41175 10.8033 5.28029 11.043 5.28029C11.4297 5.28029 11.8009 5.55095 11.8009 5.96081C11.8009 6.14641 11.7081 6.33974 11.5998 6.50987L7.67134 12.6191C7.48574 12.8975 7.23828 13.0367 6.94442 13.0367Z"
fill="currentColor"
/>
</svg>
</Box>
);

16
packages/ui/src/icons/close-icon.tsx Normal file
View File

@@ -0,0 +1,16 @@
import React from 'react';
import { Svg } from '../svg';
import { Box, BoxProps } from '../box';
export const CloseIcon: React.FC<BoxProps> = props => (
<Box {...props}>
<Svg width="100%" height="unset" viewBox="0 0 10 10">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M1.81707 0.403005C1.62846 0.220847 1.37586 0.120052 1.11366 0.122331C0.851468 0.124609 0.600656 0.229778 0.415247 0.415186C0.229839 0.600595 0.12467 0.851407 0.122392 1.1136C0.120113 1.3758 0.220908 1.6284 0.403066 1.81701L3.58607 5L0.403066 8.183C0.215425 8.37051 0.109957 8.62488 0.109863 8.89015C0.109817 9.0215 0.135642 9.15157 0.185864 9.27294C0.236086 9.39431 0.309721 9.50459 0.402566 9.5975C0.495411 9.69041 0.605646 9.76413 0.726978 9.81444C0.848311 9.86475 0.978364 9.89066 1.10971 9.89071C1.37498 9.8908 1.62943 9.78551 1.81707 9.598L5.00007 6.415L8.18307 9.598C8.37071 9.78564 8.6252 9.89106 8.89057 9.89106C9.15593 9.89106 9.41043 9.78564 9.59807 9.598C9.78571 9.41036 9.89112 9.15587 9.89112 8.8905C9.89112 8.62514 9.78571 8.37065 9.59807 8.183L6.41507 5L9.59807 1.81701C9.69091 1.7241 9.76454 1.61381 9.81477 1.49244C9.86499 1.37107 9.89082 1.241 9.89077 1.10965C9.89072 0.978303 9.86481 0.84825 9.8145 0.726917C9.76419 0.605585 9.69048 0.49535 9.59757 0.402505C9.50466 0.30966 9.39437 0.236025 9.273 0.185803C9.15163 0.135581 9.02156 0.109756 8.89021 0.109802C8.75886 0.109849 8.62881 0.135766 8.50748 0.186073C8.38615 0.236381 8.27591 0.310094 8.18307 0.403005L5.00007 3.58601L1.81707 0.403005Z"
fill="currentColor"
/>
</Svg>
</Box>
);

15
packages/ui/src/icons/exclamation-mark-circle-icon.tsx Normal file
View File

@@ -0,0 +1,15 @@
import React from 'react';
import { Box, BoxProps } from '../box';
export const ExclamationMarkCircleIcon: React.FC<BoxProps> = props => (
<Box {...props}>
<svg width="100%" height="unset" viewBox="0 0 16 16" fill="none">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16ZM7.9983 4C8.46541 4 8.84049 4.38536 8.82787 4.8523L8.72037 8.82986C8.70981 9.22031 8.39026 9.53134 7.99967 9.53134C7.60928 9.53134 7.28981 9.2206 7.279 8.83036L7.16874 4.85287C7.15579 4.38572 7.53096 4 7.9983 4ZM8.9199 11.0743C8.91607 11.5873 8.49058 12 7.99992 12C7.49392 12 7.0761 11.5873 7.07993 11.0743C7.0761 10.569 7.49392 10.1562 7.99992 10.1562C8.49058 10.1562 8.91607 10.569 8.9199 11.0743Z"
fill="currentColor"
/>
</svg>
</Box>
);

3
packages/ui/src/icons/index.tsx
View File

@@ -2,12 +2,15 @@ export * from './apps-icon';
export * from './blockchain-icon';
export * from './blockstack-icon';
export * from './checkmark-icon';
export * from './checkmark-circle-icon';
export * from './chevron-icon';
export * from './connect-logo-icon';
export * from './encryption-icon';
export * from './exlamation-mark-icon';
export * from './exclamation-mark-circle-icon';
export * from './eye-icon';
export * from './padlock-icon';
export * from './plus-circle-icon';
export * from './private-icon';
export * from './union-line-icon';
export * from './close-icon';