ButtonGroup
IzzyBlazor.ButtonGroup in the IzzyBlazor.Core package, generated from the 0.1.0-alpha.17 assembly
and its doc comments.
Properties (8)
Labelstring?What the buttons have in common, for screen readers: "Text alignment".
AccentAccent?The buttons' accent, unless a button sets its own.
VariantButtonVariant?The buttons' variant, unless a button sets its own.
SizeControlSize?The buttons' size, unless a button sets its own.
Attachedbool = trueJoins the buttons into one control with shared borders (the default). False spaces them apart.
OrientationOrientation = Orientation.HorizontalLays the buttons out in a row (the default) or a column.
FullWidthbool = falseStretches the group to its container's width, sharing it among the buttons.
ChildContentRenderFragment?The buttons.
Plus 16 item props and 4 common props.
Show them hereEvents (0)
No events.
Types (4)
Accent
classThe color of a control: buttons, badges, tags, banners, progress bars and menu items. Primary, Neutral and Danger are the roles; emphasis comes from the variant (solid, soft, outline, ghost, link), not from more colors. For one control in another color, use Of (any CSS color) or Token (a theme token); text on it is chosen for contrast.
| Member | Description |
|---|---|
Primary | The brand color, for the main action. |
Neutral | A quiet, gray action. |
Danger | A destructive action, such as Delete. |
Of(string css) | Any CSS color, such as |
Token(string name) | A theme token, such as |
From(Color color) | A |
ButtonVariant
enumA button's visual weight, from strongest to quietest.
| Value | Description |
|---|---|
Solid | Filled with the accent color. For the main action. |
Soft | A light tint of the accent color. |
Outline | An accent-colored border on a transparent background. |
Ghost | Transparent until hovered. For toolbars and dense layouts. |
Link | Looks like a link. |
ControlSize
enumThe height of interactive controls. Shared by buttons and form fields, so a button and an input of the same size line up in a row.
| Value | Description |
|---|---|
Sm | 32px tall, small text. |
Md | 36px tall (the default). |
Lg | 44px tall, large text. For touch-first and marketing pages. |
Orientation
enumWhether items run across or down.
| Value | Description |
|---|---|
Vertical | Top to bottom. |
Horizontal | Side by side, wrapping when space runs out. |