|
@@ -4,66 +4,108 @@
|
|
|
知食有味
|
|
|
</ion-title>
|
|
|
<ion-buttons slot="end">
|
|
|
- <ion-button>
|
|
|
- <ion-icon name="search-outline" size="large"></ion-icon>
|
|
|
+ <ion-button shape="round">
|
|
|
+ <ion-icon name="notifications-outline" size="large"></ion-icon>
|
|
|
</ion-button>
|
|
|
</ion-buttons>
|
|
|
+
|
|
|
</ion-toolbar>
|
|
|
</ion-header>
|
|
|
<ion-content color="light">
|
|
|
+
|
|
|
+ <!--虚拟身份-->
|
|
|
+ <ion-card>
|
|
|
+ <ion-card-header>
|
|
|
+ <ion-item lines="full">
|
|
|
+ <ion-avatar slot="start">
|
|
|
+ <img alt="头像" src="https://ionicframework.com/docs/img/demos/avatar.svg" />
|
|
|
+ </ion-avatar>
|
|
|
+ <ion-label>
|
|
|
+ <ion-note>虚拟身份名</ion-note>
|
|
|
+ </ion-label>
|
|
|
+ <ion-buttons slot="end">
|
|
|
+ <ion-button shape="round">
|
|
|
+ <ion-icon name="swap-horizontal-outline"></ion-icon>
|
|
|
+ </ion-button>
|
|
|
+ </ion-buttons>
|
|
|
+ </ion-item>
|
|
|
+ <ion-item lines="none">身份标签</ion-item>
|
|
|
+ </ion-card-header>
|
|
|
+ <ion-card-content>
|
|
|
+ 你的目标内容
|
|
|
+ </ion-card-content>
|
|
|
+ </ion-card>
|
|
|
+
|
|
|
+ <!--三餐记录-->
|
|
|
<ion-card>
|
|
|
<ion-card-header>
|
|
|
<ion-card-title>今日三餐</ion-card-title>
|
|
|
</ion-card-header>
|
|
|
<ion-card-content>
|
|
|
- <ion-grid>
|
|
|
- <ion-row>
|
|
|
- <ion-col>
|
|
|
- <ion-card>
|
|
|
- <img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
|
|
- <ion-card-header>
|
|
|
- <ion-card-title>五彩虾仁炒饭</ion-card-title>
|
|
|
- </ion-card-header>
|
|
|
- <ion-card-content>
|
|
|
- 营养丰富,早餐最爱
|
|
|
- </ion-card-content>
|
|
|
- </ion-card>
|
|
|
- </ion-col>
|
|
|
- <ion-col>
|
|
|
- <ion-card>
|
|
|
- <img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
|
|
- <ion-card-header>
|
|
|
- <ion-card-title>蜜汁烤五花肉</ion-card-title>
|
|
|
- </ion-card-header>
|
|
|
- <ion-card-content>
|
|
|
- 经典家常,上桌就光盘
|
|
|
- </ion-card-content>
|
|
|
- </ion-card>
|
|
|
- </ion-col>
|
|
|
- <ion-col>
|
|
|
- <ion-card>
|
|
|
- <img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
|
|
- <ion-card-header>
|
|
|
- <ion-card-title>凉拌西蓝花</ion-card-title>
|
|
|
- </ion-card-header>
|
|
|
- <ion-card-content>
|
|
|
- 鲜香可口,美味下饭
|
|
|
- </ion-card-content>
|
|
|
- </ion-card>
|
|
|
- </ion-col>
|
|
|
- <ion-col>
|
|
|
- <ion-card>
|
|
|
- <img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
|
|
- <ion-card-header>
|
|
|
- <ion-card-title>孜然土豆</ion-card-title>
|
|
|
- </ion-card-header>
|
|
|
- <ion-card-content>
|
|
|
- 好吃下饭
|
|
|
- </ion-card-content>
|
|
|
- </ion-card>
|
|
|
- </ion-col>
|
|
|
- </ion-row>
|
|
|
- </ion-grid>
|
|
|
+ <ion-item lines="none">
|
|
|
+ <ion-label>
|
|
|
+ <h1>早饭</h1>
|
|
|
+ <p>五彩虾仁炒饭,营养丰富,早餐最爱</p>
|
|
|
+ </ion-label>
|
|
|
+ </ion-item>
|
|
|
+ <ion-item lines="none">
|
|
|
+ <ion-label>
|
|
|
+ <h1>中饭</h1>
|
|
|
+ <p>蜜汁烤五花肉,经典家常,上桌就光盘</p>
|
|
|
+ </ion-label>
|
|
|
+ </ion-item>
|
|
|
+ <ion-item lines="none">
|
|
|
+ <ion-label>
|
|
|
+ <h1>晚饭</h1>
|
|
|
+ <p>凉拌西蓝花,鲜香可口,美味下饭</p>
|
|
|
+ </ion-label>
|
|
|
+ </ion-item>
|
|
|
+ <ion-item lines="none">
|
|
|
+ <ion-buttons slot="end">
|
|
|
+ <ion-button fill="solid" shape="round" size="large">
|
|
|
+ <ion-note color="black">编辑</ion-note>
|
|
|
+ </ion-button>
|
|
|
+ </ion-buttons>
|
|
|
+ </ion-item>
|
|
|
+ </ion-card-content>
|
|
|
+ </ion-card>
|
|
|
+ <!--AI推荐-->
|
|
|
+ <ion-card>
|
|
|
+ <ion-card-header>
|
|
|
+ <ion-card-title>AI推荐</ion-card-title>
|
|
|
+ </ion-card-header>
|
|
|
+ <!--推荐内容-->
|
|
|
+ <ion-card-content>
|
|
|
+ <swiper-container>
|
|
|
+ <swiper-slide>
|
|
|
+ <ion-card>
|
|
|
+ <img alt="图像" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
|
|
+ <ion-card-header>
|
|
|
+ <ion-card-title>AI推荐食物名 1</ion-card-title>
|
|
|
+ <ion-card-subtitle>标签 </ion-card-subtitle>
|
|
|
+ </ion-card-header>
|
|
|
+ </ion-card>
|
|
|
+ </swiper-slide>
|
|
|
+ <swiper-slide>
|
|
|
+ <ion-card>
|
|
|
+ <img alt="图像" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
|
|
+ <ion-card-header>
|
|
|
+ <ion-card-title>AI推荐食物名 2</ion-card-title>
|
|
|
+ <ion-card-subtitle>标签 </ion-card-subtitle>
|
|
|
+ </ion-card-header>
|
|
|
+ </ion-card>
|
|
|
+ </swiper-slide>
|
|
|
+ <swiper-slide>
|
|
|
+ <ion-card>
|
|
|
+ <img alt="图像" src="https://ionicframework.com/docs/img/demos/card-media.png" />
|
|
|
+ <ion-card-header>
|
|
|
+ <ion-card-title>AI推荐食物名 3</ion-card-title>
|
|
|
+ <ion-card-subtitle>标签 </ion-card-subtitle>
|
|
|
+ </ion-card-header>
|
|
|
+ </ion-card>
|
|
|
+ </swiper-slide>
|
|
|
+ </swiper-container>
|
|
|
+
|
|
|
</ion-card-content>
|
|
|
</ion-card>
|
|
|
|