diff --git a/documentation/partials/api/_props.pug b/documentation/partials/api/_props.pug index e227b3a1..a9eadcba 100644 --- a/documentation/partials/api/_props.pug +++ b/documentation/partials/api/_props.pug @@ -274,6 +274,12 @@ h2.typo__h2#sub-props(data-section) Props td.table__td: kbd 0 td.table__td | Specify the tabindex of the Multiselect component + tr.table__tr + td.table__td: strong showFooter + td.table__td Boolean + td.table__td: kbd false + td.table__td + | Show a fixed footer below scrollable menu. tr.table__tr td.table__td.utils--center(colspan="4"): strong pointerMixin.js diff --git a/src/Multiselect.vue b/src/Multiselect.vue index d743f85d..02e1b78e 100644 --- a/src/Multiselect.vue +++ b/src/Multiselect.vue @@ -149,6 +149,9 @@ + @@ -297,6 +300,10 @@ export default { tabindex: { type: Number, default: 0 + }, + showFooter: { + type: Boolean, + default: false } }, computed: { @@ -551,6 +558,10 @@ fieldset[disabled] .multiselect { text-overflow: ellipsis; } +.multiselect__footer { + min-height: 40px; +} + .multiselect__tag-icon { cursor: pointer; margin-left: 7px; @@ -644,7 +655,6 @@ fieldset[disabled] .multiselect { display: block; background: #fff; width: 100%; - max-height: 240px; overflow: auto; border: 1px solid #e8e8e8; border-top: none; @@ -655,6 +665,8 @@ fieldset[disabled] .multiselect { } .multiselect__content { + max-height: 240px; + overflow: auto; list-style: none; display: inline-block; padding: 0;