anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

prelim timeline-content styling

Browse source
This commit is contained in:
Marty Alcala 2016-10-11 16:48:03 -04:00
commit 908bbdff9c
2 changed files with 40 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/sass/views/includes/txp-details.scss
View file

@ -66,12 +66,18 @@
}
}
}
.item-divider {
padding-top: 1.2rem;
color: $item-label-color;
font-size: 15px;
}
.payment-proposal-to {
width: 100%;
display: inline-block;
padding: 8px 13px;
background-color: rgba(203, 203, 203, .13);
margin-top: 10px;
margin-bottom: 5px;
display: flex;
align-items: center;
border-radius: 4px;
@ -114,6 +120,30 @@
box-shadow: none;
}
}
.timeline-item {
> * {
padding-right: 0;
}
}
.timeline-content {
display: flex;
align-items: center;
&__label {
flex-grow: 1;
> .action {
font-size: 16px;
}
> .name {
color: #aaa;
font-size: 14px;
}
}
}
}
.accept-slide {
position: fixed;

17
www/views/modals/txp-details.html
View file

@ -1,7 +1,8 @@
<ion-modal-view id="txp-details" ng-controller="txpDetailsController" ng-init="init()">
<ion-header-bar align-title="center" class="bar-royal wallet-color-header-bar" ng-style="{'background-color': wallet.color}">
<ion-header-bar align-title="center" class="bar-royal">
<button class="button button-clear" ng-click="close()">
Close
<!-- <i class="icon ion-ios-arrow-thin-left"></i> -->
</button>
<div class="title" translate>
Payment Proposal
@ -131,17 +132,19 @@
<div ng-if="actionList[0]">
<div class="item item-divider" translate>Timeline</div>
<div class="item" ng-class="{'action-created' : a.type == 'created' || a.type == 'accept', 'action-rejected' : a.type == 'reject'}" ng-repeat="a in actionList track by $index">
<div class="item timeline-item" ng-class="{'action-created' : a.type == 'created' || a.type == 'accept', 'action-rejected' : a.type == 'reject'}" ng-repeat="a in actionList track by $index">
<div class="row">
<div class="col col-10">
<span id="timeline-icon">{{$index + 1}}</span>
<span class="timeline-icon">{{$index + 1}}</span>
</div>
<div class="col">
<div>{{a.description}}</div>
<div class="col timeline-content">
<div class="timeline-content__label">
<div class="action">{{a.description}}</div>
<div class="name">{{a.by}}</div>
</div>
<div>
<span>{{a.by}}</span>
<span class="item-note">
<time>{{ a.time * 1000 | amDateFormat:'MM/DD/YYYY HH:mm a'}}</time>
<time>{{ a.time * 1000 | amDateFormat:'HH:mm a'}}</time>
</span>
</div>
</div>