stylize page

This commit is contained in:
Siwat Sirichai 2021-12-08 22:59:01 +07:00
parent e4002ce835
commit cbe88e15f4
4 changed files with 58 additions and 11 deletions

View file

@ -8,17 +8,26 @@
<ion-toolbar>
<ion-searchbar [(ngModel)]="searchbar" (search)="search($event)"></ion-searchbar>
</ion-toolbar>
<ion-item *ngFor="let item of current">
<ion-card *ngFor="let item of current">
<ion-card-header style="height: 10px">{{item.time}}</ion-card-header>
<ion-card-title>
<ion-item>
<ion-icon size="large" name="apps-outline"></ion-icon>
<span class="text">
<center>
<h1>&nbsp;&nbsp;&nbsp;{{item.web}}</h1>
</center>
</span>
</ion-item>
</ion-card-title>
<ion-card-content>
<h6><b><ion-icon name="ellipsis-vertical-outline"></ion-icon>&nbsp;Category: </b>{{capitalizeFirstLetter(item.category)}}<br></h6>
<h6><b><ion-icon name="list-outline"></ion-icon>&nbsp;Type: </b>{{capitalizeFirstLetter(item.type)}}<br></h6>
</ion-card-content>
<h2><b>web: </b>{{item.web}}<br></h2>
<h6><b>category: </b>{{item.category}}<br></h6>
<h6><b>Type: </b>{{item.type}}<br></h6>
<h6><b>time: </b>{{item.time}}<br></h6>
</ion-item>
</ion-card>
<ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)">
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more data...">
<ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
</ion-content>