yangjl/sh-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

样式优化

Browse Source
This commit is contained in:
杨家亮
2026-07-06 17:56:55 +08:00
parent dd792ab197
commit 52ac32ff95
5 changed files with 158 additions and 382 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scanpages/hj/do_anti_rust.vue
-191
View File
@@ -481,197 +481,6 @@ $shadow-md: 0 2rpx 12rpx rgba(0, 0, 0, 0.04), 0 8rpx 24rpx rgba(0, 0, 0, 0.06);
}
}
// ===== 区块标题 =====
.section {
margin: 0 24rpx 20rpx;
animation: fadeUp 0.5s ease-out both;
&:nth-child(2) {
animation-delay: 0.05s;
}
&:nth-child(3) {
animation-delay: 0.15s;
}
&__header {
display: flex;
align-items: center;
gap: 12rpx;
margin-bottom: 14rpx;
padding: 0 6rpx;
}
&__bar {
width: 6rpx;
height: 26rpx;
background: linear-gradient(180deg, $primary, #6ba3ff);
border-radius: 3rpx;
flex-shrink: 0;
animation: breathe 2.5s ease-in-out infinite;
}
&__title {
font-size: 28rpx;
font-weight: 600;
color: $text;
letter-spacing: 0.5rpx;
}
.img-box {
padding: 20rpx;
border-radius: 16rpx;
background-color: #ffffff;
}
}
// ===== 信息卡片 =====
.card {
background: $card-bg;
border-radius: $radius;
overflow: hidden;
box-shadow: $shadow-md;
&__row {
display: flex;
align-items: center;
padding: 22rpx 28rpx;
border-bottom: 1rpx solid $border;
transition: background 0.25s ease;
&:last-child {
border-bottom: none;
}
&:active {
background: #f5f4f1;
}
&--stack {
flex-direction: column;
align-items: flex-start;
.card__label {
width: auto;
padding-left: 16rpx;
margin-bottom: 12rpx;
&::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 4rpx;
height: 16rpx;
background: $primary-mid;
border-radius: 2rpx;
}
}
.card__value {
width: 100%;
text-align: left;
}
.card__value-wrap {
width: 100%;
justify-content: flex-start;
}
.card__input {
text-align: left;
min-height: 132rpx;
}
.remark-input {
width: 100%;
text-align: left;
font-size: 28rpx;
color: $text;
padding: 20rpx 24rpx;
background: #f7f8fa;
border-radius: 12rpx;
line-height: 1.6;
min-height: 140rpx;
box-sizing: border-box;
&::placeholder {
color: #b0bec5;
}
}
}
}
&__label {
width: 180rpx;
font-size: 26rpx;
color: $text-secondary;
flex-shrink: 0;
position: relative;
padding-left: 16rpx;
&::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 4rpx;
height: 16rpx;
background: $primary-mid;
border-radius: 2rpx;
}
&.required::before {
background: #ff0000;
}
}
&__value {
flex: 1;
font-size: 28rpx;
color: $text;
font-weight: 500;
text-align: left;
&--placeholder {
color: #888888;
font-weight: 400;
}
}
&__value-wrap {
flex: 1;
display: flex;
align-items: center;
justify-content: flex-start;
gap: 8rpx;
&--clickable {
min-height: 48rpx;
justify-content: flex-end;
}
}
&__unit {
font-size: 24rpx;
color: $text-secondary;
flex-shrink: 0;
}
&__input {
flex: 1;
font-size: 28rpx;
color: $text;
text-align: left;
height: 48rpx;
&::placeholder {
color: #b0bec5;
}
}
}
// ===== 不合格区域切换动画 =====
.fail-section {
scanpages/hj/make_right.vue
+20 -113
View File
@@ -348,129 +348,36 @@ $shadow-md: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
}
}
// ===== 区块标题 =====
.section {
margin: 0 24rpx 20rpx;
&__header {
display: flex;
align-items: center;
gap: 12rpx;
margin-bottom: 14rpx;
padding: 0 6rpx;
// ===== 卡片页面覆盖（继承 page.scss 公共 .card 样式）=====
.card__row {
&:active {
background: #fafbfc;
}
&__bar {
width: 6rpx;
height: 26rpx;
background: linear-gradient(180deg, $primary, #6ba3ff);
border-radius: 3rpx;
flex-shrink: 0;
}
&__title {
font-size: 28rpx;
font-weight: 600;
color: $text;
letter-spacing: 0.5rpx;
}
.img-box {
padding: 20rpx;
border-radius: 16rpx;
background-color: #ffffff;
&--warn .card__label::before {
background: #ef4444;
}
}
// ===== 信息卡片 =====
.card {
background: $card-bg;
border-radius: $radius;
overflow: hidden;
box-shadow: $shadow-md;
.card__value {
text-align: right;
&__row {
display: flex;
align-items: center;
padding: 22rpx 28rpx;
border-bottom: 1rpx solid $border;
&:last-child {
border-bottom: none;
}
&:active {
background: #fafbfc;
}
&--warn .card__label::before {
background: #ef4444;
}
&--placeholder {
color: #b0bec5;
font-weight: 400;
}
}
&__label {
width: 180rpx;
font-size: 26rpx;
color: $text-secondary;
flex-shrink: 0;
position: relative;
padding-left: 16rpx;
.card__value-wrap {
justify-content: flex-end;
}
&::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 4rpx;
height: 16rpx;
background: $primary-mid;
border-radius: 2rpx;
}
}
.card__input {
text-align: right;
padding: 0;
&__value {
flex: 1;
font-size: 28rpx;
color: $text;
font-weight: 500;
text-align: right;
&--placeholder {
color: #b0bec5;
font-weight: 400;
}
}
&__value-wrap {
flex: 1;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8rpx;
&--clickable {
min-height: 48rpx;
}
}
&__input {
flex: 1;
font-size: 28rpx;
color: $text;
text-align: right;
height: 48rpx;
padding: 0;
&::placeholder {
color: #b0bec5;
}
}
&__unit {
font-size: 24rpx;
color: $text-secondary;
flex-shrink: 0;
&::placeholder {
color: #b0bec5;
}
}
scanpages/hj/materials_detail.vue
+10 -36
View File
@@ -156,64 +156,41 @@ const showPrint = ref(false)
}
// ===== 区块标题 =====
// ===== 区块标题（页面覆盖）=====
.section {
margin: 0 24rpx 20rpx;
// 无动画
animation: none;
&__header {
display: flex;
align-items: center;
gap: 12rpx;
margin-bottom: 16rpx;
padding: 0 4rpx;
}
&__bar {
width: 6rpx;
height: 28rpx;
background: $primary;
border-radius: 3rpx;
flex-shrink: 0;
}
&__title {
font-size: 28rpx;
font-weight: 600;
color: $text;
animation: none;
}
}
// ===== 卡片 =====
// ===== 卡片（页面覆盖，继承 page.scss 公共 .card 样式）=====
.card {
background: $card-bg;
border-radius: $radius;
overflow: hidden;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
&__row {
display: flex;
align-items: center;
padding: 24rpx 28rpx;
border-bottom: 1rpx solid $border;
&:last-child {
border-bottom: none;
}
}
&__label {
width: 120rpx;
font-size: 26rpx;
color: $text-secondary;
flex-shrink: 0;
padding-left: 0;
&::before {
display: none;
}
}
&__value {
flex: 1;
font-size: 28rpx;
color: $text;
font-weight: 500;
&--mono {
font-family: monospace;
color: $primary-dark;
@@ -221,9 +198,6 @@ const showPrint = ref(false)
}
&__value-wrap {
flex: 1;
display: flex;
align-items: center;
gap: 12rpx;
}
}