Cfa Ui Components

Previews

No matching results.

x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!-- Secondary -->
<a class="btn btn--secondary btn--large" role="button" x-on:keydown.space.prevent="$el.click()" href="/decline">    Decline
</a>
<!-- Secondary Small -->
<a class="btn btn--secondary btn--small" role="button" x-on:keydown.space.prevent="$el.click()" href="/decline">    Decline
</a>
<!-- Secondary With Icon -->
<a class="btn btn--secondary btn--large" role="button" x-on:keydown.space.prevent="$el.click()" href="/decline">    <span class="inline-flex items-center justify-center gap-cfa-sm">
    <svg class="cfa-icon" width="24" height="24" aria-hidden="true" focusable="false"><use href="/assets/uswds-sprite-36dd7ae2.svg#highlight_off"></use></svg>
    Decline
  </span>
</a>
<!-- Secondary Small With Icon -->
<a class="btn btn--secondary btn--small" role="button" x-on:keydown.space.prevent="$el.click()" href="/decline">    <span class="inline-flex items-center justify-center gap-cfa-sm">
    <svg class="cfa-icon" width="16" height="16" aria-hidden="true" focusable="false"><use href="/assets/uswds-sprite-36dd7ae2.svg#highlight_off"></use></svg>
    Decline
  </span>
</a>
<!-- Secondary Disabled -->
<a class="btn btn--secondary btn--large" role="button" x-on:keydown.space.prevent="$el.click()" disabled="disabled" aria-disabled="true" tabindex="-1" href="/decline">    Decline
</a>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
# Secondary
render(ButtonComponent.new(label: I18n.t("preview.decline"), url: "/decline", variant: :secondary))
# Secondary Small
render(ButtonComponent.new(label: I18n.t("preview.decline"), url: "/decline", variant: :secondary, size: :small))
# Secondary With Icon
render(ButtonComponent.new(label: I18n.t("preview.decline"), url: "/decline", variant: :secondary, icon: "highlight_off"))
# Secondary Small With Icon
render(ButtonComponent.new(label: I18n.t("preview.decline"), url: "/decline", variant: :secondary, size: :small, icon: "highlight_off"))
# Secondary Disabled
render(ButtonComponent.new(label: I18n.t("preview.decline"), url: "/decline", variant: :secondary, disabled: true))

No notes provided.

No params configured.