24 Luglio 2021

Buttons

MINI BUTTONS

[button href=”” size=”btn-mini”]Default button[/button] [button href=”” size=”btn-mini” class=”btn-primary”]Primary button[/button] [button size=”btn-mini” class=”btn-info”]Info button[/button] [button size=”btn-mini” class=”btn-success”]Success button[/button] [button size=”btn-mini” class=”btn-warning”]Warning button[/button] [button size=”btn-mini” class=”btn-danger”]Danger button[/button] [button size=”btn-mini” class=”btn-inverse”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button bgcolor=”red”]Red button[/button]]

[/toggle]

SMALL BUTTONS

[button href=”” size=”btn-small”]Default button[/button] [button href=”” size=”btn-small” class=”btn-primary”]Primary button[/button] [button size=”btn-small” class=”btn-info”]Info button[/button] [button size=”btn-small” class=”btn-success”]Success button[/button] [button size=”btn-small” class=”btn-warning”]Warning button[/button] [button size=”btn-small” class=”btn-danger”]Danger button[/button] [button size=”btn-small” class=”btn-inverse”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button size=”btn-small” class=”btn-danger”]Danger button[/button]]

[/toggle]

 

DEFAULT Buttons

[button href=””]Default button[/button] [button href=”” class=”btn-primary”]Primary button[/button] [button class=”btn-info”]Info button[/button] [button class=”btn-success”]Success button[/button] [button class=”btn-warning”]Warning button[/button] [button class=”btn-danger”]Danger button[/button] [button class=”btn-inverse”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button size=”medium” bgcolor=”black”]Black button[/button]]

[/toggle]

 

Large Buttons

[button href=”” size=”btn-large”]Default button[/button] [button href=”” size=”btn-large” class=”btn-primary”]Primary button[/button] [button size=”btn-large” class=”btn-info”]Info button[/button] [button size=”btn-large” class=”btn-success”]Success button[/button] [button size=”btn-large” class=”btn-warning”]Warning button[/button] [button size=”btn-large” class=”btn-danger”]Danger button[/button] [button size=”btn-large” class=”btn-inverse”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button size=”large” bgcolor=”azure”]Azure button[/button]]

[/toggle]

 

MINI Rounded BUTTONS

[button href=”” size=”btn-mini” type=”rounded-button”]Default button[/button] [button href=”” size=”btn-mini” class=”btn-primary” type=”rounded-button”]Primary button[/button] [button size=”btn-mini” class=”btn-info” type=”rounded-button”]Info button[/button] [button size=”btn-mini” class=”btn-success” type=”rounded-button”]Success button[/button] [button size=”btn-mini” class=”btn-warning” type=”rounded-button”]Warning button[/button] [button size=”btn-mini” class=”btn-danger” type=”rounded-button”]Danger button[/button] [button size=”btn-mini” class=”btn-inverse” type=”rounded-button”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button class=”btn-primary” type=”rounded-button” size=”mini”]Primary button[/button]]

[/toggle]

SMALL Rounded BUTTONS

[button href=”” size=”btn-small” type=”rounded-button”]Default button[/button] [button href=”” size=”btn-small” class=”btn-primary” type=”rounded-button”]Primary button[/button] [button size=”btn-small” class=”btn-info” type=”rounded-button”]Info button[/button] [button size=”btn-small” class=”btn-success” type=”rounded-button”]Success button[/button] [button size=”btn-small” class=”btn-warning” type=”rounded-button”]Warning button[/button] [button size=”btn-small” class=”btn-danger” type=”rounded-button”]Danger button[/button] [button size=”btn-small” class=”btn-inverse” type=”rounded-button”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button class=”btn-primary” type=”rounded-button” size=”small”]Primary button[/button]]

[/toggle]

 

DEFAULT Rounded Buttons

[button href=”” type=”rounded-button”]Default button[/button] [button href=”” class=”btn-primary” type=”rounded-button”]Primary button[/button] [button class=”btn-info” type=”rounded-button”]Info button[/button] [button class=”btn-success” type=”rounded-button”]Success button[/button] [button class=”btn-warning” type=”rounded-button”]Warning button[/button] [button class=”btn-danger” type=”rounded-button”]Danger button[/button] [button class=”btn-inverse” type=”rounded-button”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button class=”btn-inverse” type=”rounded-button”]Inverse button[/button]]

[/toggle]

 

Large Rounded Buttons

[button href=”” size=”btn-large” type=”rounded-button”]Default button[/button] [button href=”” size=”btn-large” class=”btn-primary” type=”rounded-button”]Primary button[/button] [button size=”btn-large” class=”btn-info” type=”rounded-button”]Info button[/button] [button size=”btn-large” class=”btn-success” type=”rounded-button”]Success button[/button] [button size=”btn-large” class=”btn-warning” type=”rounded-button”]Warning button[/button] [button size=”btn-large” class=”btn-danger” type=”rounded-button”]Danger button[/button] [button size=”btn-large” class=”btn-inverse” type=”rounded-button”]Inverse button[/button]

[toggle title=”Get the code” hidden=”true”]

[[button size=”large” class=”btn-primary” type=”rounded-button”]Primary button[/button]]

[/toggle]

[divider type=”type_1″]

Predefined classes: default, primary, info, success, warning, danger, inverse

[alert-info]

List of possible attributes:

  • target- Link target (_blank, _self)
  • href – Url (http://www.example.com/)
  • class – Custom button class which you can use to style it differently
  • size – Button size (small, medium, large)
  • border_color – Button border color
  • bgcolor – Button background color
  • type – Type (button, rounded-button)

[/alert-info]

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *