Allows editing stack title by clicking it.

Deprecates edit icon in the stack header.

Signed-off-by: Marin Treselj <marin@pixelipo.com>
This commit is contained in:
Marin Treselj
2017-05-31 08:13:53 +02:00
parent d14f4f20b6
commit 73eff3d64e
2 changed files with 10 additions and 18 deletions

View File

@@ -248,27 +248,21 @@ button.button-inline:hover {
width: 100%;
}
.stack h2 button,
.stack .stack-actions {
float: right;
margin: 0px 0px 0px 10px;
.stack h2 button {
margin-left: auto;
display: flex;
opacity: 0.25;
}
.stack h2 span {
width: 100%;
white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
}
.stack h2 .stack-actions {
display: flex;
opacity: 0.25;
cursor: text;
}
.stack h2:hover .stack-actions {
display: flex;
float: right;
}
.card {

View File

@@ -34,19 +34,17 @@
<div class="stack" ng-repeat="s in stacks" data-as-sortable-item
data-columnindex="{{$index}}" id="column{{$index}}"
style="">
<h2 data-as-sortable-item-handle><span ng-show="!s.status.editStack">{{ s.title }}</span>
<h2 data-as-sortable-item-handle>
<span ng-show="!s.status.editStack" ng-click="s.status.editStack=true">{{ s.title }}</span>
<form ng-if="s.status.editStack" ng-submit="stackservice.update(s)">
<input type="text" placeholder="Add a new stack"
ng-blur="stackservice.update(s); s.status.editStack=false" ng-model="s.title"
ng-if="s.status.editStack" autofocus-on-insert
required maxlength="100"/>
</form>
<div ng-if="!s.status.editStack" class="stack-actions">
<button class="icon-rename button-inline"
ng-click="s.status.editStack=true"></button>
<button class="icon-delete button-inline"
ng-click="stackservice.delete(s.id)"></button>
</div>
<button class="icon-delete button-inline stack-actions"
ng-if="!s.status.editStack"
ng-click="stackservice.delete(s.id)"></button>
</h2>
<ul data-as-sortable="sortOptions" is-disabled="!boardservice.canEdit() || filter==='archive'" data-ng-model="s.cards"
style="min-height: 40px;">