/* 提交按钮,在文件内还需要重写一个样式,详情可见 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; } .add_but_css{ color: #fff; background: $app-bt-bj; 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; } /* 表单添加 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: 160rpx; } .add_form_item_but{ border-bottom: 1rpx solid #EEEEEEFF; } /* 表单添加 end ,一行显示,input没有背景色 */ /* 上传证件照 start 使用地方有:实名认证,商家入驻 */ .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; } /* 上传证件照 start 使用地方有:实名认证,商家入驻 */ /*订单商品列表 start 使用地方有订单列表,订单详情列表*/ .order_item_content{ font-weight: 500; } .content_item{ display: flex; justify-content: space-between; margin-top: 20rpx; } .content_info{ } .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; } .purse_info_title{ font-weight: bold; font-size: 36rpx; color: #111111; } // 为空的页面展示 start 使用页面有:我的订单,购物车 .not_order_warp{ display: grid; justify-content: center; margin-top: 220rpx; .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; .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; position: relative; height: 30rpx; .msg{ position: absolute; top: 10rpx; left: 40%; font-weight: bold; font-size: 32rpx; color: #7F664A; } } .preference_product{ padding: 30rpx; .product_item{ margin-bottom: 20rpx; background: #FFFFFF; border-radius: 16rpx; padding: 20rpx; display: flex; } .product_item_left{ position: relative; .product_item_left_bz{ position: absolute; top: 0; left: 0; font-size: 18rpx; color: #FFF9E4; font-weight: bold; display: flex; justify-content: center; align-items: center; } } .product_item_right{ margin-left: 20rpx; display: grid; .title_warp{ font-weight: bold; font-size: 28rpx; color: #000000; } .price_warp{ display: flex; align-items: flex-end; } .price_o_warp{ width: 42%; 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: 50%; 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 使用地方:购物车,加入购物车,购买页面