file input--button.html.twig

Theme suggestion for "button" input form element.

Available variables:

  • attributes: A list of HTML attributes for the input element.
  • children: Optional additional rendered elements.
  • icon: An icon.
  • icon_only: Flag to display only the icon and not the label.
  • icon_position: Where an icon should be displayed.
  • label: button label.
  • prefix: Markup to display before the input element.
  • suffix: Markup to display after the input element.
  • type: The type of input.
Source
  1. {% extends "input.html.twig" %}
  2. {#
  3. /**
  4. * @file
  5. * Theme suggestion for "button" input form element.
  6. *
  7. * Available variables:
  8. * - attributes: A list of HTML attributes for the input element.
  9. * - children: Optional additional rendered elements.
  10. * - icon: An icon.
  11. * - icon_only: Flag to display only the icon and not the label.
  12. * - icon_position: Where an icon should be displayed.
  13. * - label: button label.
  14. * - prefix: Markup to display before the input element.
  15. * - suffix: Markup to display after the input element.
  16. * - type: The type of input.
  17. *
  18. * @ingroup templates
  19. *
  20. * @see \Drupal\bootstrap\Plugin\Preprocess\InputButton
  21. * @see \Drupal\bootstrap\Plugin\Preprocess\Input
  22. * @see template_preprocess_input()
  23. */
  24. #}
  25. {% spaceless %}
  26. {%
  27. set classes = [
  28. 'btn',
  29. type == 'submit' ? 'js-form-submit',
  30. icon and icon_position and not icon_only ? 'icon-' ~ icon_position,
  31. ]
  32. %}
  33. {% block input %}
  34. {% if icon and icon_only %}
  35. <button{{ attributes.addClass(classes, 'icon-only') }}>
  36. <span class="sr-only">{{ label }}</span>
  37. {{ icon }}
  38. </button>
  39. {% else %}
  40. {% if icon_position == 'after' %}
  41. <button{{ attributes.addClass(classes) }}>{{ label }}{{ icon }}</button>{{ children }}
  42. {% else %}
  43. <button{{ attributes.addClass(classes) }}>{{ icon }}{{ label }}</button>{{ children }}
  44. {% endif %}
  45. {% endif %}
  46. {{ children }}
  47. {% endblock %}
  48. {% endspaceless %}

Related topics