Improved repeater item collapse button when remove button not present

This commit is contained in:
Luke Towers 2018-08-22 21:06:06 -06:00
parent 29c0c8c33d
commit fd4ee47065
3 changed files with 12 additions and 2 deletions

View File

@ -22,6 +22,8 @@
.field-repeater li.field-repeater-item .repeater-item-collapse a,.field-repeater li.field-repeater-item .repeater-item-collapse button{-webkit-transition:transform 0.3s;transition:transform 0.3s;color:#bdc3c7;line-height:20px;display:block;font-size:12px}
.field-repeater li.field-repeater-item .repeater-item-collapse a:hover,.field-repeater li.field-repeater-item .repeater-item-collapse button:hover,.field-repeater li.field-repeater-item .repeater-item-collapse a:focus,.field-repeater li.field-repeater-item .repeater-item-collapse button:focus{color:#999;text-decoration:none}
.field-repeater li.field-repeater-item .repeater-item-remove{position:absolute;top:4px;right:5px;z-index:90}
.field-repeater li.field-repeater-item .repeater-item-remove.disabled{display:none}
.field-repeater li.field-repeater-item .repeater-item-remove.disabled + .repeater-item-collapse{right:7px}
.field-repeater li.field-repeater-item .repeater-item-remove .close{float:none;display:inline-block}
.field-repeater li.field-repeater-item .repeater-item-collapse,.field-repeater li.field-repeater-item .repeater-item-handle,.field-repeater li.field-repeater-item .repeater-item-remove{width:20px;height:20px;text-align:center}
.field-repeater li.field-repeater-item:hover .repeater-item-collapse,.field-repeater li.field-repeater-item:active .repeater-item-collapse,.field-repeater li.field-repeater-item:hover .repeater-item-handle,.field-repeater li.field-repeater-item:active .repeater-item-handle,.field-repeater li.field-repeater-item:hover .repeater-item-remove,.field-repeater li.field-repeater-item:active .repeater-item-remove{opacity:1}

View File

@ -125,9 +125,9 @@
Repeater.prototype.togglePrompt = function () {
if (this.options.minItems && this.options.minItems > 0) {
var repeatedItems = this.$el.find('> .field-repeater-items > .field-repeater-item').length,
$removeItemBtn = this.$el.find('> .field-repeater-items > .field-repeater-item > .repeater-item-remove')
$removeItemBtn = this.$el.find('> .field-repeater-items > .field-repeater-item > .repeater-item-remove');
$removeItemBtn.toggle(repeatedItems > this.options.minItems)
$removeItemBtn.toggleClass('disabled', !(repeatedItems > this.options.minItems))
}
if (this.options.maxItems && this.options.maxItems > 0) {

View File

@ -155,6 +155,14 @@
right: 5px;
z-index: 90;
&.disabled {
display: none;
+ .repeater-item-collapse {
right: 7px;
}
}
.close {
float: none;
display: inline-block;