boton-cta.yaml

name: Botón CTA
description: Muestra un botón con un diseño CTA (Llamado a la acción). 
type: particle

form:
  fields:
    enabled:
      type: input.checkbox
      label: Habilitado
      description: Globally enable Call-to-action particles.
      default: true

    separador01:
      type: separator.note
      class: alert alert-info
      content: '<h4>Ajustes Generales</h4>'

    style:
      type: select.select
      label: Estilo
      description: Selecciona el diseño de esta partícula.
      placeholder: 'Seleccionar...'
      default: style1
      options:
        style1: Estilo 1
        style2: Estilo 2
        style3: Estilo 3

    espaciadot:
      type: input.text
      label: Espaciado Superior
      description: Define el espaciado superior que rodeará el contenido de la partícula.
      placeholder: '2rem'
      default: 2rem

    espaciadob:
      type: input.text
      label: Espaciado Superior
      description: Define el espaciado superior que rodeará el contenido de la partícula.
      placeholder: '2rem'
      default: 2rem

    
    separador02:
      type: separator.note
      class: alert alert-info
      content: '<h4>Ajustes del Título</h4>'

    colortexto:
      type: input.colorpicker
      label: Color del texto

    title:
      type: input.text
      label: Título
      description: Escribe el título.
      default: Escribe el título.

    etiquetatitulo:
      type: select.select
      label: Etiqueta del título
      description: Etiqueta de encabezado del título.
      placeholder: 'Seleccionar'
      default: h3  
      options:
        h1: H1
        h2: H2
        h3: H3
        h4: H4
        h5: H5
        h6: H6

    separador03:
      type: separator.note
      class: alert alert-info
      content: '<h4>Ajustes de la descripción</h4>'

    description:
      type: textarea.textarea
      label: Descripción
      description: Ingrese el texto descriptivo de la partícula.
      default: Entre su descripción.

    colordescription:
      type: input.colorpicker
      label: Color descripción

    tamanodescripcion:
      type: input.text
      label:  Tamaño texto descripción
      description: Escribe el tamaño texto descripción.
      placeholder: '1.5rem' 




    separador05:
      type: separator.note
      class: alert alert-info
      content: '<h4>Ajustes del Botón</h4>'

    buttontext:
      type: input.text
      label: Texto del botón
      description: Escribe el texto del botón.
      default: Más información

    link:
      type: input.text
      label: Enlace del botón
      description: Escribe la url de destino.
      default: http://

    target:
      type: select.select
      label: Target
      description: ¿El enlace se abrirá en la misma ventana o una nueva?.
      placeholder: 'Seleccionar...'
      default: _parent
      options:
          _parent: Misma ventana
          _blank: Nueva ventana

    buttonicon:
      type: input.icon
      label: Ícono del botón
      description: Selecciona el ícono para el botón.
      default: fa fa-arrow-right

    ubicacionicono:
      type: input.radios
      label: Ubicación del ícono
      description: Define la posición del ícono que acompañará al texto del botón.
      default: ico_ant
      options:        
        ico_ant: Antes del texto.
        ico_desp: Despues del texto.


    estiloboton:
      type: select.select
      label: Estilo del botón
      description: Elija el Estilo del botón.
      placeholder: 'Seleccionar...'
      default: btn-primary
      options:
        btn-default: btn-default
        btn-primary: btn-primary 
        btn-success: btn-success            
        btn-info: btn-info
        btn-warning: btn-warning
        btn-danger: btn-danger            
        btn-inverse : btn-inverse 
        btn-link: btn-link

    tamanoboton:
      type: select.select
      label: Tamaño del botón
      description: Defina  el tamaño del boton.
      placeholder: 'Seleccionar...'
      default: btn-large
      options:
        normal: Defecto
        btn-mini: btn-mini
        btn-small: btn-small
        btn-large: btn-large 

    css.class:
      type: input.selectize
      label: Clase CSS
      description: Clase CSS de la partícula.
      default: 

    extra:
      type: collection.keyvalue
      label: Tag Attributes
      description: Extra Tag attributes.
      key_placeholder: Key (data-*, style, ...)
      value_placeholder: Value
      exclude: ['id', 'class']