IconButton

Component used to set the icon in Button. Icons for buttons are prepared as for the Icon component. The body of the component is the icon file which should only contain elements between the svg tags because only the svg tag is modified.

IconButtonBosons

Size
IconButton size.
type: string
default: md
values: xs, sm, md, lg, xl
Icononly
It only leaves the default area for the icon.
type: bool
default: false
Reverse
Changes the order of the icon and text.
type: bool
default: false
ViewBox
Size of viewbox for svg.
type: string
default: 0 0 32 32
Attrs
Sets attributes in the html tag.
type: gopress.Attrs

Examples

Buttons with an icons
default
reverse
square
rounded
 1// Examples of buttons with an icons
 2
 3@atoms.ButtonIcon(
 4  &atoms.ButtonBosons{
 5    Title: "Primary",
 6  },
 7) {
 8  @icons.IconCheck()
 9}
10      
11@atoms.ButtonIcon(
12  &atoms.ButtonBosons{
13    Reverse: true,
14    Title:   "Primary",
15  },
16) {
17  @icons.IconCheck()
18}
19      
20@atoms.ButtonIcon(
21  &atoms.ButtonBosons{
22    Icononly: true,
23  },
24) {
25  @icons.IconCheck()
26}
27
28@atoms.ButtonIcon(
29  &atoms.ButtonBosons{
30    Rounded:  true,
31    Icononly: true,
32  },
33) {
34  @icons.IconCheck()
35}

Let's dive deeper and connect!

Hanariu is brought to you by Pay For Done. We specialize in crafting products and services rooted in design systems. Join our community to discuss how we can support you.


© 2024 Pay For Done. All Rights Reserved. Website compliant with W3C validation.