You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/pages/library/react-polkicon.mdx
+15-12Lines changed: 15 additions & 12 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -6,7 +6,8 @@ A light-weight and customisable Polkadot Icon.
6
6
7
7
## Usage
8
8
9
-
Polkicon is a light-weight component that renders the Polkadot icon, with various display options built in. By default, the `address` prop dictates which color palette the Polkicon will display.
9
+
Polkicon is a light-weight component that renders an inline Polkadot icon, inheriting the
10
+
font size of the nearest assigned parent element. The `address` prop dictates which colors are assigned to the Polkicon.
10
11
11
12
::::steps
12
13
@@ -42,7 +43,7 @@ import { Polkicon } from '@w3ux/react-polkicon';
@@ -53,19 +54,21 @@ import { Polkicon } from '@w3ux/react-polkicon';
53
54
#### address
54
55
`string`
55
56
56
-
The address of the Polkadot account.
57
+
The Polkadot address to be represented by the Polkicon.
57
58
58
-
#### size
59
-
`string | number`
59
+
#### background
60
+
`string?`
60
61
61
-
The size of the Polkicon. The default size is `2rem`.
62
+
The background of the outermost circle of the icon. The `--background-default` CSS variable is assigned as the default value.
62
63
63
-
#### outerColor
64
-
`string`
64
+
The address of the Polkadot account.
65
+
66
+
#### transform
67
+
`TransformProp?`
65
68
66
-
The color of the outermost circle of the icon. The default value is the `--background-default` CSS variable. This value can be overridden with a custom color, or be set to transparent with the value `transparent`.
69
+
Grow or shrink the Polkicon using "grow-1", "grow-2" - "grow-10", or "shrink-1", "shrink-2" - "shrink-10".
67
70
68
-
#### colors
69
-
`string[]?`
71
+
#### inactive
72
+
`boolean?`
70
73
71
-
If a specific pattern or color combination is desired, `colors` can be used to override the default color palette. The colors prop accepts an array of colors, which will be applied to the icon in the order they were provided.
74
+
If `true`, the Polkicon will be displayed in grayscale.
0 commit comments