New segment style
This commit is contained in:
@@ -57,10 +57,10 @@
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/wrench.jpg)'"></div>
|
||||
<div style="margin-left: 10px; margin-top: 10px">
|
||||
<!-- <ion-label class="bold">Jonathon Williams</ion-label>-->
|
||||
<ion-label class="grey">{{blogData.post_date}}</ion-label>
|
||||
<ion-label class="grey">{{blogData.post_date | date}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
<ion-icon name="chatbubble-ellipses-outline" color="primary"></ion-icon>
|
||||
<!-- <ion-icon name="chatbubble-ellipses-outline" color="primary"></ion-icon>-->
|
||||
</div>
|
||||
|
||||
<!-- <ion-label class="head_text">About Course</ion-label>-->
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment class="common_segment" [(ngModel)]="tabs">
|
||||
<ion-segment-button value="members">
|
||||
<ion-label>Members ({{total_family}})</ion-label>
|
||||
</ion-segment-button>
|
||||
@@ -46,14 +46,15 @@
|
||||
<ion-label>Tasks ({{family_active}})</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="pending">
|
||||
<ion-label>Pending {{suggestion_total}} </ion-label>
|
||||
<ion-label>Pending ({{suggestion_total}}) </ion-label>
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
|
||||
<div *ngIf="tabs =='members'" class="lesson">
|
||||
|
||||
<div class="video" *ngFor="let item of familyData" (click)="familyMemebr(item)">
|
||||
<div class="left">
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/familymember.svg)'"></div>
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url('+item.profile_picture+')'"></div>
|
||||
|
||||
<div class="text">
|
||||
<ion-label class="bold_text">{{item.firstname}} {{item.lastname}} ({{item.age}})</ion-label>
|
||||
@@ -64,6 +65,7 @@
|
||||
<ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='lesson'" class="lesson">
|
||||
@@ -94,7 +96,7 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='pending'" class="review_tab">
|
||||
<div *ngIf="tabs =='pending'" class="lesson">
|
||||
|
||||
<div *ngIf="suggestion_total == 0">
|
||||
<ion-card>
|
||||
@@ -120,31 +122,48 @@
|
||||
<!-- <ion-label class="color">See all</ion-label>-->
|
||||
</div>
|
||||
|
||||
<div class="reviw_list" *ngFor="let item of familyPendingData">
|
||||
<div class="profile">
|
||||
<div class="left">
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
|
||||
<div style="margin-left: 10px;">
|
||||
<ion-label class="bold">{{item.title}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="select">
|
||||
<!-- <ion-icon slot="start" name="star" color="primary" class="star_icon"></ion-icon>-->
|
||||
<ion-label class="rate_num">{{item.status_text}}</ion-label>
|
||||
</div>
|
||||
<!-- <ion-icon name="ellipsis-horizontal-circle-outline"></ion-icon>-->
|
||||
<div class="video" *ngFor="let item of familyPendingData" >
|
||||
<div class="left">
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
|
||||
|
||||
<div class="text">
|
||||
<ion-label class="bold_text name_bg_text">{{item.firstname}} </ion-label>
|
||||
<ion-label class="bold_text">{{item.title}}</ion-label>
|
||||
<ion-label class="grey_text">{{item.description}}</ion-label>
|
||||
<ion-label class="extra_text"><span class="title">Added:</span> {{item.added}}</ion-label>
|
||||
<ion-label class="extra_text"><span class="title">Status:</span> {{item.status_text}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
<ion-label>{{item.description}}
|
||||
</ion-label>
|
||||
|
||||
<div class="like">
|
||||
<!-- <ion-icon slot="start" name="heart" color="danger" class="heart"></ion-icon>-->
|
||||
<ion-label class="name_bg_text">{{item.firstname}} </ion-label>
|
||||
<ion-label class="time">{{item.added}}</ion-label>
|
||||
<div class="right">
|
||||
<ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="reviw_list" *ngFor="let item of familyPendingData">-->
|
||||
<!-- <div class="profile">-->
|
||||
<!-- <div class="left">-->
|
||||
<!-- <div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>-->
|
||||
<!-- <div style="margin-left: 10px;">-->
|
||||
<!-- <ion-label class="bold">{{item.title}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="right">-->
|
||||
<!-- <div class="select">-->
|
||||
<!-- <!– <ion-icon slot="start" name="star" color="primary" class="star_icon"></ion-icon>–>-->
|
||||
<!-- <ion-label class="rate_num">{{item.status_text}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!– <ion-icon name="ellipsis-horizontal-circle-outline"></ion-icon>–>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <ion-label>{{item.description}}-->
|
||||
<!-- </ion-label>-->
|
||||
|
||||
<!-- <div class="like">-->
|
||||
<!-- <!– <ion-icon slot="start" name="heart" color="danger" class="heart"></ion-icon>–>-->
|
||||
<!-- <ion-label class="name_bg_text">{{item.firstname}} </ion-label>-->
|
||||
<!-- <ion-label class="time">{{item.added}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<!-- <div class="story-item">-->
|
||||
|
||||
@@ -1,14 +1,13 @@
|
||||
|
||||
ion-content {
|
||||
.name_bg_text{
|
||||
background-color:aliceblue;;
|
||||
font-size: 10px;
|
||||
padding-right: 5px;
|
||||
color: #8b198e;
|
||||
font-weight: bolder;
|
||||
}
|
||||
.back_image {
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
height: 230px;
|
||||
height: 200px;
|
||||
|
||||
.back {
|
||||
font-size: 25px;
|
||||
@@ -16,6 +15,16 @@ ion-content {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.extra_text{
|
||||
font-size: 11px;
|
||||
|
||||
margin-left: 20px;
|
||||
.title{
|
||||
font-weight: bolder;
|
||||
color: #030728;
|
||||
}
|
||||
}
|
||||
.due_date{
|
||||
color: red;
|
||||
font-size: 12px;
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment class="common_segment" [(ngModel)]="tabs">
|
||||
<ion-segment-button value="about">
|
||||
<ion-label>Task</ion-label>
|
||||
</ion-segment-button>
|
||||
@@ -86,7 +86,7 @@
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<div class="left">
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/task-list.svg)'"></div>
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/currency/'+item.description.toLowerCase()+'.svg)'"></div>
|
||||
<div class="text">
|
||||
<ion-label class="bold_text"> {{item.amount*0.01 | number : '1.2-2'}} {{item.description}}</ion-label>
|
||||
</div>
|
||||
@@ -187,12 +187,13 @@
|
||||
<ion-label class="dark_text">{{member_pin}}</ion-label>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<qrcode
|
||||
[qrdata]="member_qr_string"
|
||||
[width]="256"
|
||||
[errorCorrectionLevel]="'M'">
|
||||
</qrcode>
|
||||
|
||||
<div class="qr-div">
|
||||
<qrcode
|
||||
[qrdata]="member_qr_string"
|
||||
[width]="256"
|
||||
[errorCorrectionLevel]="'M'">
|
||||
</qrcode>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -45,6 +45,11 @@ ion-content {
|
||||
ion-icon {
|
||||
font-size: 22px;
|
||||
}
|
||||
qr-div{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin: 0px auto 0px auto;
|
||||
}
|
||||
}
|
||||
|
||||
.row {
|
||||
@@ -122,6 +127,7 @@ ion-content {
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
border-radius: 100%;
|
||||
color: #3dc2ff;
|
||||
}
|
||||
|
||||
.bold {
|
||||
|
||||
@@ -39,7 +39,7 @@ ion-header {
|
||||
}
|
||||
}
|
||||
.top-tool{
|
||||
--background: #f1eeeb;
|
||||
--background: #eceae9;
|
||||
border-radius: 10px;
|
||||
ion-buttons{
|
||||
ion-button{
|
||||
@@ -383,6 +383,7 @@ ion-content {
|
||||
text-align: center;
|
||||
height: 38px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
.ovf{
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@@ -34,7 +34,7 @@
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment class="common_segment" [(ngModel)]="tabs">
|
||||
<ion-segment-button value="about">
|
||||
<ion-label>Details</ion-label>
|
||||
</ion-segment-button>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<ion-content class="ion-padding">
|
||||
<div class="boxed_contents">
|
||||
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment class="common_segment" [(ngModel)]="tabs">
|
||||
<ion-segment-button value="on">
|
||||
<ion-label>Available</ion-label>
|
||||
</ion-segment-button>
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment class="common_segment" [(ngModel)]="tabs">
|
||||
<ion-segment-button value="about">
|
||||
<ion-label>Pending</ion-label>
|
||||
</ion-segment-button>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
|
||||
<ion-content class="ion-padding">
|
||||
<div class="boxed_contents">
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment class="common_segment" [(ngModel)]="tabs">
|
||||
<ion-segment-button value="tasks">
|
||||
<ion-label>Active</ion-label>
|
||||
</ion-segment-button>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
<ion-label class="color_text">Balance: {{curr_balance| number : '1.2-2'}} {{currency_description}}</ion-label>
|
||||
|
||||
|
||||
<ion-segment [(ngModel)]="tabs">
|
||||
<ion-segment class="common_segment" [(ngModel)]="tabs">
|
||||
<ion-segment-button value="bank_redeem">
|
||||
<ion-label>To Bank</ion-label>
|
||||
</ion-segment-button>
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
<div class="video wallets" *ngFor="let item of walletData">
|
||||
<div class="left">
|
||||
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/money-cycle.svg)'"></div>
|
||||
<div class="bg_image men_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/currency/'+item.code.toLowerCase()+'.svg)'"></div>
|
||||
</div>
|
||||
<div class="text">
|
||||
<ion-label class="bold_text">{{item.description}}</ion-label>
|
||||
|
||||
@@ -65,6 +65,7 @@ export class SessionDataProviderService {
|
||||
isPedningJob: number = 0;
|
||||
isOfferJob: number = 0;
|
||||
profile_pic:string='';
|
||||
profile_pic_url:string='';
|
||||
member_uid:string;
|
||||
user_state:string;
|
||||
city:string;
|
||||
@@ -98,6 +99,7 @@ export class SessionDataProviderService {
|
||||
this.balance = loginResult.balance;
|
||||
this.ccard=loginResult.ccard;
|
||||
this.profile_pic=loginResult.profile_pic;
|
||||
this.profile_pic_url = loginResult.profile_pic_url;
|
||||
this.isPedningJob = loginResult.pedningjob;
|
||||
this.isOfferJob = loginResult.offerjob;
|
||||
this.user_state=loginResult.state;
|
||||
@@ -186,8 +188,9 @@ export class SessionDataProviderService {
|
||||
profilePicture(){
|
||||
var defualtProfilePicture = "https://www.wrenchboard.com/assets/images/profile.jpg";
|
||||
var profile_p = '';
|
||||
if (this.profile_pic !=''){
|
||||
profile_p="https://www.wrenchboard.com/smedia/LIVE/profile/"+this.profile_pic;
|
||||
if (this.profile_pic_url !=''){
|
||||
//profile_p="https://www.wrenchboard.com/smedia/LIVE/profile/"+this.profile_pic;
|
||||
profile_p = this.profile_pic_url;
|
||||
}
|
||||
else{
|
||||
profile_p = defualtProfilePicture;
|
||||
|
||||
+11
-1
@@ -233,4 +233,14 @@ ion-content{
|
||||
.scan_login_button{
|
||||
font-size: 16px;
|
||||
font-weight: bolder;
|
||||
}
|
||||
}
|
||||
.common_segment{
|
||||
background-color: #3dc2ff;
|
||||
font-weight: bolder;
|
||||
ion-segment-button{
|
||||
ion-label{
|
||||
font-weight: bolder;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user