ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

added a card control bar

Browse Source 
Signed-off-by: Artem Anufrij <artem.anufrij@live.de>
This commit is contained in:
Artem Anufrij
2017-05-19 12:02:54 +02:00
parent 1d797b1bf2
commit 92349f66a3
2 changed files with 51 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
css/style.css
View File

@@ -297,21 +297,34 @@ button:hover {
padding: 5px;
}
.card .card-options {
position: absolute;
bottom: 10px;
right: 10px;
display: none;
.card .card-controls {
padding: 10px;
background: #f8f8f8;
display: flex;
position: relative;
}
.card:hover .card-options {
display: block;
.card .card-controls .card-options {
opacity: 0.25;
position: absolute;
right: 10px;
top: 8px;
}
.card .card-controls:hover .card-options {
opacity: 1;
}
.card .card-controls .space {
width: 100%;
min-height: 16px;
}
.card .popovermenu {
z-index: 999;
opacity: 1;
margin-left: 10px;
margin-top: 25px;
margin-right: 3px;
display: block;
}
@@ -934,12 +947,6 @@ button:hover {
background-image: url('../img/details-white.svg');
}
.icon-description-marker {
position: absolute;
top: 0px;
right: 0px;
}
.icon-home {
background-image: url('/core/img/places/home.svg');
}

56
templates/part.board.mainView.php
View File

@@ -72,7 +72,6 @@
ng-class="{'archived': c.archived, 'has-labels': c.labels.length>0 }">
<div data-as-sortable-item-handle>
<div class="card-upper">
<i class="icon icon-filetype-text icon-description-marker" ng-if="c.description" title="{{ c.description }}"></i>
<h3>{{ c.title }}</h3>
<ul class="labels">
<li ng-repeat="label in c.labels"
@@ -82,34 +81,39 @@
</ul>
</div>
<div class="app-popover-menu-utils">
<button class="card-options icon-more" ng-model="card"></button>
<div class="popovermenu bubble hidden">
<ul>
<li ng-if="filter!=='archive'">
<a class="menuitem action action-rename permanent"
data-action="Archive"
ng-click="cardArchive(c); $event.stopPropagation();"><span
class="icon icon-archive"></span><span><?php p($l->t('Archive')); ?></span></a>
</li>
<li ng-if="filter==='archive'">
<a class="menuitem action action-rename permanent"
data-action="Unarchive"
ng-click="cardUnarchive(c); $event.stopPropagation();"><span
class="icon icon-archive"></span><span><?php p($l->t('Unarchive')); ?></span></a>
</li>
<li>
<a class="menuitem action action-delete permanent"
data-action="Delete"
ng-click="cardDelete(c)"><span
class="icon icon-delete"></span><span><?php p($l->t('Delete')); ?></span></a>
</li>
</ul>
</div>
</div>
<div class="card-assignees" ng-if="c.assignees">
<!-- <div class="avatar" avatar user="{{c.owner}}" size="24"></div>//-->
</div>
<div class="card-controls">
<i class="icon icon-filetype-text" ng-if="c.description" title="{{ c.description }}"></i>
<div class="space"></div>
<div class="app-popover-menu-utils">
<button class="card-options icon-more" ng-model="card"></button>
<div class="popovermenu hidden">
<ul>
<li ng-if="filter!=='archive'">
<a class="menuitem action action-rename permanent"
data-action="Archive"
ng-click="cardArchive(c); $event.stopPropagation();"><span
class="icon icon-archive"></span><span><?php p($l->t('Archive')); ?></span></a>
</li>
<li ng-if="filter==='archive'">
<a class="menuitem action action-rename permanent"
data-action="Unarchive"
ng-click="cardUnarchive(c); $event.stopPropagation();"><span
class="icon icon-archive"></span><span><?php p($l->t('Unarchive')); ?></span></a>
</li>
<li>
<a class="menuitem action action-delete permanent"
data-action="Delete"
ng-click="cardDelete(c)"><span
class="icon icon-delete"></span><span><?php p($l->t('Delete')); ?></span></a>
</li>
</ul>
</div>
</div>
</div>
<!--<span class="info due"><i class="fa fa-clock-o" aria-hidden="true"></i> <span>Today</span></span>
<span class="info tasks"><i class="fa fa-list" aria-hidden="true"></i> <span>3/12</span></span>
//-->