+ You can create a non-interactive button by using the is-static
modifier. This is useful to align a text label with an input, for example when using form addons.
+
diff --git a/CHANGELOG.md b/CHANGELOG.md index 81ea39e3..bc3a79a9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,7 @@ * Fix #747 remove flex-shrink for is-expanded * Fix #702 add icons support for select dropdown * Fix #712 delete button as flexbox item +* Fix #759 static button ## 0.4.1 diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css index cac502ec..b59e1ed8 100644 --- a/docs/css/bulma-docs.css +++ b/docs/css/bulma-docs.css @@ -1617,6 +1617,14 @@ a.box:active { position: absolute !important; } +.button.is-static { + background-color: whitesmoke; + border-color: #dbdbdb; + color: #7a7a7a; + box-shadow: none; + pointer-events: none; +} + button.button, input[type="submit"].button { line-height: 1; diff --git a/docs/documentation/elements/button.html b/docs/documentation/elements/button.html index 48ca15fd..7ba0f4e5 100644 --- a/docs/documentation/elements/button.html +++ b/docs/documentation/elements/button.html @@ -232,6 +232,35 @@ doc-subtab: button
+ You can create a non-interactive button by using the is-static
modifier. This is useful to align a text label with an input, for example when using form addons.
+
If you want to attach controls together, use the has-addons
modifier on the control
container:
You can attach inputs, buttons, and dropdowns only.
++ New! + 0.4.2 +
+ +It can be useful to append a static button.
++ +
++ + @gmail.com + +
+Use the is-expanded
modifier on the element you want to fill up the remaining space (in this case, the input):