The following modifiers are supported:
The following type attributes are supported:
type="text"type="password"type="email"type="tel"
--- title: Input layout: documentation doc-tab: form doc-subtab: input variables: - name: $input-color value: $grey-darker - name: $input-background-color value: $white - name: $input-border-color value: $grey-lighter - name: $input-shadow value: inset 0 1px 2px rgba($black, 0.1) - name: $input-hover-color value: $grey-darker - name: $input-hover-border-color value: $grey-light - name: $input-focus-color value: $grey-darker - name: $input-focus-border-color value: $link - name: $input-disabled-color value: $text-light - name: $input-disabled-background-color value: $background - name: $input-disabled-border-color value: $background - name: $input-arrow value: $link - name: $input-icon-color value: $grey-lighter - name: $input-icon-active-color value: $grey - name: $input-radius value: $radius --- {% capture input_example %} {% endcapture %} {% capture colors_example %}
The following modifiers are supported:
The following type attributes are supported:
type="text"type="password"type="email"type="tel"New! 0.4.3
You can resize the loading spinner by appending is-small, is-medium or is-large to the control container.
You can append one of 2 modifiers on a control:
has-icons-left
has-icons-right
You also need to add a modifier on the icon:
icon is-left if has-icons-left is used
icon is-right if has-icons-right is used
The size of the input will define the size of the icon container.
If the control contains an icon, Bulma will make sure the icon remains centered, no matter the size of the input or of the icon.