Fix the overflow wrapping for repeatable textstrings

This commit is contained in:
Kenn Jacobsen
2019-06-12 09:09:17 +02:00
committed by Sebastiaan Janssen
parent 7d990a2cbb
commit 339ae32c3d
2 changed files with 22 additions and 16 deletions

View File

@@ -1,9 +1,10 @@
.umb-multiple-textbox{
&__confirm{
position: relative;
display: inline-block;
&-action{
margin: 0;
margin: -2px 0 0 0;
padding: 2px;
background: transparent;
border: 0 none;
@@ -11,6 +12,10 @@
}
}
.umb-multiple-textbox .icon-wrapper {
width: 50px;
}
.umb-multiple-textbox .textbox-wrapper {
align-items: center;
margin-bottom: 15px;

View File

@@ -2,23 +2,24 @@
<div ui-sortable="sortableOptions" ng-model="model.value">
<div class="flex flex-wrap textbox-wrapper" ng-repeat="item in model.value track by $index">
<input type="text" name="item_{{$index}}" ng-model="item.value" class="umb-property-editor umb-textstring textstring"
ng-keyup="addRemoveOnKeyDown($event, $index)" focus-when="{{item.hasFocus}}"/>
<i class="icon icon-navigation handle" localize="title" title="@general_move"></i>
<input type="text" name="item_{{$index}}" ng-model="item.value" class="umb-property-editor umb-textstring textstring flx-i"
ng-keyup="addRemoveOnKeyDown($event, $index)" focus-when="{{item.hasFocus}}"/>
<div class="icon-wrapper">
<i class="icon icon-navigation handle" localize="title" title="@general_move"></i>
<div class="umb-multiple-textbox__confirm" ng-show="model.value.length > model.config.min">
<button class="umb-multiple-textbox__confirm-action" type="button" prevet-default ng-click="showPrompt($index, item)" localize="title" title="@content_removeTextBox">
<i class="icon-trash"></i>
</button>
<umb-confirm-action
ng-if="promptIsVisible === $index"
direction="left"
on-confirm="remove($index)"
on-cancel="hidePrompt()">
</umb-confirm-action>
</div>
<div class="umb-multiple-textbox__confirm" ng-show="model.value.length > model.config.min">
<button class="umb-multiple-textbox__confirm-action" type="button" prevet-default ng-click="showPrompt($index, item)" localize="title" title="@content_removeTextBox">
<i class="icon-trash"></i>
</button>
<umb-confirm-action
ng-if="promptIsVisible === $index"
direction="left"
on-confirm="remove($index)"
on-cancel="hidePrompt()">
</umb-confirm-action>
</div>
</div>
</div>
</div>
<a prevent-default href="" class="add-link" localize="title" title="@content_addTextBox"