fix layout
This commit is contained in:
@@ -3,6 +3,7 @@ ion-content {
|
||||
.back_image {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
max-height: 150px;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
border-radius: 20px;
|
||||
|
||||
@@ -25,6 +25,14 @@
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
|
||||
|
||||
<div *ngIf="tabs =='tasks'" class="lesson">
|
||||
<div class="flex">
|
||||
<ion-label class="bold">Available Task(s)</ion-label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='tasks'" class="lesson">
|
||||
<div *ngIf="active_job_count == 0 && active_offers_count == 0 ">
|
||||
<ion-card style="background-color: #f4f1f0;">
|
||||
@@ -54,30 +62,45 @@
|
||||
<ion-button (click)="startOfferPage()" style="margin-top: 5px;" expand="block" shape="round" color="secondary">Start Now</ion-button>
|
||||
</div>
|
||||
|
||||
<div class="chat" *ngFor="let item of jobsData;" (click)="activeSeleted(item)">
|
||||
<div class="flex">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url('+session_image_server+'/'+curr_session+'/job/'+item.job_uid+')'"></div>
|
||||
<div style="margin-left: 10px;">
|
||||
<ion-label class="bold_text"> {{item.title}}</ion-label>
|
||||
<div style="display: flex;">
|
||||
<div class="grey_text" [innerHTML]="item.job_description"></div>
|
||||
</div>
|
||||
<ion-label>{{item.price*0.01}} {{item.currency}}</ion-label>
|
||||
<ion-label class="due_date">Due : {{item.delivery_date |date}}</ion-label>
|
||||
<div class="video" *ngFor="let item of jobsData;" (click)="activeSeleted(item)">
|
||||
<!-- <div class="video" *ngFor="let item of jobsData;" (click)="viewMarketItem( item )">-->
|
||||
<div class="left">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url('+session_image_server+'/'+curr_session+'/job/'+item.job_uid+')'"></div>
|
||||
|
||||
<div>
|
||||
<div class="text">
|
||||
<div class="bold_text" [innerHTML]="item.title"></div>
|
||||
<ion-label class="price_line"> Reward : {{item.price*0.01| number : '1.2-2'}} {{item.currency_code}} </ion-label>
|
||||
<ion-label class="due_date">Timeline: {{item.timeline_days}} days</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<ion-icon name="chevron-forward-outline"></ion-icon>
|
||||
<!-- <ion-label class="small_text"> 11:30 PM</ion-label>-->
|
||||
<!-- <ion-label class="color_text"> 10</ion-label>-->
|
||||
</div>
|
||||
<div class="right">
|
||||
<ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
|
||||
</div>
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="flex">-->
|
||||
<!-- <div class="bg_image back_image" [style.backgroundImage]="'url('+session_image_server+'/'+curr_session+'/job/'+item.job_uid+')'"></div>-->
|
||||
<!-- <div style="margin-left: 10px;">-->
|
||||
<!-- <ion-label class="bold_text"> {{item.title}}</ion-label>-->
|
||||
<!-- <div style="display: flex;">-->
|
||||
<!-- <div class="grey_text" [innerHTML]="item.job_description"></div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <ion-label>{{item.price*0.01}} {{item.currency}}</ion-label>-->
|
||||
<!-- <ion-label class="due_date">Due : {{item.delivery_date |date}}</ion-label>-->
|
||||
|
||||
<!-- <div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="column">-->
|
||||
<!-- <ion-icon name="chevron-forward-outline"></ion-icon>-->
|
||||
<!-- <!– <ion-label class="small_text"> 11:30 PM</ion-label>–>-->
|
||||
<!-- <!– <ion-label class="color_text"> 10</ion-label>–>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='pastdue'">
|
||||
<div *ngIf="tabs =='pastdue'" class="lesson">
|
||||
<div *ngIf="pastdue_job_count == 0">
|
||||
<ion-card>
|
||||
<img alt="WrenchBoard Past Due" src="https://www.wrenchboard.com/assets/images/apps/pastdue-task.png" />
|
||||
@@ -91,32 +114,47 @@
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
</div>
|
||||
<div class="chat" *ngFor="let item of jobsPastDueData;" (click)="activeSeleted(item)">
|
||||
<div class="flex">
|
||||
<div class="video" *ngFor="let item of jobsPastDueData;" (click)="activeSeleted(item)">
|
||||
<div class="left">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url('+session_image_server+'/'+curr_session+'/job/'+item.job_uid+')'"></div>
|
||||
<div style="margin-left: 10px;">
|
||||
<ion-label class="bold_text"> {{item.title}}</ion-label>
|
||||
<div style="display: flex;">
|
||||
<div class="grey_text" [innerHTML]="item.job_description"></div>
|
||||
<!-- <ion-label class="grey_text"> {{item.job_description}} </ion-label>-->
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<!-- <hr />-->
|
||||
<ion-label class="due_date">Due : {{item.delivery_date |date}}</ion-label>
|
||||
<ion-label *ngIf="item.ext_request !=''; " class="due_date"> Extension Request: {{item.ext_request | date}}</ion-label>
|
||||
</div>
|
||||
<div class="text">
|
||||
<div class="bold_text" [innerHTML]="item.title"></div>
|
||||
<ion-label class="price_line"> Reward : {{item.price*0.01| number : '1.2-2'}} {{item.currency_code}} </ion-label>
|
||||
<ion-label class="due_date">Timeline: {{item.timeline_days}} days</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<ion-icon name="chevron-forward-outline"></ion-icon>
|
||||
<!-- <ion-label class="small_text"> 11:30 PM</ion-label>-->
|
||||
<!-- <ion-label class="color_text"> 10</ion-label>-->
|
||||
<div class="right">
|
||||
<ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div class="flex">-->
|
||||
<!-- <div class="bg_image back_image" [style.backgroundImage]="'url('+session_image_server+'/'+curr_session+'/job/'+item.job_uid+')'"></div>-->
|
||||
<!-- <div style="margin-left: 10px;">-->
|
||||
<!-- <ion-label class="bold_text"> {{item.title}}</ion-label>-->
|
||||
<!-- <div style="display: flex;">-->
|
||||
<!-- <div class="grey_text" [innerHTML]="item.job_description"></div>-->
|
||||
<!--<!– <ion-label class="grey_text"> {{item.job_description}} </ion-label>–>-->
|
||||
|
||||
<!-- </div>-->
|
||||
<!-- <div>-->
|
||||
<!--<!– <hr />–>-->
|
||||
<!-- <ion-label class="due_date">Due : {{item.delivery_date |date}}</ion-label>-->
|
||||
<!-- <ion-label *ngIf="item.ext_request !=''; " class="due_date"> Extension Request: {{item.ext_request | date}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="column">-->
|
||||
<!-- <ion-icon name="chevron-forward-outline"></ion-icon>-->
|
||||
<!-- <!– <ion-label class="small_text"> 11:30 PM</ion-label>–>-->
|
||||
<!-- <!– <ion-label class="color_text"> 10</ion-label>–>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="tabs =='review'">
|
||||
<div *ngIf="tabs =='review'" class="lesson">
|
||||
|
||||
<div *ngIf="review_job_count == 0">
|
||||
<ion-card>
|
||||
<img alt="WrenchBoard Review" src="https://www.wrenchboard.com/assets/images/apps/review-task.png" />
|
||||
@@ -132,26 +170,42 @@
|
||||
</div>
|
||||
|
||||
|
||||
<div class="chat" *ngFor="let item of jobsInReviewData;" (click)="activeSeleted(item)">
|
||||
<div class="flex">
|
||||
<div class="video" *ngFor="let item of jobsInReviewData;" (click)="activeSeleted(item)">
|
||||
<!-- <div class="video" *ngFor="let item of jobsData;" (click)="viewMarketItem( item )">-->
|
||||
<div class="left">
|
||||
<div class="bg_image back_image" [style.backgroundImage]="'url('+session_image_server+'/'+curr_session+'/job/'+item.job_uid+')'"></div>
|
||||
<div style="margin-left: 10px;">
|
||||
<ion-label class="bold_text"> {{item.title}}</ion-label>
|
||||
<div style="display: flex;">
|
||||
<div class="grey_text" [innerHTML]="item.job_description"></div>
|
||||
</div>
|
||||
<div>
|
||||
<!-- <hr />-->
|
||||
<ion-label class="due_date">Due : {{item.delivery_date |date}}</ion-label>
|
||||
</div>
|
||||
|
||||
<div class="text">
|
||||
<div class="bold_text" [innerHTML]="item.title"></div>
|
||||
<ion-label class="price_line"> Reward : {{item.price*0.01| number : '1.2-2'}} {{item.currency_code}} </ion-label>
|
||||
<ion-label class="due_date">Timeline: {{item.timeline_days}} days</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<ion-icon name="chevron-forward-outline"></ion-icon>
|
||||
<!-- <ion-label class="small_text"> 11:30 PM</ion-label>-->
|
||||
<!-- <ion-label class="color_text"> 10</ion-label>-->
|
||||
<div class="right">
|
||||
<ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="video" *ngFor="let item of jobsInReviewData;" (click)="activeSeleted(item)">-->
|
||||
<!-- <div class="flex">-->
|
||||
<!-- <div class="bg_image back_image" [style.backgroundImage]="'url('+session_image_server+'/'+curr_session+'/job/'+item.job_uid+')'"></div>-->
|
||||
<!-- <div style="margin-left: 10px;">-->
|
||||
<!-- <ion-label class="bold_text"> {{item.title}}</ion-label>-->
|
||||
<!-- <div style="display: flex;">-->
|
||||
<!-- <div class="grey_text" [innerHTML]="item.job_description"></div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div>-->
|
||||
<!--<!– <hr />–>-->
|
||||
<!-- <ion-label class="due_date">Due : {{item.delivery_date |date}}</ion-label>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="column">-->
|
||||
<!-- <ion-icon name="chevron-forward-outline"></ion-icon>-->
|
||||
<!-- <!– <ion-label class="small_text"> 11:30 PM</ion-label>–>-->
|
||||
<!-- <!– <ion-label class="color_text"> 10</ion-label>–>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user