Updated page
This commit is contained in:
@@ -1,51 +1,113 @@
|
||||
<ion-content>
|
||||
<ion-card>
|
||||
<ion-card-content>
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-item>
|
||||
<ion-avatar slot="start">
|
||||
<img alt="Silhouette of a person's head" src="https://ionicframework.com/docs/img/demos/avatar.svg" />
|
||||
</ion-avatar>
|
||||
<ion-label> Avatar Item </ion-label>
|
||||
</ion-item>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-card-content>
|
||||
<ion-slides pager="true">
|
||||
<ion-slide *ngFor="let x of slides_items; let i = index">
|
||||
<ion-button shape="round" size="default" class="slide_c" outline
|
||||
(click)="selectedMenu(x)">{{x.name}}</ion-button>
|
||||
</ion-slide>
|
||||
</ion-slides>
|
||||
</ion-card>
|
||||
<div class="dash_box">
|
||||
<div class="dash_top">
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-item>
|
||||
<ion-avatar slot="start">
|
||||
<img
|
||||
alt="Silhouette of a person's head"
|
||||
src="https://ionicframework.com/docs/img/demos/avatar.svg"
|
||||
/>
|
||||
</ion-avatar>
|
||||
<ion-label> Avatar Item </ion-label>
|
||||
</ion-item>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<ion-slides pager="true">
|
||||
<ion-slide *ngFor="let x of slides_items; let i = index">
|
||||
<ion-button
|
||||
shape="round"
|
||||
size="small"
|
||||
fill="outline"
|
||||
class="slide_c"
|
||||
outline
|
||||
(click)="selectedMenu(x)"
|
||||
>{{x.name}}</ion-button
|
||||
>
|
||||
</ion-slide>
|
||||
</ion-slides>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<div class="dash_top">
|
||||
|
||||
</div>
|
||||
<ion-grid class="box_below">
|
||||
|
||||
<ion-grid>
|
||||
<ion-row class="home_box_card">
|
||||
<ion-col>
|
||||
|
||||
<ion-card class="first_card">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Card Subtitle</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Here's a small text description for the card content. Nothing more, nothing less.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
|
||||
<ion-card class="first_card">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Card Subtitle</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Here's a small text description for the card content. Nothing more, nothing less.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="home_box_card">
|
||||
<ion-col>
|
||||
|
||||
<ion-card class="first_card">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Card Subtitle</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Here's a small text description for the card content. Nothing more, nothing less.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
|
||||
<ion-card class="first_card">
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>Card Subtitle</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Here's a small text description for the card content. Nothing more, nothing less.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
|
||||
<div>{{what_is_below}}</div>
|
||||
</ion-grid>
|
||||
</div>
|
||||
<ion-grid class="box_below">
|
||||
<div>{{what_is_below}}</div>
|
||||
</ion-grid>
|
||||
</div>
|
||||
|
||||
<ion-card *ngFor="let item of blogData">
|
||||
<ion-grid>
|
||||
<ion-row class="block_list" *ngFor="let item of blogData" (click)="selectedBlog(item)">
|
||||
<ion-col><img alt={{item.post_title}} src={{item.meta_value}} /></ion-col>
|
||||
<ion-col>
|
||||
{{item.post_title}}
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
<!-- <ion-card *ngFor="let item of blogData">
|
||||
<img alt={{item.post_title}} src={{item.meta_value}} />
|
||||
<ion-card-header>
|
||||
<ion-card-subtitle>{{item.post_title}}</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
THis is some contatnts to show for noe
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
|
||||
</ion-content>
|
||||
<ion-card-content>
|
||||
|
||||
THis is some contatnts to show for noe
|
||||
</ion-card-content>
|
||||
</ion-card> -->
|
||||
|
||||
</ion-content>
|
||||
@@ -1,28 +1,51 @@
|
||||
.dash_top {
|
||||
padding: 20px 0px 0px 0px;
|
||||
position: relative;
|
||||
// top:50px;
|
||||
padding: 10px 0 0;
|
||||
position: relative;
|
||||
// top:50px;
|
||||
}
|
||||
.slide_c {
|
||||
//width: 150px;
|
||||
//background-color: red;
|
||||
padding: 0px;
|
||||
font-size: 11px;
|
||||
text-transform: uppercase;
|
||||
// width: 150px;
|
||||
// background-color: red;
|
||||
padding: 0;
|
||||
font-size: 11px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
ion-slide {
|
||||
width: unset !important;
|
||||
width: unset !important;
|
||||
}
|
||||
.box_below {
|
||||
position: relative;
|
||||
// top:65px;
|
||||
background-color: lightcoral;
|
||||
height: 80%;
|
||||
position: relative;
|
||||
// top:65px;
|
||||
background-color: lightcoral;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.dash_box {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: yellow;
|
||||
padding: 2px;
|
||||
// height: 100%;
|
||||
width: 100%;
|
||||
background-color:aliceblue;
|
||||
padding: 2px;
|
||||
margin: 0px;
|
||||
}
|
||||
.home_box_card {
|
||||
background-color: yellow;
|
||||
margin: 0px;
|
||||
// height: 280px;
|
||||
}
|
||||
|
||||
ion-card {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.first_card{
|
||||
background-image: url('../../../assets/img/myfit_home.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
height: 250px;
|
||||
}
|
||||
.block_list{
|
||||
border-radius: 5px;
|
||||
background-color: aliceblue;
|
||||
margin: 10px 5px 5px 5px;
|
||||
|
||||
}
|
||||
@@ -36,6 +36,9 @@ export class UserDashPage implements OnInit {
|
||||
this.what_is_below = menuData.name;
|
||||
}
|
||||
|
||||
selectedBlog(blogItem:any){
|
||||
alert(100);
|
||||
}
|
||||
async loadBlogData(event?: InfiniteScrollCustomEvent) {
|
||||
const loading = await this.loadingCtrl.create({
|
||||
message: 'Loading..',
|
||||
|
||||
Reference in New Issue
Block a user