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

Fix button clickable area

Browse Source 
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2017-05-24 16:32:41 +02:00
parent 1143f0807c
commit 0b7b89b602
2 changed files with 33 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
css/style.css
View File

@@ -42,12 +42,12 @@ input.input-inline {
margin: -4px 0; margin: -4px 0;
} }
button { button.button-inline {
border: 0; border: 0;
background-color: transparent; background-color: transparent;
} }
button:hover { button.button-inline:hover {
border: 0; border: 0;
background-color: transparent; background-color: transparent;
} }
@@ -175,11 +175,14 @@ button:hover {
} }
#board-header-controls-menu { #board-header-controls-menu {
display: none; display: none;
padding: 5px 6px 5px 7px;
} }
#board-header-controls-menu #popover-controls { #board-header-controls-menu button {
padding: 15px 20px 15px 20px;
}
#board-header-controls-menu #popover-controls {
display: flex; display: flex;
align-items: center; align-items: center;
padding-left: 3px; padding-left: 3px;

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

@@ -20,25 +20,21 @@
ng-blur="status.addStack=false" ng-blur="status.addStack=false"
ng-model="newStack.title" required ng-model="newStack.title" required
maxlength="100" /> maxlength="100" />
<button class="icon icon-add" style="opacity: {{status.addStack ? 1: 0.5}};" type="submit"></button> <button class="button-inline icon icon-add" style="opacity: {{status.addStack ? 1: 0.5}};" type="submit"></button>
</form> </form>
</div> </div>
<div class="board-action-button button" ng-if="filter!='archive'"> <a class="board-action-button button" ng-if="filter!='archive'" ng-click="switchFilter('archive')" style="opacity:0.5;" title="<?php p($l->t('Show archived cards')); ?>">
<a ng-click="switchFilter('archive')" style="opacity:0.5;" title="<?php p($l->t('Show archived cards')); ?>"><span class="icon icon-archive"></span></a> <i class="icon icon-archive"></i>
</div> </a>
<div class="board-action-button button" ng-if="filter=='archive'"> <a class="board-action-button button" ng-if="filter=='archive'" ng-click="switchFilter('')" title="<?php p($l->t('Hide archived cards')); ?>">
<a ng-click="switchFilter('')" title="<?php p($l->t('Hide archived cards')); ?>"> <i class="icon icon-archive"></i>
<i class="icon icon-archive"></i> </a>
</a> <a class="board-action-button button" ui-sref="board.detail({ id: id })" title="<?php p($l->t('Board details')); ?>">
</div> <i class="icon icon-details"></i>
<div class="board-action-button button"> </a>
<a ui-sref="board.detail({ id: id })" title="<?php p($l->t('Board details')); ?>">
<i class="icon icon-details"></i>
</a>
</div>
</div> </div>
<div id="board-header-controls-menu" class="app-popover-menu-utils button"> <div id="board-header-controls-menu" class="app-popover-menu-utils">
<button class="icon-more"></button> <button class="icon-more button board-action-button"></button>
<div class="popovermenu hidden"> <div class="popovermenu hidden">
<div id="popover-controls"> <div id="popover-controls">
<div id="stack-add" ng-if="boardservice.canEdit() && checkCanEdit()"> <div id="stack-add" ng-if="boardservice.canEdit() && checkCanEdit()">
@@ -48,24 +44,18 @@
ng-blur="status.addStack=false" ng-blur="status.addStack=false"
ng-model="newStack.title" required ng-model="newStack.title" required
maxlength="100" /> maxlength="100" />
<button class="icon icon-add" style="opacity: {{status.addStack ? 1: 0.5}};" type="submit"></button> <button class="button-inline icon icon-add" style="opacity: {{status.addStack ? 1: 0.5}};" type="submit"></button>
</form> </form>
</div> </div>
<div class="board-action-button button" ng-if="filter!='archive'"> <a class="board-action-button button" ng-if="filter!='archive'" ng-click="switchFilter('archive')" style="opacity:0.5;" title="<?php p($l->t('Show archived cards')); ?>">
<a ng-click="switchFilter('archive')" style="opacity:0.5;" title="<?php p($l->t('Show archived cards')); ?>"> <i class="icon icon-archive"></i>
<i class="icon icon-archive"></i> </a>
</a> <a class="board-action-button button" ng-if="filter=='archive'" ng-click="switchFilter('')" title="<?php p($l->t('Hide archived cards')); ?>">
</div> <i class="icon icon-archive"></i>
<div class="board-action-button button" ng-if="filter=='archive'"> </a>
<a ng-click="switchFilter('')" title="<?php p($l->t('Hide archived cards')); ?>"> <a class="board-action-button button" ui-sref="board.detail({ id: id })" title="<?php p($l->t('Board details')); ?>">
<i class="icon icon-archive"></i> <i class="icon icon-details"></i>
</a> </a>
</div>
<div class="board-action-button button">
<a ui-sref="board.detail({ id: id })" title="<?php p($l->t('Board details')); ?>">
<i class="icon icon-details"></i>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -87,9 +77,9 @@
required maxlength="100"/> required maxlength="100"/>
</form> </form>
<div ng-if="!s.status.editStack" class="stack-actions"> <div ng-if="!s.status.editStack" class="stack-actions">
<button class="icon-rename" <button class="icon-rename button-inline"
ng-click="s.status.editStack=true"></button> ng-click="s.status.editStack=true"></button>
<button class="icon-delete" <button class="icon-delete button-inline"
ng-click="stackservice.delete(s.id)"></button> ng-click="stackservice.delete(s.id)"></button>
</div> </div>
</h2> </h2>
@@ -119,7 +109,7 @@
<div class="card-controls"> <div class="card-controls">
<i class="icon icon-filetype-text" ng-if="c.description" title="{{ c.description }}"></i> <i class="icon icon-filetype-text" ng-if="c.description" title="{{ c.description }}"></i>
<div class="app-popover-menu-utils"> <div class="app-popover-menu-utils">
<button class="card-options icon-more" ng-model="card"></button> <button class="button-inline card-options icon-more" ng-model="card"></button>
<div class="popovermenu hidden"> <div class="popovermenu hidden">
<ul> <ul>
<li ng-if="filter!=='archive'"> <li ng-if="filter!=='archive'">