.cart-page{ height: 100%; width: 100%; display: flex; flex-direction: column; .cart-tip{ display: flex; align-items:center; justify-content: center; min-height: 60px; color:#555; } .edit{ padding-right:10px; font-size:14px; } .cart-body{ height:100%; flex: 1; margin-bottom: 50px; display: flex; background-color:#fff; overflow-y: auto; position: relative; .cart-main{ width:100%; >.am-list-item{ border-bottom: 1px solid #eee; .am-list-line::after{ background-color: transparent; } } >.am-list-item.am-list-item-active{ background-color: transparent; } .cart-c-title{ display: flex; align-items: center; justify-content: space-between; >div{ flex:1; } span{ font-size:14px; margin-left:10px; } .next{ width:14px; height:14px; display: inline-block; margin-left:10px; } i{ font-style: inherit; font-size:14px; display: block; padding:0 10px; } } .cart-c-body{ .am-list-item-active{ background-color: transparent; } .am-list-line{ padding-right: 0px; } border-bottom: 1px solid #eee; .am-list-content{ position: relative; } .cart-c-item{ overflow: hidden; position: relative; padding:10px 10px 10px 0; box-sizing: border-box; .cart-c-check{ width:40px; display: flex; align-items: center; justify-content: center; height:calc(100% - 20px); box-sizing: border-box; position: absolute; } } .cart-ci-left{ position: absolute; top: 0; left: 40px; height: 100%; overflow: hidden; display: flex; justify-content: center; align-items: center; img{ height:85px; width:85px; display: block; border:1px solid #eee; } } .cart-ci-right{ min-height:87px; margin-left:135px; margin-right:8px; .am-stepper-handler{ line-height: 28px; font-size: 14px; width: 26px; height: 26px; display:flex; justify-content: center; align-items: center; } .r-title{ font-size:15px; white-space:normal; font-weight:bold; overflow : hidden; max-height: 46px; span{ overflow : hidden; text-overflow: ellipsis; display: -webkit-box; /* autoprefixer: ignore next */ -webkit-box-orient: vertical; white-space:inherit; -webkit-line-clamp: 2; } } .r-step{ display: flex; justify-content: space-between; .r-price{ color:#ff5b05; font-size:14px; line-height:30px; span{ font-size:12px; } } .span-stepper{ width:100px; } .am-stepper-input{ font-size:12px; } } } } } } .cart-footer{ width: 100%; display: flex; position: absolute; bottom: 0; justify-content: space-between; border-top:1px solid #eee; background-color:rgba(255,255,255,.7); height:50px; .cart-label{ display: flex; } &>div:nth-child(1){ text-align: center; height: 50px; line-height: 50px; padding-left: 12px; div{ font-size: $font_16; color: $color_333; margin-left: 6px; } } .all-pirce{ flex:1; margin-right: 20px; display: flex; align-items: center; p{ margin:0; padding:0; font-size: $font_16; text-align: right; width:100%; span{ color: $color_333; font-size: $font_16; } span:nth-child(2){ color: $red; } } } &>div:nth-child(3){ width: 100px; line-height: 50px; text-align: center; font-size: $font_16; background-color: $bg_ff3131; color: $white; span{ font-size: 10px; font-weight:400; } } div.active{ background-color: #ff5b05; color:#fff; } } } .shopcard-check{ display: flex; justify-items: center; align-items: center; padding-right: 12px; }