2025-10-10 10:56:33 +08:00
|
|
|
|
// 测试用的 iconfont，可生效
|
2025-10-15 16:03:42 +08:00
|
|
|
|
@import './iconfont.css';
|
|
|
|
|
|
@import './color.scss';
|
|
|
|
|
|
@import './base.css';
|
2025-11-25 17:02:05 +08:00
|
|
|
|
// .test {
|
|
|
|
|
|
// // 可以通过 @apply 多个样式封装整体样式
|
|
|
|
|
|
// @apply mt-4 ml-4;
|
2025-10-10 10:56:33 +08:00
|
|
|
|
|
2025-11-25 17:02:05 +08:00
|
|
|
|
// padding-top: 4px;
|
|
|
|
|
|
// color: red;
|
|
|
|
|
|
// }
|
2025-10-10 10:56:33 +08:00
|
|
|
|
|
|
|
|
|
|
:root,
|
|
|
|
|
|
page {
|
|
|
|
|
|
// 修改按主题色
|
|
|
|
|
|
// --wot-color-theme: #37c2bc;
|
|
|
|
|
|
|
|
|
|
|
|
// 修改按钮背景色
|
|
|
|
|
|
// --wot-button-primary-bg-color: green;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*
|
|
|
|
|
|
border-t-1
|
|
|
|
|
|
由于uniapp中无法使用*选择器，使用魔法代替*，加上此规则可以简化border与divide的使用，并提升布局的兼容性
|
|
|
|
|
|
1. 防止padding和border影响元素宽度。 (https://github.com/mozdevs/cssremedy/issues/4)
|
|
|
|
|
|
2. 允许仅通过添加边框宽度来向元素添加边框。 (https://github.com/tailwindcss/tailwindcss/pull/116)
|
|
|
|
|
|
3. [UnoCSS]: 允许使用css变量'--un-default-border-color'覆盖默认边框颜色
|
|
|
|
|
|
*/
|
|
|
|
|
|
// 这个样式有重大BUG，先去掉！！(2025-08-15)
|
|
|
|
|
|
// :not(not),
|
|
|
|
|
|
// ::before,
|
|
|
|
|
|
// ::after {
|
|
|
|
|
|
// box-sizing: border-box; /* 1 */
|
|
|
|
|
|
// border-width: 0; /* 2 */
|
|
|
|
|
|
// border-style: solid; /* 2 */
|
|
|
|
|
|
// border-color: var(--un-default-border-color, #e5e7eb); /* 3 */
|
|
|
|
|
|
// }
|
2025-10-15 16:03:42 +08:00
|
|
|
|
|
|
|
|
|
|
.flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.b-body-gray {
|
|
|
|
|
|
background-color: $backgroud-gray;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.common-card {
|
|
|
|
|
|
width: calc(100% - 32px);
|
|
|
|
|
|
background-color: white;
|
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
|
padding: 16px;
|
|
|
|
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bottom-button-zaping {
|
|
|
|
|
|
padding: 30rpx;
|
|
|
|
|
|
width: calc(100% - 60rpx);
|
|
|
|
|
|
padding-bottom: 50rpx;
|
|
|
|
|
|
background-color: white;
|
|
|
|
|
|
}
|
2025-11-25 17:02:05 +08:00
|
|
|
|
|
|
|
|
|
|
.text-ellipsis-2 {
|
|
|
|
|
|
white-space: normal; /* 允许换行 */
|
|
|
|
|
|
word-wrap: break-word; /* 长单词断行 */
|
|
|
|
|
|
overflow-wrap: break-word; /* 同上 */
|
|
|
|
|
|
overflow: hidden; /* 隐藏溢出内容 */
|
|
|
|
|
|
text-overflow: ellipsis; /* 溢出时显示省略号 */
|
|
|
|
|
|
display: -webkit-box; /* 使用弹性盒子模型 */
|
|
|
|
|
|
-webkit-line-clamp: 2; /* 限制为 2 行 */
|
|
|
|
|
|
-webkit-box-orient: vertical; /* 垂直排列 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* 卡片样式 */
|
|
|
|
|
|
.y_card_wrapper {
|
|
|
|
|
|
padding: 20rpx;
|
|
|
|
|
|
width: calc(100% - 40rpx);
|
|
|
|
|
|
|
|
|
|
|
|
.card_box {
|
|
|
|
|
|
padding: 30rpx 20rpx;
|
|
|
|
|
|
width: calc(100% - 40rpx);
|
|
|
|
|
|
border-radius: 10rpx;
|
|
|
|
|
|
background-color: white;
|
|
|
|
|
|
box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1);
|
|
|
|
|
|
|
|
|
|
|
|
.card_row {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: row;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
margin-bottom: 30rpx;
|
|
|
|
|
|
|
|
|
|
|
|
&_key {
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
width: 150rpx;
|
|
|
|
|
|
color: #a6a6a6;
|
|
|
|
|
|
}
|
|
|
|
|
|
&_value {
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
color: #373737;
|
|
|
|
|
|
width: calc(100% - 160rpx);
|
|
|
|
|
|
white-space: normal; /* 允许换行 */
|
|
|
|
|
|
word-wrap: break-word; /* 长单词断行 */
|
|
|
|
|
|
overflow-wrap: break-word; /* 同上 */
|
|
|
|
|
|
}
|
|
|
|
|
|
&_value_two {
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
color: #373737;
|
|
|
|
|
|
width: calc(100% - 200rpx);
|
|
|
|
|
|
white-space: normal; /* 允许换行 */
|
|
|
|
|
|
word-wrap: break-word; /* 长单词断行 */
|
|
|
|
|
|
overflow-wrap: break-word; /* 同上 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
&_link {
|
|
|
|
|
|
width: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
&_small_text {
|
|
|
|
|
|
color: #c8c7c9;
|
|
|
|
|
|
font-size: 26rpx;
|
|
|
|
|
|
margin: 6rpx 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
&:last-child {
|
|
|
|
|
|
margin-bottom: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
