/* start--微信小程序编译后页面有组件名的元素，特别处理--start */
|
/* #ifdef MP-WEIXIN || MP-QQ */
|
u-td, u-th { flex: 1; align-self: stretch; }
|
|
.u-td { height: 100%; }
|
|
u-icon { display: inline-flex; align-items: center; }
|
|
// 各家小程序宫格组件外层设置为100%，避免受到父元素display: flex;的影响
|
u-grid { width: 100%; flex: 0 0 100%; }
|
|
// 避免小程序线条组件因为父组件display: flex;而失效
|
u-line { flex: 1; }
|
|
u-switch { display: inline-flex; align-items: center; }
|
|
u-dropdown { flex: 1; }
|
/* #endif */
|
/* end-微信小程序编译后页面有组件名的元素，特别处理--end */
|
|
|
/* #ifdef MP-QQ || MP-TOUTIAO */
|
// 需要做这一切额外的兼容，都是因为TX的无能
|
u-icon { line-height: 0; }
|
/* #endif */
|
|
/* start--头条小程序编译后页面有组件名的元素，特别处理--start */
|
// 由于头条小程序不支持直接组件名形式写样式，目前只能在写组件的时候给组件加上对应的类名
|
/* #ifdef MP-TOUTIAO */
|
.u-td, .u-th, .u-tr { flex: 1; align-self: stretch; }
|
|
.u-row, .u-col { flex: 1; align-self: stretch; }
|
|
// 避免小程序线条组件因为父组件display: flex;而失效
|
.u-line { flex: 1; }
|
|
.u-dropdown { flex: 1; }
|
/* #endif */
|
/* end-头条小程序编译后页面有组件名的元素，特别处理--end */
|
|
|
|
|
|
|
//占位使用,结合顶部通用标题
|
.coreshop-seat-height { width: 100%; /* #ifndef MP */ height: calc(var(--status-bar-height) + 50px); /* #endif */ /* #ifdef MP */ height: calc(var(--status-bar-height) + 70px); /* #endif */ }
|
|
//占位线
|
.coreshop-solid-line { width: 100%; height: 1px; background: #f9f9f9; }
|
.coreshop-coreshop-solid-top::after { border-top: 1px solid rgba(0, 0, 0, 0.1); }
|
|
|
|
// 格式化页面
|
.coreshop-pageBox { height: 100%; width: 100%; display: flex; flex-direction: column; justify-content: space-between; overflow-x: hidden; background: #f6f6f6; }
|
.coreshop-scroll-box { flex: 1; height: 100%; position: relative; }
|
.coreshop-content-box { flex: 1; overflow-y: auto; }
|
|
|
|
/*头像大小自定义*/
|
.coreshop-head-icon { width: 20px; height: 20px; display: inline-block; margin-right: 4px; }
|
|
|
|
//底部按钮框样式
|
.coreshop-bottomBox { background-color: #fff; position: fixed; bottom: 0; height: 45px; width: 100%; display: flex; z-index: 66; box-shadow: 0 0 10px #ccc;
|
.coreshop-btn { flex: 1; }
|
}
|
.coreshop-category-bottomBox { background-color: #fff; bottom: 0; /*height: 45px;*/ width: 100%; display: flex; z-index: 66; box-shadow: 0 0 10px #ccc;
|
view { width: calc(50% - 10px); margin: 5px; }
|
}
|
|
|
//底部多按钮区
|
.coreshop-add-btn-view-box { position: fixed; z-index: 10000; bottom: 90px; right: 14px;
|
.cu-btn { margin: auto; width: 40px; height: 40px; font-weight: 800; border-radius: 50%; font-size: 18px; border: 5px solid #fff; box-shadow: 0 0 7px 4px #d0d0d0; }
|
}
|
|
//底部浮动区域，用于放置按钮内容
|
.coreshop-footer-fixed { position: fixed; z-index: 100; width: 100%; bottom: 0; left: 0; padding: 5px 20px; min-height: 60px; display: flex; align-items: center; flex-direction: row; justify-content: center; }
|
.coreshop-foot-padding-bottom { padding-bottom: calc(env(safe-area-inset-bottom) / 2); }
|
.coreshop-tip-view { position: relative; padding: 5px 11px;
|
.coreshop-content { position: relative; padding-right: 28px; }
|
.coreshop-icon { position: absolute; font-size: 16px; right: 14px; color: #8799a3; top: 5px; }
|
}
|
|
/*底部*/
|
.wecanui-footer-fixed { position: fixed; z-index: 10000; width: 100%; bottom: 0; left: 0; }
|
.wecanui-footer-fixed.foot-pb { padding-bottom: calc(env(safe-area-inset-bottom) / 2); }
|
.wecanui-footer-tabbar-hight-view { position: relative; width: 100%; height: calc((env(safe-area-inset-bottom) / 2) + 68px); }
|
.cu-form-group picker .picker { text-align: left; }
|
|
/*浮动按钮*/
|
.floatingButton { width: 40px; height: 40px; background-color: #fff; border-radius: 50%; position: fixed; right: 20px; bottom: 50px; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 5px #ccc; padding: 0; z-index: 996; }
|
.floatingButton .icon { width: 30px; height: 30px; }
|
|
//顶部搜索框导航条设置
|
.coreshop-bar-search-title-box {
|
.cu-bar .action > text[class*="cuIcon-"] { font-size: 18px; }
|
}
|
|
//滚动商品图标颜色
|
.coreshop-goods-swiper-view {
|
swiper.screen-swiper .uni-swiper-dot { background: #f0f0f0; }
|
swiper.screen-swiper.square-dot .uni-swiper-dot { background-color: #aaaaaa; }
|
}
|
|
|
/*分享浮层*/
|
.coreshop-share-Box { width: 100%; background: #FFFFFF; }
|
.coreshop-share-pop { width: 100%; display: flex; }
|
.coreshop-share-item { flex: 1; text-align: center; font-size: 13px; color: #333; padding: 10px 0;
|
image { width: 40px; height: 40px; margin: 10px; }
|
.coreshop-btn { line-height: 1; display: block; font-size: 13px; background-color: #fff; }
|
}
|
.coreshop-share-bottomBox { background-color: #fff; height: 45px; width: 100%; display: flex; box-shadow: 0 0 10px #ccc;
|
.coreshop-btn { flex: 1; }
|
}
|
|
//顶部通用标题
|
.coreshop-bar-view-box { position: fixed; top: 0; width: 100%; z-index: 10000; background: #FAFAFA; /* #ifndef MP */ height: calc(var(--status-bar-height) + 50px); /* #endif */ /* #ifdef MP */ height: calc(var(--status-bar-height) + 65px); /* #endif */ padding: var(--status-bar-height) 14px 0 14px; align-items: center;
|
.coreshop-bar-box { position: relative; width: 100%; align-items: center; line-height: 50px;
|
.close { position: absolute; right: 14px; font-size: 20px; bottom: 5px; }
|
}
|
.coreshop-small-routine-title { padding: 10px 0; }
|
}
|
|
|
/*通用列表*/
|
.coreshop-cell-group { background-color: #fff;
|
.coreshop-cell-item { padding: 10px 13px 10px 10px; border-bottom: 1px solid #f3f3f3; position: relative; background-color: #fff; color: #333; display: flex; min-height: 45px; align-items: center; justify-content: space-between; flex-direction: row;
|
.coreshop-cell-item-hd { display: flex; align-items: center; font-size: 14px; position: relative;
|
.coreshop-cell-hd-title { display: inline-block; position: relative; /* #ifdef MP-ALIPAY */ top: 2px; /* #endif */ }
|
.coreshop-cell-bd-input { display: inline-block; float: left; font-size: 13px; }
|
}
|
.coreshop-cell-item-bd { display: flex; min-height: 15px; overflow: hidden; align-items: center; padding-right: 15px;
|
.coreshop-cell-bd-view { position: relative; display: flex;
|
.coreshop-cell-bd-text { position: relative; font-size: 12px; }
|
}
|
}
|
.coreshop-cell-item-ft { display: flex; align-items: center;
|
.coreshop-cell-ft-view { position: relative; overflow: hidden; color: #666; font-size: 12px; text-align: right; }
|
.coreshop-cell-ft-text { font-size: 14px; float: right; position: relative; line-height: 25px; }
|
}
|
}
|
.coreshop-cell-item:last-child { border: none; }
|
.coreshop-cell-textarea { }
|
.right-img {
|
.coreshop-cell-item-ft { right: 4px; height: 25px; position: absolute; }
|
}
|
}
|
|
|
/*二列商品列表展示*/
|
.coreshop-goods-group { border-radius: 8px; color: #333333 !important; margin: 0 5px;
|
.good_box { border-radius: 8px; margin: 3px; background-color: #ffffff; padding: 5px; position: relative; width: calc(100% - 6px);
|
.good_title { font-size: 13px; margin-top: 5px; color: $u-main-color; }
|
.good_title-xl { font-size: 14px; margin-top: 5px; color: $u-main-color; }
|
.good_image { width: 100%; border-radius: 4px; }
|
.good-tag-hot { display: flex; margin-top: 5px; position: absolute; top: 7.5px; left: 7.5px; background-color: $u-type-error; color: #ffffff; display: flex; align-items: center; padding: 2px 7px; border-radius: 25px; font-size: 10px; line-height: 1; }
|
.good-tag-recommend { display: flex; margin-top: 5px; position: absolute; top: 7.5px; right: 7.5px; background-color: $u-type-primary; color: #ffffff; margin-left: 10px; border-radius: 25px; line-height: 1; padding: 2px 7px; display: flex; align-items: center; border-radius: 25px; font-size: 10px; }
|
.good-tag-recommend2 { display: flex; margin-top: 5px; position: absolute; bottom: 7.5px; left: 7.5px; background-color: $u-type-primary; color: #ffffff; border-radius: 25px; line-height: 1; padding: 2px 7px; display: flex; align-items: center; border-radius: 25px; font-size: 10px; }
|
.good-price { font-size: 15px; color: $u-type-error; margin-top: 5px; }
|
.good-des { font-size: 10px; color: $u-tips-color; margin-top: 5px; }
|
.grid-text { font-size: 14px; margin-top: 2px; color: $u-type-info; }
|
}
|
}
|
|
|
|
/*优惠券列表*/
|
.coreshop-coupon {
|
.coreshop-coupon-card-view { position: relative;
|
.card-price-view { position: relative; background: #FFF5F5; border-radius: 7px 7px 0 0; padding: 9px;
|
.price-left-view { position: absolute; height: 63px; width: 78px; text-align: center; line-height: 63px;
|
.price { font-size: 23px; font-weight: 400; }
|
.icon { width: 61px; height: 48px; margin-top: 50%; transform: translateY(-50%); overflow: initial; }
|
}
|
.name-content-view { position: relative; padding-left: 82px; /*padding-right: 53px;*/ line-height: 1.8; color: #999898; }
|
.name-content-view::before { content: ''; position: absolute; top: -9px; bottom: -9px; margin-left: -9px; border-left: 1px dashed #fdbabc; }
|
.btn-right-view { position: absolute; right: 10px; top: 15px;
|
.u-size-medium { padding: 0; }
|
}
|
}
|
.card-num-view { position: relative; background: #FFECED; border-radius: 0 0 7.5px 7.5px; border-top: 1px dashed #dedbdb; padding: 5px 5px; color: #999898;
|
.btnUnfold { position: absolute; right: 14px; top: 7.5px; }
|
}
|
/* .card-num-view::before { content: ''; position: absolute; width: 18px; height: 18px; background: #ffffff; border-radius: 50%; top: -9px; left: -9px; }
|
.card-num-view::after { content: ''; position: absolute; width: 18px; height: 18px; background: #ffffff; border-radius: 50%; top: -9px; right: -9px; }*/ }
|
|
.coreshop-lower-shelf {
|
.card-price-view { opacity: 0.5; }
|
.card-num-view { opacity: 0.5; }
|
.img-lower-box { position: absolute; height: 50px; width: 50px; background-color: rgba(0, 0, 0, 0.6); border-radius: 90px; text-align: center; line-height: 50px; font-size: 12px; color: #fff; top: 13px; left: 17.5px; -webkit-transition: left .15s; transition: left .15s; }
|
}
|
}
|
|
|
|
/*订单列表*/
|
.orderWrap { display: flex; flex-direction: column; height: calc(100vh - var(--window-top)); width: 100%; }
|
.orderList { background-color: #ffffff; margin: 10px; border-radius: 10px; box-sizing: border-box; padding: 10px; font-size: 14px;
|
.item { display: flex; margin: 10px 0 0;
|
.left { margin-right: 10px; }
|
.content {
|
.title { font-size: 14px; line-height: 25px; }
|
.type { margin: 5px 0; font-size: 12px; color: $core-tips-color; }
|
.delivery-time { color: #e5d001; font-size: 12px; }
|
}
|
.right { margin-left: 5px; padding-top: 10px; text-align: right;
|
.decimal { font-size: 12px; margin-top: 2px; }
|
.number { color: $core-tips-color; font-size: 12px; }
|
}
|
}
|
.total { margin-top: 10px; text-align: right; font-size: 12px;
|
.total-price { font-size: 16px; color: red; }
|
}
|
.bottom { display: flex; margin-top: 10px; padding: 0 5px; justify-content: space-between; align-items: center;
|
.coreshop-btn { line-height: 26px; width: 90px; border-radius: 13px; border: 1px solid $core-border-color; font-size: 13px; text-align: center; color: $core-type-info-dark; margin-left: 10px; }
|
.evaluate { color: $core-type-warning-dark; border-color: $core-type-warning-dark; }
|
.logistics { border-color: #e4e7ed; color: #82848a; }
|
.exchange { color: #8dc63f; border-color: #8dc63f; }
|
}
|
}
|
|
/*订单详情*/
|
.coreshop-solid-top::after { border-top: 1px solid rgba(0, 0, 0, 0.1); }
|
.coreshop-order-priceBox { position: relative; }
|
.coreshop-order-nums { position: absolute; top: 0; right: 0; }
|
|
/*步进器*/
|
.coreshop-status-img-view { position: relative;
|
.are-img-view { position: relative; margin-bottom: 10px;
|
.are-img { width: 165px; }
|
}
|
}
|
/*拼团区域*/
|
.user-head-img-c { position: relative; width: 40px; height: 40px; border-radius: 50%; margin-right: 10px; box-sizing: border-box; display: inline-block; float: left; border: 1px solid #f3f3f3; margin-bottom: 10px; margin-top: 10px; }
|
.user-head-img-tip { position: absolute; top: -3px; left: -5px; display: inline-block; background-color: #FF7159; color: #fff; font-size: 11px; z-index: 99; padding: 0 5px; border-radius: 5px; transform: scale(.8); }
|
.group-swiper .coreshop-cell-item .user-head-img { width: 100%; height: 100%; border-radius: 50%; }
|
.group-swiper .coreshop-cell-item .user-head-img-c:first-child { border: 1px solid #FF7159; }
|
.uhihn { width: 40px; height: 40px; border-radius: 50%; margin-right: 10px; display: inline-block; border: 1px dashed #e1e1e1; text-align: center; line-height: 40px; color: #d1d1d1; font-size: 20px; box-sizing: border-box; }
|
|
|
/*订单卡片*/
|
.coreshop-card-box { padding: 14px 14px 0; }
|
.coreshop-card-view { position: relative; border-radius: 5px; padding: 10px; box-shadow: 0 0 7.5px #f1f1f1; }
|
.coreshop-price-view { position: relative;
|
.title-view { position: relative; margin-bottom: 10px;
|
.title { position: relative; padding-right: 90px; }
|
.coreshop-text-right { position: absolute; top: 2px; right: 0; }
|
}
|
.title-right-view { position: relative; margin-top: 14px; text-align: right; }
|
.title-left-view { position: relative; margin-top: 14px; text-align: left; }
|
.solid-line { margin: 14px 0; }
|
}
|
|
/*卡片-商品信息*/
|
.coreshop-shop-view { position: relative;
|
.shop-info-view { position: relative; margin-bottom: 14px; line-height: 24px; height: 24px;
|
.coreshop-avatar { position: absolute; }
|
.title-view { position: relative; padding-left: 32px; }
|
}
|
.goods-list-view { position: relative; margin: 10 0;
|
.coreshop-avatar { position: absolute; height: 77.5px; width: 77.5px; }
|
.goods-info-view { position: relative; padding-left: 86.5px; min-height: 77.5px;
|
.name { position: relative; height: 20px; width: 100%; }
|
.introduce { position: relative; height: 16px; width: 100%; }
|
.tag-view { position: relative; margin-bottom: 5px; margin-top: 3px; width: 100%;
|
.cu-tag { position: relative; top: -1px; }
|
}
|
.coreshop-text-price { position: relative; height: 18px; width: 100%; }
|
}
|
}
|
.coreshop-foot-view { position: relative; background: #FFFCFC; margin: 0 -10px -10px -10px; border-radius: 0 0 5px 5px; padding: 10px;
|
.left-view { position: relative; padding-right: 90px;
|
.af5-img { position: relative; margin-right: 5px; width: 18px; top: 2px; }
|
}
|
.coreshop-text-right { position: absolute; right: 10px; top: 10px; }
|
}
|
}
|
|
/*卡片-订单内容区域*/
|
.coreshop-order-view { position: relative;
|
.solid-line { margin: 14px 0; }
|
.title-view { position: relative; margin-bottom: 10px;
|
&:last-child { margin-bottom: 6.5px; }
|
.title { position: absolute; top: 2px; left: 0; }
|
.coreshop-text-right { position: relative; padding-left: 90px;
|
.cu-btn { padding: 0 5px; height: 15px; top: -2px; }
|
}
|
}
|
}
|
|
|
/*卡片-物流信息*/
|
.coreshop-address-view { position: relative;
|
.solid-line { margin: 10px 0; }
|
.coreshop-list.menu-avatar > .coreshop-list-item { height: 55px;
|
&:after { width: 0; height: 0; border-bottom: 0; }
|
.icon-view { position: absolute; border-radius: 100%; text-align: center; line-height: 23px; height: 23px; width: 23px; left: 5px; top: 13px; }
|
.content { left: 56px; width: calc(100% - 47.5px); }
|
}
|
}
|
|
/*推荐商品列表*/
|
.coreshop-recommend-goods-list-view { position: relative;
|
.coreshop-flex-wrap { padding: 5px; }
|
.list-item { text-align: center; margin-bottom: 10px;
|
.coreshop-avatar { width: 124px; height: 124px; }
|
.goods-info-view { position: relative; padding: 8px; text-align: left;
|
.coreshop-text-price { margin: 5px 0; }
|
.foot-box { position: relative;
|
.cu-tag { position: absolute; right: 0; top: 0; }
|
}
|
}
|
}
|
}
|
|
/*团队列表样式*/
|
.coreshop-team-box { margin-top: 10px;
|
.coreshop-team-list {
|
.coreshop-team-children { padding-left: 15px; padding-right: 15px; height: 66px; border-bottom: 0.5px solid #eee; background: #fff;
|
.head-img { width: 30px; height: 30px; border-radius: 50%; margin-right: 20px; }
|
.head-info { width: calc( 100% - 50px);
|
.head-time { font-size: 12px; font-weight: 400; color: #999999; }
|
.child-num { font-size: 12px; font-weight: 400; color: #999999; }
|
.name-box { margin-bottom: 6px;
|
.name-text { font-size: 12px; font-weight: 500; color: #666; }
|
.tag-box { background: rgba(0, 0, 0, 0.2); border-radius: 10px; line-height: 15px; padding-right: 5px; margin-left: 5px;
|
.tag-img { width: 17px; height: 17px; margin-right: 3px; border-radius: 50%; }
|
.tag-title { font-size: 9px; font-family: PingFang SC; font-weight: 500; color: white; line-height: 10px; }
|
}
|
}
|
}
|
}
|
}
|
}
|
|
|
/* 头像*/
|
.coreshop-avatar { font-variant: small-caps; margin: 0; padding: 0; display: inline-flex; text-align: center; justify-content: center; align-items: center; background-color: #ccc; color: #ffffff; white-space: nowrap; position: relative; width: 32px; height: 32px; background-size: cover; background-position: center; vertical-align: middle; font-size: 1.5em;
|
&.sm { width: 24px; height: 24px; font-size: 1em; }
|
&.lg { width: 48px; height: 48px; font-size: 2em; }
|
&.xl { width: 64px; height: 64px; font-size: 2.5em; }
|
.avatar-text { font-size: 0.4em; }
|
}
|
.coreshop-avatar-group { direction: rtl; unicode-bidi: bidi-override; padding: 0 5px 0 20px; display: inline-block;
|
.coreshop-avatar { margin-left: -15px; border: 2px solid #f1f1f1; vertical-align: middle;
|
&.sm { margin-left: -10px; border: 0.5px solid #f1f1f1; }
|
}
|
}
|
|
/*通用列表样式*/
|
.coreshop-list {
|
/*& + .coreshop-list { margin-top: 15px; }*/
|
& > .coreshop-list-item { transition: all .6s ease-in-out 0s; transform: translateX(0px);
|
&.move-cur { transform: translateX(-130px); }
|
.move { position: absolute; right: 0; display: flex; width: 130px; height: 100%; transform: translateX(100%);
|
view { display: flex; flex: 1; justify-content: center; align-items: center; }
|
}
|
}
|
&.menu-avatar { overflow: hidden;
|
& > .coreshop-list-item { position: relative; display: flex; padding-right: 5px; min-height: 70px; background-color: #ffffff; justify-content: flex-end; align-items: center;
|
& > .coreshop-avatar { position: absolute; left: 15px; }
|
.flex {
|
.text-cut { max-width: 255px; }
|
}
|
.content { position: absolute; left: 73px; width: calc(100% - 48px - 30px - 20px); line-height: 1.6em;
|
&.flex-sub { width: calc(100% - 48px - 30px - 10px); }
|
& > view {
|
&:first-child { font-size: 15px; display: flex; align-items: center; }
|
}
|
.coreshop-tag {
|
&.sm { display: inline-block; margin-left: 5px; height: 14px; font-size: 8px; line-height: 16px; }
|
}
|
}
|
.action { width: 50px; text-align: center;
|
view {
|
& + view { margin-top: 5px; }
|
}
|
}
|
}
|
&.comment {
|
& > .coreshop-list-item { padding: 15px 15px 15px 60px; height: auto;
|
.content { position: relative; left: 0; width: auto; flex: 1; }
|
}
|
.coreshop-avatar { align-self: flex-start; }
|
}
|
}
|
&.menu { display: block; overflow: hidden;
|
& > .coreshop-list-item { position: relative; display: flex; padding: 0 15px; min-height: 50px; background-color: #ffffff; justify-content: space-between; align-items: center;
|
&:last-child {
|
&:after { border: none; }
|
}
|
&.grayscale { background-color: #f5f5f5; }
|
&.cur { background-color: #fcf7e9; }
|
&.arrow { padding-right: 45px;
|
&:before { position: absolute; top: 0; right: 15px; bottom: 0; display: block; margin: auto; width: 10px; height: 10px; color: #8799a3; content: "\e605"; text-align: center; font-size: 17px; font-family: "uicon-iconfont"; line-height: 10px; }
|
}
|
button {
|
&.content { padding: 0; background-color: transparent; justify-content: flex-start;
|
&:after { display: none; }
|
}
|
}
|
.coreshop-avatar-group {
|
.coreshop-avatar { border-color: #ffffff; }
|
}
|
.content { font-size: 15px; line-height: 1.6em; flex: 1;
|
& > view {
|
&:first-child { display: flex; align-items: center; }
|
}
|
& > text[class*=cuIcon] { display: inline-block; margin-right: 5px; width: 1.6em; text-align: center; }
|
& > image { display: inline-block; margin-right: 5px; width: 1.6em; height: 1.6em; vertical-align: middle; }
|
.coreshop-tag {
|
&.sm { display: inline-block; margin-left: 5px; height: 14px; font-size: 8px; line-height: 16px; }
|
}
|
}
|
.action {
|
.coreshop-tag {
|
&:empty { right: 5px; }
|
}
|
}
|
}
|
&.sm-border {
|
& > .coreshop-list-item {
|
&:after { left: 15px; width: calc(200% - 60px); }
|
}
|
}
|
}
|
&.grid { background-color: #ffffff; text-align: center;
|
& > .coreshop-list-item { position: relative; display: flex; padding: 10px 0 15px; transition-duration: 0s; flex-direction: column;
|
&:after { position: absolute; top: 0; left: 0; box-sizing: border-box; width: 200%; height: 200%; border-right: 1px solid rgba(0, 0, 0, .1); border-bottom: 1px solid rgba(0, 0, 0, .1); border-radius: inherit; content: " "; transform: scale(.5); transform-origin: 0 0; pointer-events: none; }
|
text { display: block; margin-top: 5px; color: #888; font-size: 13px; line-height: 20px; }
|
[class*=cuIcon] { position: relative; display: block; margin-top: 10px; width: 100%; font-size: 24px; }
|
.coreshop-tag { right: auto; left: 50%; margin-left: 10px; }
|
}
|
&.no-border { padding: 10px 5px;
|
& > .coreshop-list-item { padding-top: 5px; padding-bottom: 10px;
|
&:after { border: none; }
|
}
|
}
|
}
|
&.card-menu { overflow: hidden; margin-right: 15px; margin-left: 15px; border-radius: 10px; }
|
}
|
.coreshop-list.menu-avatar > .coreshop-list-item:after,
|
.coreshop-list.menu > .coreshop-list-item:after { position: absolute; top: 0; left: 0; box-sizing: border-box; width: 200%; height: 200%; border-bottom: 0.5px solid #ddd; border-radius: inherit; content: " "; transform: scale(.5); transform-origin: 0 0; pointer-events: none; }
|
.coreshop-list.grid.col-3 > .coreshop-list-item:nth-child(3n):after,
|
.coreshop-list.grid.col-4 > .coreshop-list-item:nth-child(4n):after,
|
.coreshop-list.grid.col-5 > .coreshop-list-item:nth-child(5n):after { border-right-width: 0; }
|
|
|
/*常用日志数据多列列表三联*/
|
.coreshop-log-item { min-height: 71px; background-color: #fff; padding: 15px; border-bottom: 0.5px solid #eee;
|
.item-left {
|
.log-img { width: 25px; height: 25px; border-radius: 50%; margin-right: 12px; }
|
.log-name { font-size: 14px; font-weight: 500; margin-bottom: 6px; }
|
.log-notice { font-size: 12px; font-weight: 500; }
|
}
|
.item-right {
|
.log-num { font-size: 14px; font-weight: 500; margin-bottom: 6px; }
|
.log-date { font-size: 12px; font-weight: 400; }
|
}
|
}
|
.coreshop-log-memo { font-size: 12px; margin-top: 6px; }
|
|
/*占高区*/
|
.coreshop-card-hight-box { height: 23px; }
|
|
/*底部高度区域*/
|
.coreshop-foot-hight-view { width: 100%; height: calc((env(safe-area-inset-bottom) / 2) + 55px); }
|
|
|
/*为您推荐头部效果*/
|
.coreshop-recommended-title-view { position: relative; margin: 18px;
|
.img-anc { position: relative; width: 18px; top: 2px; }
|
}
|
|
|
.coreshop-navbar-left-slot { display: flex; align-items: center; justify-content: space-between; opacity: 0.8; flex-direction: row; /*padding: 3px 7px; border: 1px solid; border-width: 0.5px; border-radius: 100px; border-color: #dcdcdc;*/ }
|
/*支付界面效果*/
|
.payment-wx {
|
.coreshop-btn { background-color: #fff; line-height: 1.7; padding: 0; width: 367px; position: relative; display: flex; align-items: center; }
|
}
|
.payment-pop { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 200px; height: 136px; background-color: #fff; text-align: center; box-shadow: 0 0 10px #ccc;
|
.text { font-size: 12px; }
|
}
|
.payment-pop-c { padding: 25px 15px; font-size: 16px; color: #999;
|
image { width: 30px; height: 30px; }
|
}
|
.payment-pop-b { position: absolute; bottom: 0; display: flex; width: 100%; justify-content: space-between;
|
.coreshop-btn { flex: 1; justify-content: center; }
|
.coreshop-btn-o { background-color: #ff7159; }
|
}
|
|
|
/*全屏下头部透明效果*/
|
.coreshop-full-screen-nav-back { width: 100%; height: 44px; /* #ifndef MP-WEIXIN */ padding: 12px 12px 0; /* #endif */ /* #ifdef MP-WEIXIN */ padding: 26px 12px 0; /* #endif */ position: fixed; top: 10px; background-color: rgba(255, 255, 255, 0); z-index: 98;
|
.back-btn { height: 32px; width: 32px; border-radius: 50%; background-color: rgba(255, 255, 255, 0.8); text-align: center;
|
.icon { height: 20px; width: 20px; position: relative; top: 50%; left: 46%; transform: translate(-50%, -50%); }
|
}
|
}
|
|
/*全屏下顶部满屏占位幻灯片效果*/
|
.coreshop-full-screen-banner-swiper-box { position: relative; width: 100%;
|
.screen-swiper { min-height: 325px; }
|
.tag { font-size: 12px; vertical-align: middle; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 0px 8px; font-family: Helvetica Neue, Helvetica, sans-serif; white-space: nowrap; position: absolute; bottom: 14px; right: 14px; font-size: 10px; padding: 0px 6px; height: 16px; }
|
}
|
|
/*商品内限时秒杀区域效果*/
|
.coreshop-limited-seckill-box { position: relative; background-image: url('/static/images/good/titlebg.png'); background-repeat: no-repeat; background-size: 100% 100%; padding: 12.5px 14px; color: #ffffff; width: 100%;
|
.coreshop-cost-price-num { position: absolute; font-weight: 200; left: 100px; top: 11px; }
|
.coreshop-cost-price-num.price-6 { left: 127px; }
|
.coreshop-cost-price-num.price-5 { left: 114px; }
|
.coreshop-cost-price-num.price-4 { left: 100px; }
|
.coreshop-cost-price-num.price-3 { left: 82px; }
|
.coreshop-cost-price-num.price-2 { left: 68px; }
|
.coreshop-cost-price-num.price-1 { left: 50px; }
|
.coreshop-time-right { position: absolute; right: 10px; top: 5px; }
|
.coreshop-share-right { position: absolute; right: 14px; top: 8px; }
|
}
|
.coreshop-limited-seckill-box::after { content: ""; position: absolute; z-index: -1; background-color: inherit; width: 100%; height: 100%; left: 0; bottom: -10%; border-radius: 5px; opacity: 0.2; transform: scale(0.9, 0.9); }
|
|
/*通用空白区域*/
|
.coreshop-common-view-box { position: relative; padding: 10px 10px; }
|
|
|
/*商品标题区域效果*/
|
.coreshop-good-title-view-box { position: relative;
|
.title-view { display: inline-block; flex-direction: row; align-items: center;
|
.brand-tag { width: 60px; float: left; height: 10px; font-size: 10px; font-weight: normal; }
|
}
|
.coreshop-title-tip-box { position: relative; padding: 5px 10px; width: 100%;
|
.u-line-1 { padding-right: 14px; }
|
.icon { position: absolute; right: 10px; top: 6px; }
|
}
|
}
|
|
/*商品页面底部浮层*/
|
.coreshop-good-footer-fixed { display: flex; position: fixed; bottom: 0; margin-top: 60px; width: 100%; z-index: 1; border-top: solid 1px #f2f2f2; background-color: #ffffff;
|
.tabbar { display: flex; position: relative; align-items: center; min-height: 50px; justify-content: space-between; padding-left: 5px; padding-right: 5px; height: calc(50px + env(safe-area-inset-bottom) / 2); padding-bottom: calc(env(safe-area-inset-bottom) / 2); width: 100%; flex-direction: row;
|
.action { display: flex; align-items: center; height: 100%; justify-content: center; max-width: 100%; color: #333333; position: relative; text-align: center;
|
.car-num { position: absolute; top: 5px; right: 7.5px; }
|
}
|
.btn-group { justify-content: space-around; flex-direction: row;
|
button { margin: 0 5px; }
|
}
|
.btn-box { justify-content: space-around; width: 50%; padding: 5px; padding-left: 0px; }
|
}
|
}
|
|
/*商品页面商家面板展示*/
|
.coreshop-goods-shop-info-view-box {
|
.coreshop-shop-view { position: relative; width: 100%;
|
.coreshop-avatar { position: absolute; height: 40px; width: 40px; }
|
button { position: absolute; top: 11px; right: 0; width: 60px; }
|
}
|
.coreshop-border-view { position: relative; background: #efebeb; margin: 11px 0; height: 1px; width: 100%; }
|
.live-tag-view { position: relative; width: 100%;
|
.text-view { padding-right: 74px; display: flex;
|
.location-tag { width: 50px; }
|
}
|
.go-map-box { position: absolute; right: 0; top: 2px; width: 70px; display: flex; }
|
}
|
.coreshop-good-shop-recommend-list-box {
|
.recommend-scroll-box { position: relative; width: 100%;
|
.recommend-scroll { position: relative; height: 180px; white-space: nowrap; width: 100%;
|
.recommend-scroll-item { display: inline-block; padding-top: 14px; width: 100px; padding-right: 9px; white-space: initial;
|
.coreshop-avatar { width: 140px; height: 140px; }
|
}
|
}
|
}
|
}
|
}
|
|
|
|
/*商品页面底部弹出层效果*/
|
.coreshop-bottom-popup-box { border-radius: 18px 18px 0 0;
|
.cu-dialog { border-radius: 18px 18px 0 0; }
|
.coreshop-title-bar { position: relative; width: 100%;
|
.close-icon { position: absolute; right: 18px; }
|
}
|
.coreshop-modal-content { position: relative; width: 100%; overflow-y: auto; /*height: calc(100vh - 327.5px);*/ padding: 0 15px 15px; margin-bottom: 60px;
|
.coreshop-common-view-box { position: relative; width: 100%; padding: 0; text-align: left; }
|
.coreshop-common-view-box.service {
|
.text-view { margin-bottom: 10px; }
|
.text-list-view { position: relative; width: 100%; margin-bottom: 10px;
|
.u-line-1 { padding-right: 10.5px; }
|
}
|
.text-list-view + .text-view { margin-top: 18px; }
|
}
|
.coreshop-common-view-box.promotion {
|
.text-view { margin-bottom: 10px;
|
.cu-tag { position: relative; top: -2px; }
|
}
|
.text-list-view { position: relative; width: 100%; margin-bottom: 10px;
|
.u-line-1 { padding-right: 110px; }
|
.go-map-box { position: absolute; right: 0; top: 1px; }
|
}
|
.text-list-view + .text-view { margin-top: 18px; }
|
}
|
.coreshop-common-view-box.select {
|
.coreshop-list.menu-avatar > .coreshop-list-item {
|
.content { width: calc(100% - 47.5px - 30px); }
|
}
|
.coreshop-select-btn-list-box { }
|
}
|
}
|
}
|
/*商品详情区域初始高度*/
|
.coreshop-good-rich-text-view { min-height: 250px; }
|
|
|
/*拼团*/
|
.group-box { background: linear-gradient(#fff, #f5f5f5); border-radius: 10px; margin: 0 10px 10px 10px; min-height: 500px;
|
.goods-item { border-radius: 10px; overflow: hidden; position: relative; margin-bottom: 10px; background: #fff;
|
.tag { position: absolute; left: 0; top: 5px; z-index: 2; line-height: 17.5px; background: linear-gradient(132deg, rgba(255, 153, 93, 1), rgba(255, 99, 97, 1)); border-radius: 0px 9px 9px 0px; padding: 0 5px; font-size: 12px; font-family: PingFang SC; font-weight: bold; color: rgba(255, 255, 255, 0.8); }
|
.goods-right {
|
.title { font-size: 14px; line-height: 20px; }
|
.tip { font-size: 11px; color: #a8700d; padding: 3px 0; }
|
.current { font-size: 14px; font-weight: 500; color: rgba(225, 33, 43, 1); }
|
.original { font-size: 11px; font-weight: 400; text-decoration: line-through; color: rgba(153, 153, 153, 1); margin-left: 7px; }
|
.u-tag__text { font-size: 11px; }
|
}
|
.buy-btn { width: 130px; height: 30px; background: linear-gradient(90deg, rgba(254, 131, 42, 1), rgba(255, 102, 0, 1)); box-shadow: 0px 3.5px 3px 0px rgba(255, 104, 4, 0.22); border-radius: 15px; font-size: 14px; font-family: PingFang SC; font-weight: 500; color: #fff; padding: 0; text-align: center; line-height: 30px; }
|
.group-num { font-size: 10px; font-family: PingFang SC; font-weight: 500; color: rgba(153, 153, 153, 1); margin-left: 10px; }
|
.sell-box { background: rgba(255, 224, 226, 0.3); border-radius: 8px; line-height: 16px; padding: 0 5px;
|
.sell-num { font-size: 10px; font-family: PingFang SC; font-weight: 400; color: rgba(247, 151, 156, 1); }
|
.cuIcon-hotfill { font-size: 13px; color: #e1212b; margin-right: 4px; }
|
}
|
}
|
}
|
.group-boxComponents.group-box { min-height: 25px; }
|
|
.activity-goods-box { padding: 20px 10px; background: #fff;
|
.img-box { margin-right: 10px; width: 140px; height: 140px; overflow: hidden; position: relative;
|
.img { width: 100px; height: 100px; background-color: #ccc; }
|
}
|
.goods-right { min-height: 100px; position: relative;
|
.title { font-size: 15px; line-height: 20px; }
|
.tip { font-size: 11px; color: #a8700d; padding: 3px 0; }
|
.current { font-size: 14px; font-weight: 500; color: rgba(225, 33, 43, 1); }
|
.original { font-size: 11px; font-weight: 400; text-decoration: line-through; color: rgba(153, 153, 153, 1); margin-left: 7px; }
|
}
|
}
|
|
|
/*版权信息*/
|
.coreshop-copyright { text-align: center; margin: 10px 0; width: 100%; overflow: hidden; line-height: 20px; }
|
|
/*
|
按钮无边框样式*/
|
.noButtonStyle { -webkit-appearance: none; overflow: visible; color: #606266; border-color: #c0c4cc; background-color: #ffffff; position: relative; border: 0; display: inline-flex; overflow: visible; line-height: 1; display: flex; flex-direction: row; align-items: center; justify-content: center; cursor: pointer; z-index: 1; box-sizing: border-box; transition: all 0.15s; }
|
.noButtonStyle::after { border-top-width: 0; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; }
|
|
|
/*顶部自定义效果*/
|
.coreshop-header-slot-wrap { display: flex; align-items: center; padding: 0 10px; margin-top: -5px;
|
.coreshop-slot-btns { background: #111727; border: 1px solid #565b6f; padding: 4px 12px; border-radius: 250px; display: flex; align-items: center; z-index: 10075;
|
.coreshop-slot-cut-off { margin: 0 10px; color: #fff; width: 0.5px; border-left: 1px solid #fff; background: #fff; height: 17.5px; }
|
}
|
.coreshop-header-title { padding: 1px 10px; }
|
}
|
|
|
/*接龙*/
|
.solitaire-details-bg { min-height: 150px; background-image: url('/static/images/common/bg.png'); background-size: cover; background-position: center; border-radius: 0 0 40px 40px; background: #272d47; }
|
.solitaire-details-placeholder-body { margin-top: -150px; padding: 2.5px; }
|
.solitaire-details-body { min-height: 150px; border-radius: 15px; margin: 20px 10px 10px 10px; padding: 5px 10px 10px 10px;
|
.solitaire-details-shareBox { background: #0fd7bd; padding: 2.5px 5px; border-top-left-radius: 50px; border-bottom-left-radius: 50px; margin-right: -10px; margin-left: 10px; margin-top: 10px; width: 35px; height: 25px; }
|
}
|
.coreshop-content { color: $u-content-color; font-size: 14px; line-height: 1.8;
|
p { color: $u-tips-color; }
|
}
|
.solitaire-details-product-item { background: #FFFFFF; border-radius: 4px; margin: 0 10px; margin-top: 10px; border-radius: 8px; padding: 10px 10px; background: #FFFFFF !important; }
|
|
|
.contact-btn { margin: 0 auto; }
|
|
|
/*商品参数*/
|
.goods-param-box { border: 0.5px solid #c3c3c3; border-radius: 6px; margin-top: 12rpx; }
|
.goods-param-line { border-bottom: 0.5px solid #c3c3c3; display: flex; min-height: 34px; line-height: 34px; }
|
.goods-param-line:last-child { border-bottom: 0; }
|
.goods-param-line .name { background: #f3f3f3; border-right: 0.5px solid #c3c3c3; color: #616161; font-size: 12px; min-height: 34px; line-height: 34px; text-align: center; width: 95px; }
|
.goods-param-line .value { color: #2f2f2f; font-size: 12px; padding-left: 12px; width: calc(100% - 100px); }
|
|
|
/*代理价格表格*/
|
.goods-agent-box { border: 0.5px solid #c3c3c3; border-radius: 0px; margin-top: 12rpx; }
|
.goods-agent-line { border-bottom: 0.5px solid #c3c3c3; display: flex;
|
.name { background: #f3f3f3; border-right: 0.5px solid #c3c3c3; color: #616161; font-size: 12px; text-align: center; width: 216px;}
|
.productPrice { color: #2f2f2f; border-right: 0.5px solid #c3c3c3; font-size: 12px; width: 50px; text-align: center; }
|
.agentGradePrice { color: #2f2f2f; border-right: 0.5px solid #c3c3c3; font-size: 12px; width: 50px; text-align: center; }
|
.profit { color: #2f2f2f; font-size: 12px; width: 50px; text-align: center; }
|
}
|
.goods-agent-line:last-child { border-bottom: 0; }
|
|
|
.line-70 { background: #c3c3c3; height: 1px; margin-top: 3px; width: 34.5px; }
|
|
/*购买按钮*/
|
.btn-add-shopcar { border: 1rpx solid #ff8512; border-radius: 12rpx; color: #ff8512; font-size: 32rpx; width: 210rpx; }
|
.btn-add-shopcar, .btn-buy { font-weight: bolder; height: 72rpx; line-height: 72rpx; text-align: center; }
|
.btn-buy { background: #ff3b3b; border-radius: 12rpx; color: #fff; margin-left: 14rpx; width: 220rpx; }
|
|
/*倒计时自定义样式*/
|
.time { display: flex; align-items: center;
|
&__custom { width: 22px; height: 22px; background-color: $u-primary; border-radius: 4px; /* #ifndef APP-NVUE */ display: flex; /* #endif */ justify-content: center; align-items: center;
|
&__item { color: #fff; font-size: 12px; text-align: center; }
|
}
|
&__doc { color: $u-primary; padding: 0px 4px; font-size: 12px; }
|
&__item { color: #606266; font-size: 15px; margin-right: 4px; }
|
}
|
|
|
/*商品瀑布流列表*/
|
.cate-list { padding-left: 23rpx; padding-right: 20rpx; }
|
.cate-list .item { margin-bottom: 32rpx; margin-right: 20rpx; text-align: center; }
|
.cate-list .item:nth-child(5n) { margin-right: 0rpx; }
|
.index-goods .goods { -webkit-column-break-inside: avoid; border-radius: 18rpx; break-inside: avoid; margin-bottom: 24rpx; width: 326rpx; }
|
.coreshop-title-294 { width: 294rpx; }
|
|
.coreshop-image-price-tags { height: 32rpx; margin-bottom: 4rpx; margin-right: 12rpx; vertical-align: middle; width: 98rpx; }
|
.coreshop-image-recommend-tags { height: 32rpx; margin-bottom: 4rpx; margin-right: 12rpx; vertical-align: middle; width: 121rpx; }
|
.coreshop-image-hot-tags { height: 32rpx; margin-bottom: 4rpx; margin-right: 12rpx; vertical-align: middle; width: 80rpx; }
|
|
|
|
/*分割线*/
|
.coreshop-divider { display: flex; flex-direction: row; flex-direction: row; align-items: center;
|
.complete { margin: 0; border-bottom-width: 1px; border-bottom-style: solid; width: 100%; transform: scaleY(0.5); border-color: #dcdfe6; flex: 1; vertical-align: middle; margin: 10px 0; }
|
.groupPurchase, .seckill, .serviceGood { margin: 0; border-bottom-width: 1px; border-bottom-style: solid; width: 100%; transform: scaleY(0.5); border-color: #dcdfe6; flex: 1; vertical-align: middle; margin: 10px 0; }
|
.left { margin: 0; border-bottom-width: 1px; border-bottom-style: solid; width: 100%; transform: scaleY(0.5); border-color: #dcdfe6; flex: 1; vertical-align: middle; }
|
.dot { font-size: 12px; margin: 0 12px; color: #c0c4cc; }
|
.right { margin: 0; border-bottom-width: 1px; border-bottom-style: solid; width: 100%; transform: scaleY(0.5); border-color: #dcdfe6; flex: 1; vertical-align: middle; }
|
}
|
|
|
.coreshop-buy-btn { width: 70px; height: 24px; background: linear-gradient(90deg, #fe832a, #ff6600); box-shadow: 0px 3.5px 3px 0px rgba(221, 185, 184, 0.22); border-radius: 15px; font-size: 13px; font-family: PingFang SC; font-weight: 500; color: #fff; padding: 0; text-align: center; line-height: 24px; }
|
|
.coreshop-groupPurchase-btn { width: 70px; height: 24px; background: linear-gradient(90deg, #00c78a, #04c668); box-shadow: 0px 3.5px 3px 0px rgba(134, 194, 135, 0.22); border-radius: 15px; font-size: 13px; font-family: PingFang SC; font-weight: 500; color: #fff; padding: 0; text-align: center; line-height: 24px; }
|
|
.coreshop-seckill-btn { width: 70px; height: 24px; background: linear-gradient(90deg, #ffbd1d, #ff4a09); box-shadow: 0px 3.5px 3px 0px rgba(255, 104, 4, 0.22); border-radius: 15px; font-size: 13px; font-family: PingFang SC; font-weight: 500; color: #fff; padding: 0; text-align: center; line-height: 24px; }
|
|
.coreshop-solitaire-btn { width: 70px; height: 24px; background: linear-gradient(90deg, #04c668, #13804b); box-shadow: 0px 3.5px 3px 0px rgba(255, 104, 4, 0.22); border-radius: 15px; font-size: 12px; font-family: PingFang SC; font-weight: 500; color: #fff; padding: 0; text-align: center; line-height: 24px; }
|
|
.coreshop-buy-btn-disabled { width: 70px; height: 24px; background: linear-gradient(180deg,#f8f8f8,#f5f5f5); box-shadow: 0px 3.5px 3px 0px rgba(255, 224, 226, 0.3); border-radius: 15px; font-size: 13px; font-family: PingFang SC; font-weight: 500; color: #8799a3; padding: 0; text-align: center; line-height: 24px; border-color: #ebedf0; border-width: 1px; border-style: solid; }
|
|
|
.good-tag-hot { display: flex; margin-top: 5px; position: absolute; top: 15rpx; left: 15rpx; background-color: $u-type-error; color: #FFFFFF; display: flex; align-items: center; padding: 4rpx 14rpx; border-radius: 50rpx; font-size: 20rpx; line-height: 1; }
|
.good-tag-recommend { display: flex; margin-top: 5px; position: absolute; top: 15rpx; right: 15rpx; background-color: $u-type-primary; color: #FFFFFF; margin-left: 10px; border-radius: 50rpx; line-height: 1; padding: 4rpx 14rpx; display: flex; align-items: center; border-radius: 50rpx; font-size: 20rpx; }
|
.good-tag-recommend2 { display: flex; margin-top: 5px; position: absolute; bottom: 15rpx; left: 15rpx; background-color: $u-type-primary; color: #FFFFFF; border-radius: 50rpx; line-height: 1; padding: 4rpx 14rpx; display: flex; align-items: center; border-radius: 50rpx; font-size: 20rpx; }
|
