/* 提交按钮,在文件内还需要重写一个样式,详情可见 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: 0; 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; border-radius: 20rpx; display: flex; flex-wrap: wrap; justify-content: space-between; .sort_item_comm{ width: 18%; 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(../../static/home/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; } }