|
|
@@ -5,24 +5,30 @@ ion-title {
|
|
|
margin-top: 5px;
|
|
|
}
|
|
|
|
|
|
-ion-header {
|
|
|
- background-color: #3880ff; // 设置头部背景色
|
|
|
+ ion-header {
|
|
|
+ background-color: #007aff; // 设置头部背景色为鲜艳的蓝色
|
|
|
color: white; // 设置头部文字颜色
|
|
|
}
|
|
|
|
|
|
ion-card {
|
|
|
margin: 10px; // 设置卡片之间的间距
|
|
|
- border-radius: 10px; // 设置卡片圆角
|
|
|
- box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); // 添加阴影效果
|
|
|
+ border-radius: 15px; // 设置卡片圆角
|
|
|
+ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); // 添加更明显的阴影效果
|
|
|
+ transition: transform 0.2s; // 添加过渡效果
|
|
|
+ }
|
|
|
+
|
|
|
+ ion-card:hover {
|
|
|
+ transform: scale(1.02); // 鼠标悬停时放大卡片
|
|
|
}
|
|
|
|
|
|
ion-card-header {
|
|
|
- background-color: #f0f0f0; // 设置卡片头部背景色
|
|
|
+ background-color: #e3f2fd; // 设置卡片头部背景色为浅蓝色
|
|
|
}
|
|
|
|
|
|
ion-card-title {
|
|
|
- font-size: 1.2em; // 设置卡片标题字体大小
|
|
|
+ font-size: 1.5em; // 设置卡片标题字体大小
|
|
|
font-weight: bold; // 设置卡片标题字体加粗
|
|
|
+ color: #0d47a1; // 设置标题颜色为深蓝色
|
|
|
}
|
|
|
|
|
|
ion-item {
|
|
|
@@ -31,26 +37,36 @@ ion-header {
|
|
|
|
|
|
ion-avatar {
|
|
|
border-radius: 50%; // 设置头像圆形
|
|
|
- width: 50px; // 设置头像宽度
|
|
|
- height: 50px; // 设置头像高度
|
|
|
+ width: 60px; // 设置头像宽度
|
|
|
+ height: 60px; // 设置头像高度
|
|
|
+ border: 2px solid #007aff; // 添加边框
|
|
|
}
|
|
|
|
|
|
h2 {
|
|
|
- font-size: 1em; // 设置二级标题字体大小
|
|
|
+ font-size: 1.2em; // 设置二级标题字体大小
|
|
|
margin: 0; // 去掉默认外边距
|
|
|
+ color: #1976d2; // 设置标题颜色为蓝色
|
|
|
}
|
|
|
|
|
|
p {
|
|
|
font-size: 0.9em; // 设置段落字体大小
|
|
|
- color: #666; // 设置段落��字颜色
|
|
|
+ color: #555; // 设置段落文字颜色
|
|
|
}
|
|
|
|
|
|
ion-thumbnail {
|
|
|
width: 100px; // 设置封面图宽度
|
|
|
height: 150px; // 设置封面图高度
|
|
|
+ border-radius: 10px; // 设置封面图圆角
|
|
|
}
|
|
|
|
|
|
ion-button {
|
|
|
- --background: #3880ff; // 设置按钮背景色
|
|
|
+ --background: #007aff; // 设置按钮背景色为鲜艳的蓝色
|
|
|
--color: white; // 设置按钮文字颜色
|
|
|
+ border-radius: 20px; // 设置按钮圆角
|
|
|
+ margin-left: 10px; // 设置按钮左边距
|
|
|
+ font-weight: bold; // 设置按钮文字加粗
|
|
|
+ }
|
|
|
+
|
|
|
+ ion-list {
|
|
|
+ padding: 0; // 去掉列表内边距
|
|
|
}
|