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

Change style of add card buttons to be less distracting

Browse Source 
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
Jan-Christoph Borchardt
2017-09-29 10:10:12 +02:00
committed by Julius Härtl
parent 10c836d864
commit d2dde30098
2 changed files with 22 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
css/style.scss
View File

@@ -334,7 +334,8 @@ input.input-inline {
white-space: normal;
position: relative;
opacity: 1.0;
-webkit-box-shadow: 0 0 5px $color-darkgrey;
box-shadow: 0 0 3px $color-darkgrey;
border-radius: 3px;
&:last-child {
margin: 10px;
@@ -463,34 +464,38 @@ input.input-inline {
&.create {
text-align: center;
padding: 10px;
margin: 10px;
border: none;
margin: 20px 10px 10px;
border: 1px solid;
border-radius: 3px;
background-color: transparent;
overflow: hidden;
-webkit-box-shadow: none;
box-shadow: none;
cursor: pointer;
&.emptyStack {
margin-top: 10px;
}
&:hover {
text-align: center;
opacity: 1;
}
.icon-add {
padding: 20px;
}
h4 {
width: 100%;
padding: 0;
margin: 0 0 1px;
margin: 0;
input {
width: 100%;
border: 0;
font-weight: bold;
font-size: 10pt;
margin: 0;
padding: 0;
border-bottom: 1px solid $color-primary-text;
border-radius: 0;
color: $color-primary-text;
background-color: transparent !important;
min-height: initial;
padding: 10px;
}
}
}

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

@@ -107,20 +107,20 @@
</ul>
<!-- CREATE CARD //-->
<div class="card create"
ng-style="{'background-color':'#{{ boardservice.getCurrent().color }}'}" ng-if="boardservice.canEdit() && checkCanEdit() && filter!=='archive'">
<div class="card create" ng-class="{emptyStack: !s.cards.length}"
ng-style="{'border-color':'#{{ boardservice.getCurrent().color }}'}" ng-if="boardservice.canEdit() && checkCanEdit() && filter!=='archive'">
<form ng-submit="createCard(s.id, newCard.title)">
<h4 ng-if="status.addCard[s.id]">
<input type="text" autofocus-on-insert
ng-model="newCard.title"
ng-blur="status.addCard[s.id]=false"
ng-style="{'color':'{{ boardservice.getCurrent().color | textColorFilter }}','border-color':'{{ boardservice.getCurrent().color | textColorFilter }}'}"
ng-style="{'border-color':'{{ boardservice.getCurrent().color | textColorFilter }}'}"
maxlength="100"
required placeholder="<?php p($l->t('Enter a card title')); ?>"/>
</h4>
</form>
<div ng-if="!status.addCard[s.id]" ng-click="status.addCard[s.id]=true" title="<?php p($l->t('Add card')); ?>">
<i class="icon icon-add{{ boardservice.getCurrent().color | iconWhiteFilter }}"></i>
<i class="icon icon-add"></i>
<span class="hidden-visually"><?php p($l->t('Add card')); ?></span>
</div>
</div>