|
@@ -1,36 +1,36 @@
|
|
|
ion-content {
|
|
|
- background: transparent !important; /* 确保ion-content透明 */
|
|
|
- color: var(--ion-text-color); /* 保持文本颜色 */
|
|
|
+ background: rgba(243, 181, 181, 0.8); /* 卡片背景为半透明白色,增加可读性 */
|
|
|
}
|
|
|
|
|
|
ion-card {
|
|
|
- background: transparent ; /* 确保卡片背景透明 */
|
|
|
+ background: rgba(243, 181, 181, 0.8); /* 卡片背景为半透明白色,增加可读性 */
|
|
|
}
|
|
|
|
|
|
ion-item {
|
|
|
- background: transparent ; /* 确保列表项背景透明 */
|
|
|
-
|
|
|
+ background: rgba(255, 255, 255, 0.8); /* 列表项背景为半透明白色 */
|
|
|
+ border-radius: 8px; /* 圆角 */
|
|
|
+ margin-bottom: 10px; /* 列表项之间的间距 */
|
|
|
}
|
|
|
|
|
|
ion-avatar {
|
|
|
- width: 50px ; /* 或者你需要的任何尺寸 */
|
|
|
- height: 50px ; /* 保持宽高一致,避免变形 */
|
|
|
+ width: 50px; /* 或者你需要的任何尺寸 */
|
|
|
+ height: 50px; /* 保持宽高一致,避免变形 */
|
|
|
}
|
|
|
|
|
|
ion-avatar img {
|
|
|
- width: 100% ; /* 让图片填满avatar */
|
|
|
- height: auto ; /* 保持图片比例 */
|
|
|
+ width: 100%; /* 让图片填满avatar */
|
|
|
+ height: auto; /* 保持图片比例 */
|
|
|
}
|
|
|
|
|
|
ion-searchbar {
|
|
|
- padding: 10px ; /* 内边距 */
|
|
|
- border-radius: 4px ; /* 圆角 */
|
|
|
- font-size: 16px ; /* 字体大小 */
|
|
|
+ padding: 10px; /* 内边距 */
|
|
|
+ border-radius: 4px; /* 圆角 */
|
|
|
+ font-size: 16px; /* 字体大小 */
|
|
|
}
|
|
|
|
|
|
ion-button {
|
|
|
- font-size: 15px ; /* 增大字体大小 */
|
|
|
- margin-top: 8px ; /* 上间距,仅在需要时添加 */
|
|
|
- text-transform: none ; /* 按钮文字不变形 */
|
|
|
- height: 35px ;
|
|
|
+ font-size: 15px; /* 增大字体大小 */
|
|
|
+ margin-top: 8px; /* 上间距,仅在需要时添加 */
|
|
|
+ text-transform: none; /* 按钮文字不变形 */
|
|
|
+ height: 35px;
|
|
|
}
|