fix(mini-user): 门店核销走马灯改用 JS 位移
微信端 CSS max-content/百分比 transform 不可靠;改为测量宽度后 translateX 滚动,并上移到店名下方。 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -128,40 +128,35 @@
|
||||
}
|
||||
|
||||
.store-detail-marquee {
|
||||
margin: 0 var(--space-page) 12px;
|
||||
padding: 8px 0;
|
||||
border-radius: var(--radius-lg);
|
||||
background: rgba(166, 29, 36, 0.06);
|
||||
margin: 4px 0 12px;
|
||||
padding: 10px 0;
|
||||
border-radius: 8px;
|
||||
background: #fff7f6;
|
||||
border: 1px solid rgba(166, 29, 36, 0.12);
|
||||
overflow: hidden;
|
||||
height: 40px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.store-detail-marquee-track {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
width: max-content;
|
||||
animation-name: store-detail-marquee-scroll;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
align-items: center;
|
||||
height: 20px;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.store-detail-marquee-item {
|
||||
flex: 0 0 auto;
|
||||
padding: 0 24px;
|
||||
flex: none;
|
||||
white-space: nowrap;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
@keyframes store-detail-marquee-scroll {
|
||||
from {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
to {
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
}
|
||||
.store-detail-marquee-item-text {
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
color: #a61d24;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.store-detail-section {
|
||||
|
||||
Reference in New Issue
Block a user