/* pages/dan/myfav.wxss */ .filter-bar { background: #fff; padding: 20rpx 30rpx 0 } .filter-bar li { display: inline-block; padding: 0 24rpx; font-size: 28rpx; border: 1px solid #bbb; color: #555; border-radius: 4rpx; margin-right: 20rpx; height: 60rpx; line-height: 60rpx } .filter-bar li.active { color: #ff2555; border-color: #f25 } .like-tip,.loading,.nomore { text-align: center; margin: 20rpx 0; font-size: 26rpx } .like-tip { padding: 0 20rpx } .like-tip span { background: #f6f6f6; display: inline-block; width: 140rpx; font-size: 26rpx } .like-tip div { display: block; position: relative; border-top: 1px solid #ddd; width: 100%; top: -22rpx; z-index: -1 } .meili-all-vue-base-tab.tabs { overflow: initial } .tabs-content { position: relative } .tabs-bar { z-index: 10 } .meili-all-base-page-error { min-height: 8rem!important; background: #fff } .meili-all-vue-fav-base-goodscollect { background: #fff } .meili-all-vue-fav-base-goodscollect .meili-all-vue-fav-base-goodscollect-item:last-child { border-bottom: 1px solid #eee; position: relative } .meili-all-vue-fav-base-goodscollect-item { border-bottom: 1px solid #eee; padding: 20rpx 30rpx } .meili-all-vue-fav-base-goodscollect-item:last-child { border-bottom: none!important } .item { display: block; width: 100%; height: 100%; position: relative } .item-right { float: left; -moz-box-sizing: border-box; box-sizing: border-box; width: 70%; height: 206rpx; padding-left: 20rpx } .item-a { display: block; overflow: hidden; position: relative } .item-img { width: 30%; float: left } .item-img image{ width:100%; } .item-shelft { position: absolute; left: 0; bottom: 0; width: 30%; height: 44rpx; line-height: 44rpx; color: #fff; text-align: center; background: #000; background: rgba(0,0,0,.5) } .right { position: relative } .right-title { font-weight: 400; font-size: 28rpx; color: #333; line-height: 38rpx; max-height: 76rpx; overflow: hidden; letter-spacing: 0; font-family: PingFang SC } .right-hint { color: #f25; font-size: 24rpx } .right-promotion { position: absolute; height: 28rpx; left: 25rpx; bottom: 60rpx; } .right-price { position: absolute; left: 19rpx; bottom: 5rpx; font-size: 36rpx; color: #f25 } .right-price .oldprice { text-decoration: line-through; color: #999; font-size: 24rpx; vertical-align: 4rpx; } .right-alike { position: absolute; right: 0; bottom: 9rpx; min-width: 120rpx; padding: 0 5rpx; height: 50rpx; line-height: 50rpx; text-align: center; border-radius: 2rpx; border: 1px solid #333; font-size: 28rpx; color: #333 } .meili-all-vue-fav-base-goodslovely { padding: 0 8rpx; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap } .item-info { padding: 10rpx 20rpx; position: relative } .item-fav { color: #999; font-size: 24rpx; bottom: 8rpx; right: 8rpx; position: absolute } .item-fav i { margin: 0 4rpx 6rpx 2rpx; vertical-align: middle; display: inline-block; font-weight: 700; font-size: 28rpx } .item-price { font-size: 30rpx; color: #333 } .item-title { height: 72rpx; font-size: 24rpx; line-height: 36rpx; color: #333; overflow: hidden; word-wrap: break-word } .meili-all-vue-fav-base-shopscollect { background: #f6f6f6 } .meili-all-vue-fav-base-shopscollect-item { position: relative; padding: 24rpx 30rpx 40rpx; margin-bottom: 28rpx; background-color: #fff } .meili-all-vue-fav-base-shopscollect-item.invalid { padding: 2rpx 30rpx 9rpx } .head { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .head--avatar { -moz-box-sizing: content-box; box-sizing: content-box; margin-right: 20rpx } .head--info { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1 } .head--fav { width: 142rpx } .avatar-img { display: block; width: 70rpx; height: 70rpx; border-radius: 50% } .info-title { line-height: 40rpx; color: #333; font-size: 32rpx } .info-star { background: url(https://s10.mogucdn.com/p2/161114/upload_0lcb014ie35ac3bf7ecg0i9gjgcgf_25x44.png) repeat-x 0 0; background-size: auto 44rpx; width: 120rpx; height: 20rpx } .info-star--level { display: block; height: 20rpx; background: url(https://s10.mogucdn.com/p2/161114/upload_0lcb014ie35ac3bf7ecg0i9gjgcgf_25x44.png) repeat-x 0 -24rpx; background-size: auto 44rpx; } .info-star--level.is-level1 { width: 25rpx; } .info-star--level.is-level2 { width: 50rpx; } .info-star--level.is-level3 { width: 75rpx } .info-star--level.is-level4 { width: 100rpx; } .info-star--level.is-level5 { width: 125rpx; } .info-star--level.is-level6 { width: 150rpx; } .info--count.is-star { margin-top: 1rpx; } .count { font-size: 0 } .count-base { display: inline-block; line-height: 34rpx; color: #999; font-size: 24rpx } .count-fans { margin-left: 25rpx } .imgList { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row nowrap; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; position: absolute } .imgList a { margin-right: 8rpx; width: 200rpx; height: 200rpx; } .no-goods { text-align: center; line-height: 120rpx; color: #999; font-size: 15rpx; background: #eee; } .btn-uncollect { position: absolute; top: 40rpx; right: 30rpx; display: inline-block; height: 50rpx; line-height: 50rpx; width: 148rpx; font-size: 28rpx; text-align: center; border: 1px solid #333; color: #000; border-radius: 4rpx } .meili-all-vue-fav-base-shopslovely { background: #eee } .meili-all-vue-fav-base-shopslovely-item { padding: 24rpx 30rpx 40rpx; margin-bottom: 28rpx; background-color: #fff } .head { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-bottom:0rpx; } .head--avatar { -moz-box-sizing: content-box; box-sizing: content-box; margin-right: 20rpx; } .head--info { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1 } .head--fav { width: 142rpx; } .avatar-img { display: block; width: 70rpx; height: 70rpx; border-radius: 50% } .info-title { line-height: 40rpx; color: #333; font-size: 32rpx } .info-star { background: url(https://s10.mogucdn.com/p2/161114/upload_0lcb014ie35ac3bf7ecg0i9gjgcgf_25x44.png) repeat-x 0 0; background-size: auto 44rpx; width: 120rpx; height: 20rpx; } .info-star--level { display: block; height: 20rpx; background: url(https://s10.mogucdn.com/p2/161114/upload_0lcb014ie35ac3bf7ecg0i9gjgcgf_25x44.png) repeat-x 0 -24rpx; background-size: auto 44rpx; } .info-star--level.is-level1 { width: 25rpx } .info-star--level.is-level2 { width: 50rpx; } .info-star--level.is-level3 { width: 75rpx; } .info-star--level.is-level4 { width: 100rpx; } .info-star--level.is-level5 { width: 125rpx; } .info-star--level.is-level6 { width: 150rpx; } .info--count.is-star { margin-top: 1rpx; } .count { font-size: 0 } .count-base { display: inline-block; line-height: 34rpx; color: #999; font-size: 24rpx; } .count-fans { margin-left: 25rpx; } .imgList { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row nowrap; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center } .imgList a { margin-right: 8rpx; width: 224rpx; height: 224rpx; } .fav-btn { display: inline-block; text-align: center; width: 118rpx; height: 46rpx; line-height: 46rpx; margin-top: 15rpx; border: 1px solid #444; border-radius: 4rpx; color: #444; font-size: 26rpx; } .tabs { -moz-box-sizing: border-box; box-sizing: border-box; position: relative; overflow: hidden; zoom: 1; color: #666; } .tabs:after, .tabs:before { content: " "; display: table; } .tabs:after { clear: both; visibility: hidden; font-size: 0; height: 0; } .tabs-anchor .tabs-bar { width: 100%; } .tabs-bar { outline: none; width: 100%; background-color: #fff; } .tabs-bar--extra { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .tabs-bar--extra .tabs-extra--container { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .is-extra-above { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .is-extra-later { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -moz-box-orient: horizontal; -moz-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .is-extra-later .tabs-extra--container { -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .tabs-extra--container { display: none; -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; line-height: 32rpx; } .tabs-link-bar { z-index: 1; position: absolute; left: 0; bottom: 2rpx; -moz-box-sizing: border-box; box-sizing: border-box; height: 2rpx; background-color: #ff5777; -webkit-transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); transition: transform .3s cubic-bezier(.645, .045, .355, 1); transition: transform .3s cubic-bezier(.645, .045, .355, 1), -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); -webkit-transform-origin: 0 0; transform-origin: 0 0; } .tabs-bar { border-bottom: 1px solid #d9d9d9; -moz-box-sizing: border-box; box-sizing: border-box; } .tabs-nav--container { overflow: hidden; font-size: 14rpx; line-height: 1.5; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; white-space: nowrap; margin-bottom: -1px; zoom: 1; } .tabs-nav--container:after, .tabs-nav--container:before { content: " "; display: table; } .tabs-nav--container:after { clear: both; visibility: hidden; font-size: 0; height: 0; } .tabs-tab-btn-disabled { cursor: not-allowed; } .tabs-tab-btn-disabled, .tabs-tab-btn-disabled:hover { color: #ccc; } .tabs-nav--wrap { overflow: hidden; margin-bottom: -1rpx; } .tabs-nav { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 0; -webkit-transition: -webkit-transform .5s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform .5s cubic-bezier(.645, .045, .355, 1); transition: transform .5s cubic-bezier(.645, .045, .355, 1); transition: transform .5s cubic-bezier(.645, .045, .355, 1), -webkit-transform .5s cubic-bezier(.645, .045, .355, 1); position: relative; margin: 0; list-style: none; } .tabs-nav:after, .tabs-nav:before { display: table; content: " "; } .tabs-nav:after { clear: both; } .tabs-nav .tabs-tab-disabled { pointer-events: none; cursor: default; color: #ccc; } .tabs-nav .tabs-tab { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; display: block; height: 90rpx; line-height: 90rpx; margin: 0 12rpx; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; -webkit-transition: color .3s cubic-bezier(.645, .045, .355, 1); transition: color .3s cubic-bezier(.645, .045, .355, 1); cursor: pointer; text-decoration: none; text-align: center; font-size: 30rpx; color: #333; } .tabs-nav .tabs-tab:active { color: #f13e3a; } .tabs-nav .tabs-tab .anticon { width: 14rpx; height: 14rpx; margin-right: 8rpx; } .tabs-nav .tabs-tab-active { color: #ff5577; } .tabs-mini .tabs-nav--container { font-size: 12rpx; } .tabs-mini .tabs-tab { margin-right: 0; padding: 8rpx 16rpx; } .tabs:not(.tabs-vertical) .tabs-content-animated { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-direction: row; flex-direction: row; will-change: transform; -webkit-transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); transition: transform .3s cubic-bezier(.645, .045, .355, 1); transition: transform .3s cubic-bezier(.645, .045, .355, 1), -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); } .tabs-line:not(.tabs-vertical) .tabs-content-animated { } .tabs-line:not(.tabs-vertical) .tabs-content > .tabs-tabpane { overflow: hidden; } .tabs:not(.tabs-vertical) .tabs-tabpane { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; } .tabs-vertical>.tabs-bar { border-bottom: 0; } .tabs-vertical>.tabs-bar .tabs-tab { float: none; margin-right: 0; margin-bottom: 16rpx; display: block; padding: 8rpx 24rpx; } .tabs-vertical>.tabs-bar .tabs-tab:last-child { margin-bottom: 0; } .tabs-vertical>.tabs-bar .tabs-nav--container, .tabs-vertical>.tabs-bar .tabs-nav--wrap { margin-bottom: 0; } .tabs-vertical>.tabs-bar .tabs-link-bar { width: 2rpx; left: auto; height: auto; top: 0; } .tabs-vertical>.tabs-content { overflow: hidden; width: auto; } .tabs-vertical.tabs-left>.tabs-bar { float: left; border-right: 1px solid #e9e9e9; margin-right: -1rpx; margin-bottom: 0; } .tabs-vertical.tabs-left>.tabs-bar .tabs-tab { text-align: right; } .tabs-vertical.tabs-left>.tabs-bar .tabs-nav--container, .tabs-vertical.tabs-left>.tabs-bar .tabs-nav--wrap { margin-right: -1rpx; } .tabs-vertical.tabs-left>.tabs-bar .tabs-link-bar { right: 1rpx; } .tabs-vertical.tabs-left>.tabs-content { padding-left: 24rpx; border-left: 1px solid #e9e9e9; } .tabs-vertical.tabs-right>.tabs-bar { float: right; border-left: 1px solid #e9e9e9; margin-left: -1rpx; margin-bottom: 0; } .tabs-vertical.tabs-right>.tabs-bar .tabs-nav--container, .tabs-vertical.tabs-right>.tabs-bar .tabs-nav--wrap { margin-left: -1rpx; } .tabs-vertical.tabs-right>.tabs-bar .tabs-link-bar { left: 1rpx; } .tabs-vertical.tabs-right>.tabs-content { padding-right: 24rpx; border-right: 1px solid #e9e9e9; } .tabs-bottom>.tabs-bar { margin-bottom: 0; margin-top: 16rpx; } .tabs.tabs-card>.tabs-bar .tabs-link-bar { visibility: hidden; } .tabs.tabs-card>.tabs-bar .tabs-tab { margin: 0; border: 1px solid #d9d9d9; border-bottom: 0; border-radius: 6rpx 6rpx 0 0; -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1); transition: all .3s cubic-bezier(.645, .045, .355, 1); background: #f9f9f9; margin-right: 2rpx; } .tabs.tabs-card>.tabs-bar .tabs-tab-active { background: #fff; -webkit-transform: translateZ(0); transform: translateZ(0); border-color: #d9d9d9; color: #f13e3a; } .tabs.tabs-card>.tabs-bar .tabs-nav--wrap { margin-bottom: 0; } .tabs.tabs-editable-card>.tabs-bar .tabs-tab:not(.tabs-tab-active):hover { padding-left: 8rpx; padding-right: 8rpx; } .tabs-vertical .tabs-content-animated, .no-flex .tabs-content-animated { -webkit-transform: none!important; transform: none!important; } .tabs-vertical .tabs-content>.tabs-tabpane-inactive, .no-flex .tabs-content>.tabs-tabpane-inactive { display: none; } .head{ height: 90rpx; width: 100%; } .head-content{ display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; border-bottom: 1px solid #c9c7c8; height: 90rpx; line-height: 90rpx; width: 100%; background-color: #fafafa; } .head-content.is-fixed{ position: fixed; top: 0; left: 0; z-index: 100; } .head-left{ position: relative; width: 90rpx; text-align: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .head-left--back{ display: block; color: #5e5e5e; font-size: 20rpx; } .head-left--part{ position: absolute; left: 0; top: 0; width: 140rpx; } .head-title{ -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; font-size: 36rpx; color: #5e5e5e; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .head-right{ position: relative; width: 90rpx; text-align: center; font-size: 26rpx; color: #727272; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .head-right--cart{ display: block; } .head-right--part{ position: absolute; right: 0; top: 0; width: 140rpx; } .back{ -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .cart{ -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .icon-base{ background-size: 100% 100%; width: 44rpx; height: 44rpx; display: inline-block; vertical-align: middle; margin-top: -5rpx; } .m-icon{ font-size: 35rpx; } .meili-all-vue-base-button { display: inline-block; -moz-box-sizing: border-box; box-sizing: border-box; font-size: 30rpx; padding: 12rpx 25rpx; border-radius: 8rpx; vertical-align: middle; margin: 8rpx 12rpx; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; min-width: 200rpx; text-align: center; } .disabled { cursor: not-allowed; } .primary { color: white; background: #ff5777; } .primary.disabled { color: white; background: rgb(210, 210, 210); } .ghost { border: 1px solid #ff5777; color: #ff5777; } .ghost.disabled { border: 1px solid rgb(210, 210, 210); color: rgb(210, 210, 210); } .meili-all-base-page-error { height: 100%; min-height: 586rpx; width: 100%; text-align: center; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .meili-all-base-page-error img { width: 514rpx; margin-bottom: 30rpx; } .meili-all-base-page-error .title { color: #666666; font-size: 32rpx; } .meili-all-base-page-error .desc { color: #666666; font-size: 24rpx; margin-top: 20rpx; } .meili-all-base-page-error .button { margin-top: 30rpx; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } to { opacity: 1; } } .fadeIn[data-v-7e73c748] { -webkit-animation: fadeIn .8s ease both; animation: fadeIn .8s ease both; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } to { opacity: 0; } } .fadeOut[data-v-7e73c748] { -webkit-animation: fadeOut .8s ease both; animation: fadeOut .8s ease both; } .slider { position: relative; overflow: hidden; } .slider-wraper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }