/* 提交按钮,在文件内还需要重写一个样式,详情可见 mine_address_add.vue */ .add_but { position: fixed; bottom: 44rpx; padding: 24rpx 0; text-align: center; border-radius: 16rpx; width: calc(100% - 56rpx); color: #fff; // background: $app-bt-bj; background: linear-gradient(90deg, $app-bt-bj, #AE61FA); } .add_but_css { color: #fff; // background: $app-bt-bj; background: linear-gradient(90deg, $app-bt-bj, #AE61FA); padding: 24rpx 0; text-align: center; border-radius: 16rpx; } .delete_but_css { font-weight: 500; font-size: 32rpx; color: #FFFFFF; background: $app-bt-delete-bj; border-radius: 16rpx; text-align: center; padding: 24rpx 0; } .add_but_ { padding: 24rpx 0; text-align: center; border-radius: 16rpx; width: 100%; color: #fff; background: $app-bt-bj; margin-top: 40rpx; } /* 表单添加 start ,一行显示,input没有背景色 使用地方有:实名认证,添加地址,商家入驻*/ .add_form_item { display: flex; align-items: center; line-height: 100rpx; } .add_form_title { margin-right: 20rpx; font-weight: bold; font-size: 28rpx; color: #333333; width: 170rpx; } .add_form_item_but { border-bottom: 1rpx solid #EEEEEEFF; } /* 表单添加 end ,一行显示,input没有背景色 */ /* 上传证件照 start 使用地方有:实名认证,商家入驻 */ .data_common_warp { background: #FFFFFF; border-radius: 30rpx; padding: 30rpx; margin-bottom: 30rpx; } .data_msg { font-weight: 500; font-size: 26rpx; color: #F34343; margin-bottom: 20rpx; } .ID_card_title { font-weight: 500; font-size: 30rpx; color: #333333; } .ID_card_msg { font-weight: 500; font-size: 24rpx; color: #999999; margin-top: 10rpx; } .ID_card_upload { display: flex; justify-content: space-between; margin-top: 20rpx; } .upload_item { width: 42%; background: #F8F8F8; border-radius: 10rpx; text-align: center; padding: 20rpx 20rpx; } .upload_msg { font-weight: 500; font-size: 24rpx; color: #525357; margin-top: 10rpx; } .ID_card_upload_templ { margin-top: 20rpx; } .templ_title { font-weight: 500; font-size: 28rpx; color: #333333; } .templ_img_list { display: flex; justify-content: space-between; margin-top: 20rpx; } .templ_img_item { width: 22%; } .templ_img_item_msg { display: flex; align-items: center; justify-content: center; } .templ_img_item_msg_title { margin-left: 10rpx; font-weight: 500; font-size: 20rpx; color: #333333; } /* 上传证件照 end 使用地方有:实名认证,商家入驻 */ /*订单商品列表 start 使用地方有订单列表,订单详情列表*/ .order_item_content { font-weight: 500; margin-left: 20rpx; } .content_item { display: flex; justify-content: space-between; margin-top: 20rpx; } .content_info { margin-left: 20rpx; width: calc(100% - 260rpx); } .content_info_title { font-size: 26rpx; color: #222222; width: 200px; /* 设置容器宽度 */ white-space: nowrap; /* 防止文本换行 */ overflow: hidden; /* 隐藏溢出的文本 */ text-overflow: ellipsis; /* 显示省略号 */ } .content_info_tag { font-size: 24rpx; color: #BBBBBB; margin: 10rpx 0; } .content_info_description { border-radius: 6rpx; border: 1px solid #99999942; padding: 4rpx 10rpx; font-size: 20rpx; color: #999999; margin-right: 10rpx; } .content_right { text-align: right; } .content_right_total { font-weight: bold; font-size: 20rpx; color: #1A1A1A; } .content_right_quantity { font-weight: 500; font-size: 24rpx; color: #999999; } /*订单商品列表 end 使用地方有:订单列表,订单详情列表*/ /*订单商品操作按钮 start 使用地方有:订单列表,订单详情列表*/ .collect_operate { display: flex; justify-content: flex-end; margin-top: 20rpx; .operate_comm { font-weight: 500; font-size: 24rpx; padding: 16rpx 0; margin-left: 16rpx; border-radius: 10rpx; color: #222222; width: 160rpx; text-align: center; } .operate_but_1 { border: 1px solid #767676; } .operate_but_2 { background: $app-bt-bj; color: #ffffff; } .operate_but_3 { border: 1px solid $app-bt-bj; color: $app-bt-bj; } } /*订单商品操作按钮 end 使用地方有:订单列表,订单详情列表*/ .purse_info_item { display: flex; justify-content: space-between; margin-bottom: 10rpx; border-bottom: 1rpx solid #EEEEEEFF; padding: 10rpx 0; } .purse_info_left { display: flex; align-items: center; } .purse_info_right { line-height: 40rpx; } .purse_data_warp { margin-left: 20rpx; line-height: 40rpx; } .purse_info_name { font-weight: bold; font-size: 28rpx; color: #333333; } .purse_info_value { font-weight: 400; font-size: 24rpx; color: #666666; text-align: right; } .purse_info_title { font-weight: bold; font-size: 36rpx; color: #111111; } // 为空的页面展示 start 使用页面有:我的订单,购物车 .not_order_warp { display: grid; justify-content: center; margin: 60rpx; width: calc(100% - 120rpx); text-align: center; .not_order_warp_img { text-align: center; } .not_order_msg_warp { font-size: 28rpx; color: #808080; margin-top: 42rpx; } } // 为空的页面展示 end 使用页面有:我的订单,购物车 // 获取验证码的文案 start 使用页面:登录注册 .code_msg { font-size: 36rpx; color: $app-bt-bj; } .code-warp { width: 30%; text-align: right; display: flex; justify-content: flex-end; } .login_comm_but { background: #CCCCCC; border-radius: 20rpx; width: 100%; text-align: center; font-weight: 500; font-size: 32rpx; color: #999999; padding: 28rpx 0; } .login_comm_but_yes { background: $app-bt-bj; color: #ffffff; } .policy_warp { font-weight: 500; font-size: 26rpx; color: #999999; position: fixed; bottom: 24rpx; // height: 210rpx; width: calc(100% - 80rpx); .policy_a_warp { color: $app-policy-color; } } // 获取验证码的文案 end 使用页面:登录注册 // 哈希优选,爆款专区的公共样式 start .preference_warp { height: 100vh; overflow: hidden; background: $app-bj; } // 搜索页面也有用 .header_comm { display: flex; justify-content: space-between; align-items: center; padding: 114rpx 30rpx 20rpx; background-color: #FFFFFF; } .preference_content_warp { height: calc(100vh - 238rpx); overflow: auto; } .preference_title { margin: 40rpx 0; font-weight: bold; font-size: 32rpx; color: #7F664A; display: flex; justify-content: center; align-items: center; .msg { margin: 14rpx 40rpx 0rpx; } } .preference_product { padding: 30rpx; .product_item { margin-bottom: 20rpx; background: #FFFFFF; border-radius: 16rpx; padding: 18rpx; display: flex; } .product_item_left { position: relative; .product_item_left_bz { position: absolute; top: -6rpx; left: -10rpx; font-size: 18rpx; color: #FFF9E4; font-weight: bold; display: flex; justify-content: center; align-items: center; } } .product_item_right { margin-left: 20rpx; display: grid; width: calc(100% - 174rpx); .title_warp { font-weight: bold; font-size: 28rpx; color: #000000; } .price_warp { display: flex; align-items: flex-end; } .price_o_warp { width: 32%; border-radius: 8rpx; height: 54rpx; padding: 10rpx 18rpx; } .price_o_title_warp { font-weight: 500; font-size: 20rpx; } .price_o_value_warp { font-weight: bold; font-size: 22rpx; } .price_zq_warp { width: 66%; text-align: center; border-radius: 8rpx; font-weight: bold; font-size: 20rpx; padding: 10rpx; height: 82rpx; } .price_lj_warp { border-radius: 4rpx; font-weight: bold; font-size: 20rpx; padding: 6rpx; } .price_ds_warp {} } } // 哈希优选,爆款专区的公共样式 end // 轮播图的页码 start 使用地方:首页,产品详情 .indicator-num { padding: 2px 0; background-color: rgba(0, 0, 0, 0.35); border-radius: 100px; width: 35px; @include flex; justify-content: center; &__text { color: #FFFFFF; font-size: 12px; } } ::v-deep { .u-swiper__indicator { right: 20rpx; } } // 轮播图的页码 end 使用地方:首页,产品详情 // 购买的数量 + - start 使用地方:购物车,加入购物车,购买页面 .shopping_info_quantity { display: flex; justify-content: space-between; align-items: center; } .quantity_but { background: #F6F6F6; border-radius: 10rpx; padding: 8rpx 20rpx; } .quantity_value { margin: 0 30rpx; } // 购买的数量 + - end 使用地方:购物车,加入购物车,购买页面 // 去支付的样式 start 使用地方:提交订单,订单详情,去支付 .order_way_warp { display: flex; justify-content: space-between; align-items: center; background: #FFFFFF; border-radius: 24rpx; margin-top: 30rpx; padding: 30rpx; font-weight: 500; font-size: 26rpx; color: #222222; .order_way_right { display: flex; } } .way_popup_warp { padding: 30rpx; min-height: 800rpx; width: calc(100% - 60rpx); } .way_popup_title { text-align: center; margin-bottom: 60rpx; } .way_item { display: flex; justify-content: space-between; // line-height: 82rpx; .way_item_ { // display: flex; // align-items: center; } .way_item_val { font-weight: bold; font-size: 30rpx; color: #222222; margin-left: 20rpx; } } .balance_comm_msg { margin-left: 20rpx; color: red; font-size: 18rpx; margin-top: 6rpx; } .go_balance_comm_warp { border: 1rpx solid $app-bt-bj; color: $app-bt-bj; padding: 10rpx 14rpx; font-size: 16rpx; border-radius: 10rpx; } .popup_but { position: fixed; bottom: 64rpx; background: $app-bt-bj; border-radius: 16rpx; color: #FFFFFF; text-align: center; padding: 20rpx 0; width: calc(100% - 60rpx); } // 去支付的样式 end 使用地方:提交订单,订单详情,去支付 // 添加地址的样式 start 使用地方:添加地址,领取奖品 .address_add_warp { height: calc(100vh - 58rpx); background-color: $app-bj; padding: 30rpx; } .address_form { background: #FFFFFF; border-radius: 24rpx; padding: 0 30rpx 30rpx; } .region_warp { display: flex; justify-content: space-between; width: calc(100% - 160rpx); } .address_default { background: #FFFFFF; border-radius: 24rpx; padding: 30rpx; display: flex; justify-content: space-between; margin-top: 30rpx; .title { font-weight: bold; font-size: 28rpx; color: #222222; } } // 添加地址的样式 end 使用地方:添加地址,领取奖品 // 选择地址的弹框 start 使用地方:提交订单,领取奖品 .address_popup_warp { padding: 30rpx; height: 1200rpx; overflow-y: hidden; .address_popup_title { text-align: center; margin-bottom: 20rpx; } .address_popup_content { height: calc(100% - 180rpx); overflow-y: auto; } .address_popup_content_add { text-align: right; margin: 10rpx 0 20rpx; } } // 选择地址的弹框 end // 分类 :start 使用地方:首页,哈希联盟 .sort_comm_warp { background: #ffffff; padding: 20rpx; // height: 170rpx; border-radius: 20rpx; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; .sort_item_comm { flex: 1; text-align: center; // margin-bottom: 20rpx; } .sort_item_title_comm { font-weight: 500; font-size: 22rpx; color: #333333; } } // 分类 :end // 未开放弹框 :start .slot-content { text-align: center; width: 100%; position: relative; .close_warp { position: absolute; right: 0rpx; top: 0rpx; } .content_ {} .content_1 { font-weight: bold; font-size: 36rpx; color: #111111; } .content_2 { font-weight: 500; font-size: 28rpx; color: #111111; margin-top: 30rpx; } .content_3 { background: #EEEEEE; border-radius: 20rpx; padding: 20rpx; font-weight: bold; font-size: 50rpx; color: #111111; text-align: center; margin-top: 20rpx; } .but_ { margin-top: 40rpx; .but_copy { background: $app-bt-bj; border-radius: 45rpx; font-weight: bold; font-size: 28rpx; color: #FFFFFF; padding: 20rpx 0; } .but_close { font-weight: bold; font-size: 28rpx; color: #666666; margin-top: 20rpx; } } } // 未开放弹框 end // 现金余额充值 start .purse_recharge_warp { background-color: $app-bj; height: 100%; overflow: auto; .purse_recharge_cntent { padding: 30rpx; } .recharge_balance { display: flex; justify-content: space-between; align-items: center; background: $app-bt-bj; box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.06); border-radius: 8rpx; padding: 0 34rpx; height: 140rpx; } .recharge_balance_image { display: flex; align-items: center; .msg_ { font-size: 31rpx; color: rgba(255, 255, 255, 0.9); line-height: 42rpx; margin-left: 10rpx; } } .recharge_balance_ { font-weight: 600; font-size: 46rpx; color: rgba(255, 255, 255, 0.9); line-height: 63rpx; } .form_item { margin-top: 50rpx; .form_item_title { font-weight: 500; font-size: 31rpx; color: rgba(0, 0, 0, 0.85); line-height: 42rpx; } .recharge_way_warp { background: #FFFFFF; box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0, 0, 0, 0.06); border-radius: 8rpx; padding: 20rpx; margin-top: 20rpx; .way_item_but { border-bottom: 1rpx solid rgba(0, 0, 0, 0.26); } .way_item_ { // margin-bottom: 20rpx; } } } } // 现金余额充值 end // 更新软件 start ::v-deep(uni-page-body) { height: 100%; } .up_content { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); // background-color: #111111; #img { width: 100%; height: 100%; } .content .con { font-size: 0; display: flex; align-items: center; } #info { position: absolute; top: 0; left: 0; width: 72rpx; height: 72rpx; line-height: 72rpx; border-radius: 50%; background-color: rgba(0, 0, 0, 0.3); text-align: center; color: #fff; font-size: 24rpx; } .wrapper { width: 36rpx; height: 72rpx; position: absolute; top: 0; overflow: hidden; } .right { right: 0; } .left { left: 0; } /* 弹出层形式的广告 */ .uni-banner { width: 540rpx; margin: 0 auto; background: url(https://static.tbmall.xin/static/version-tip.png) no-repeat; background-size: 100% 100%; } .close_btn { position: absolute; top: 0; right: 0; width: 48rpx; height: 48rpx; } .banner_box { // margin-top:140rpx; height: 700rpx; padding: 40rpx; width: 88%; } .title_ { text-align: center; line-height: 96rpx; font-size: 56rpx; color: #fff; font-weight: bold; } .version_ { display: flex; align-items: center; justify-content: center; margin-top: 10rpx; .version_item { background: #FFFFFF; border-radius: 30rpx; color: $app-bt-bj; padding: 8rpx 20rpx; font-size: 30rpx; } } .conter { font-size: 28rpx; margin-top: 280rpx; color: #333; height: 280rpx; overflow: auto; // width: calc(100% - 40rpx); } .banner_foot { margin: 0 auto; } .banner_foot_button { background: linear-gradient(270deg, #B164FB 0%, #7934F6 100%); border-radius: 16rpx; line-height: 72rpx; height: 80rpx; font-size: 32rpx; width: 440rpx; color: #fff; font-weight: bold; border: none; // box-shadow: 0 8rpx 20rpx 0 $app-zt-color; margin-bottom: 20rpx; } .banner_foot_button:active { background-image: linear-gradient(to right, $app-zt-color, $app-zt-color); } .banner_foot_button_no { font-size: 23rpx; color: rgba(0, 0, 0, 0.26); line-height: 33rpx; text-align: center; } .uni-mask { background: rgba(0, 0, 0, 0.6); position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 2; } .banner_loading_msg { text-align: center; font-size: 26rpx; color: rgba(0, 0, 0, 0.26); margin-top: 10rpx; } } // 更新软件 end .header_ { display: flex; align-items: center; justify-content: space-between; padding: 74rpx 20rpx 20rpx; .title_ { // font-weight: bold; font-size: 36rpx; color: #000000; margin-left: 20rpx; } }