m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 09:57:02 +01:00
Code

UX: Icon: Update README with new variable names (#17920)

Browse Source 
* UX: Icon: Update README with new variable names

* Update ui/components/component-library/text-field/README.mdx

Co-authored-by: Nidhi Kumari <nidhi.kumari@consensys.net>

---------

Co-authored-by: Nidhi Kumari <nidhi.kumari@consensys.net>
This commit is contained in:
David Walsh 2023-03-06 13:30:43 -06:00 committed by GitHub
parent 0cc135fab3
commit 13d03abe9b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
ui/components/component-library/text-field/README.mdx
View File

@ -89,14 +89,14 @@ Use the `startAccessory` and `endAccessory` props to add components such as icon
</Canvas>
```jsx
import { COLORS, SIZES, DISPLAY } from '../../../helpers/constants/design-system';
import { Color, IconColor, SIZES, DISPLAY } from '../../../helpers/constants/design-system';
import { ButtonIcon, Icon, ICON_NAMES, TextField } from '../../component-library';
<TextField
placeholder="Search"
startAccessory={
<Icon
color={COLORS.ICON_ALTERNATIVE}
color={IconColor.iconAlternative}
name={ICON_NAMES.SEARCH}
/>
}
@ -108,7 +108,7 @@ import { ButtonIcon, Icon, ICON_NAMES, TextField } from '../../component-library
<ButtonIcon
iconName={ICON_NAMES.SCAN_BARCODE}
ariaLabel="Scan QR code"
iconProps={{ color: COLORS.PRIMARY_DEFAULT }}
iconProps={{ color: IconColor.primaryDefault }}
/>
}
/>
@ -129,7 +129,7 @@ import { ButtonIcon, Icon, ICON_NAMES, TextField } from '../../component-library
isAddressValid && (
<Icon
name={ICON_NAMES.CHECK}
color={COLORS.SUCCESS_DEFAULT}
color={IconColor.successDefault}
/>
)
}
@ -215,7 +215,7 @@ const TextFieldCustomInput = (args) => (
size={SIZES.LG}
InputComponent={CustomInputComponent}
startAccessory={
<Icon color={COLORS.ICON_ALTERNATIVE} name={ICON_NAMES.WALLET} />
<Icon color={IconColor.iconAlternative} name={ICON_NAMES.WALLET} />
}
/>
);