| 12345678910111213141516171819202122 |
- 如果您作为一名专业的前端工程师，请根据我给出的主题内容，以及市面上大部分的有运动记录功能的软件，请您用ionic的angular版本，帮我写出运动记录的页面内容，布局美化和样式搭配可以用ionic自带组件也可以适当自己发挥，但不能与我写的首页页面违和。注意字体也需要和首页字体匹配，为行书。请您写出组件HTML、scss和ts部分。这是我构思的大致框架：
- #整体布局
- 手机版竖版页面，顶部区域标题栏，中间是运动记录的内容区域。
- 整体背景主色调为黑灰色和金色，带有中国元素的纹理，可有渐变效果。
- #顶部区域
- 居中显示标题：百战鉴
- （需要与首页样式完全一致）
- #内容区域
- ##内容区域标题栏
- 在内容区域顶部呈横向长条形，主要区域印有“运动记录”四个字，最右侧添加一个小按钮印有“+”
- ##内容区域内容栏
- 由多个记录卡片组成，纵向排列
- 记录卡片：
- 长条形圆角矩形
- 最左部是不同运动类型的图标
- 中右部为主体部分，包括日期时间、运动时长、疲劳度自评分等内容（您可适当增删或更改内容）
|
