From c2335d5d730543c3c24a537dbcf12ed20874369f Mon Sep 17 00:00:00 2001 From: Haiyi <1021441632@qq.com> Date: Thu, 8 Dec 2022 20:00:44 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20fix(ID1000942):=E8=AE=A2?= =?UTF-8?q?=E5=8D=95=E8=AF=A6=E6=83=85=E7=9A=84=E5=90=88=E8=AE=A1=E9=87=91?= =?UTF-8?q?=E9=A2=9D=E8=BF=9B=E4=BD=8D=E8=A7=84=E5=88=99=EF=BC=8C=E5=BA=94?= =?UTF-8?q?=E4=B8=8E=E5=BA=94=E6=94=B6=E5=8D=95=E4=B8=80=E8=87=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/orderDetails/index.module.scss | 611 +++++++++++---------- src/pages/orderDetails/index.tsx | 2 +- src/pages/submitOrder/index.module.scss | 648 +++++++++++------------ 3 files changed, 622 insertions(+), 639 deletions(-) diff --git a/src/pages/orderDetails/index.module.scss b/src/pages/orderDetails/index.module.scss index f2ce68c..334adb8 100644 --- a/src/pages/orderDetails/index.module.scss +++ b/src/pages/orderDetails/index.module.scss @@ -1,379 +1,370 @@ page { - background: #f7f7f7; + background: #f7f7f7; } .mainBox { - .pussBox { - margin-top: 24px; + .pussBox { + margin-top: 24px; + display: flex; + align-items: center; + + .pussName { + font-size: 28px; + font-weight: 400; + color: #000000; + } + + .pussPhone { + margin-left: 88px; + font-size: 28px; + font-weight: 400; + color: #000000; + } + } + + .total { + margin-top: 44px; + font-size: 24px; + font-weight: 400; + color: #000000; + margin-left: 32px; + margin-bottom: 8px; + } + + .productBox { + // width: 702px; + margin-right: 24px; + background: #ffffff; + border-radius: 16px; + margin-left: 24px; + padding-bottom: 36px; + overflow: hidden; + + .flexMoney { + display: flex; + margin-top: 32px; + align-items: center; + justify-content: space-between; + + .flexTotalBox { display: flex; align-items: center; - .pussName { - font-size: 28px; - font-weight: 400; - color: #000000; + .totalFont { + margin-left: 32px; + margin-right: 8px; + font-size: 28px; + font-weight: 400; + color: #000000; } - .pussPhone { - margin-left: 88px; - font-size: 28px; - font-weight: 400; - color: #000000; - } - } - - .total { - margin-top: 44px; - font-size: 24px; - font-weight: 400; - color: #000000; - margin-left: 32px; - margin-bottom: 8px; - } - - .productBox { - // width: 702px; - margin-right: 24px; - background: #FFFFFF; - border-radius: 16px; - margin-left: 24px; - padding-bottom: 36px; - overflow: hidden; - - .flexMoney { - display: flex; - margin-top: 32px; - align-items: center; - justify-content: space-between; - - .flexTotalBox { - display: flex; - align-items: center; - - .totalFont { - margin-left: 32px; - margin-right: 8px; - font-size: 28px; - font-weight: 400; - color: #000000; - } - - .tishi { - font-size: 28px; - } - } - - .shoudPay { - font-size: 28px; - font-weight: 500; - color: #F64861; - margin-right: 32px; - } + .tishi { + font-size: 28px; } + } + + .shoudPay { + font-size: 28px; + font-weight: 500; + color: #f64861; + margin-right: 32px; + } } + } } - .defaltBox { - margin: 24px; - padding: 24px 32px 24px 24px; - background: #FFFFFF; - border-radius: 16px; + margin: 24px; + padding: 24px 32px 24px 24px; + background: #ffffff; + border-radius: 16px; - .titleBox { - // margin-right: 24px; - // margin-left: 24px; - // width: 638px; - display: flex; - justify-content: space-between; - align-items: center; + .titleBox { + // margin-right: 24px; + // margin-left: 24px; + // width: 638px; + display: flex; + justify-content: space-between; + align-items: center; - .title { - font-size: 28px; - font-weight: 500; - color: #000000; - } - - .modeName { - font-size: 28px; - font-weight: 500; - color: #337FFF; - } + .title { + font-size: 28px; + font-weight: 500; + color: #000000; } - .modeLine { - margin-top: 24px; - // width: 638px; - // margin-right: 24px; - // margin-left: 24px; - height: 1px; - background: #000000; - opacity: 0.1; + .modeName { + font-size: 28px; + font-weight: 500; + color: #337fff; } + } + .modeLine { + margin-top: 24px; + // width: 638px; + // margin-right: 24px; + // margin-left: 24px; + height: 1px; + background: #000000; + opacity: 0.1; + } } .goodsBox { + margin-top: 24px; + overflow: hidden; + border-bottom: 8px solid #f7f7f7; + + .goodsProduct { + font-size: 28px; + font-weight: 500; + color: #000000; + margin-left: 32px; + } + + .goodsLine { + margin-right: 24px; + margin-left: 24px; + // width: 638px; + height: 1px; + background: #000000; + opacity: 0.1; + margin-left: 32px; margin-top: 24px; - overflow: hidden; - border-bottom: 8px solid #F7F7F7; + } - .goodsProduct { - font-size: 28px; - font-weight: 500; - color: #000000; - margin-left: 32px; + .itemGoods { + margin-top: 24px; + display: flex; + + .itemPic { + margin-left: 32px; + margin-right: 42px; + width: 108px; + height: 108px; + // background: #322F2F; + border-radius: 8px; } - .goodsLine { - margin-right: 24px; - margin-left: 24px; - // width: 638px; - height: 1px; - background: #000000; - opacity: 0.1; - margin-left: 32px; - margin-top: 24px; - } + .itemRight { + padding-bottom: 24px; + margin-right: 32px; + width: 495px; + border-bottom: 1px solid #f7f7f7; - .itemGoods { - margin-top: 24px; + .item_right_top { + margin-bottom: 41px; display: flex; + align-items: center; + justify-content: space-between; - .itemPic { - margin-left: 32px; - margin-right: 42px; - width: 108px; - height: 108px; - background: #322F2F; - border-radius: 8px; + .itemName { + font-size: 28px; + font-weight: 400; + color: #000000; } - .itemRight { - padding-bottom: 24px; - margin-right: 32px; - width: 495px; - border-bottom: 1px solid #f7f7f7; - - .item_right_top { - margin-bottom: 41px; - display: flex; - align-items: center; - justify-content: space-between; - - .itemName { - font-size: 28px; - font-weight: 400; - color: #000000; - } - - .itemNums { - font-size: 28px; - font-weight: 400; - color: #000000; - } - } - - .item_right_Bottom { - display: flex; - align-items: center; - justify-content: space-between; - - .itemMoney { - font-size: 28px; - font-weight: 400; - color: #a5a5a5; - } - - .itemMoneyOne { - font-size: 28px; - font-weight: 500; - color: #333333; - } - } + .itemNums { + font-size: 28px; + font-weight: 400; + color: #000000; } + } - - } - - .itemGoods:last-child { - margin-top: 24px; + .item_right_Bottom { display: flex; + align-items: center; + justify-content: space-between; - .itemPic { - margin-left: 32px; - margin-right: 42px; - width: 108px; - height: 108px; - background: #322F2F; - border-radius: 8px; + .itemMoney { + font-size: 28px; + font-weight: 400; + color: #a5a5a5; } - .itemRight { - padding-bottom: 24px; - width: 495px; - border-bottom: none; - - .item_right_top { - margin-bottom: 41px; - display: flex; - align-items: center; - justify-content: space-between; - - .itemName { - font-size: 28px; - font-weight: 400; - color: #000000; - } - - .itemNums { - font-size: 28px; - font-weight: 400; - color: #000000; - } - } - - .item_right_Bottom { - display: flex; - align-items: center; - justify-content: space-between; - - .itemMoney { - font-size: 28px; - font-weight: 400; - color: #a5a5a5; - } - - .itemMoneyOne { - font-size: 28px; - font-weight: 500; - color: #333333; - } - } + .itemMoneyOne { + font-size: 28px; + font-weight: 500; + color: #333333; } - - + } } + } + + .itemGoods:last-child { + margin-top: 24px; + display: flex; + + .itemPic { + margin-left: 32px; + margin-right: 42px; + width: 108px; + height: 108px; + // background: #322F2F; + border-radius: 8px; + } + + .itemRight { + padding-bottom: 24px; + width: 495px; + border-bottom: none; + + .item_right_top { + margin-bottom: 41px; + display: flex; + align-items: center; + justify-content: space-between; + + .itemName { + font-size: 28px; + font-weight: 400; + color: #000000; + } + + .itemNums { + font-size: 28px; + font-weight: 400; + color: #000000; + } + } + + .item_right_Bottom { + display: flex; + align-items: center; + justify-content: space-between; + + .itemMoney { + font-size: 28px; + font-weight: 400; + color: #a5a5a5; + } + + .itemMoneyOne { + font-size: 28px; + font-weight: 500; + color: #333333; + } + } + } + } } .goodsBox:last-child { - border-bottom: none; + border-bottom: none; } .detailBox { + display: flex; + margin-top: 24px; + align-items: center; + justify-content: space-between; + + .detailRightFlex { display: flex; - margin-top: 24px; align-items: center; - justify-content: space-between; - .detailRightFlex { - display: flex; - align-items: center; - - .detailRight { - - font-size: 28px; - font-weight: 400; - color: #000000; - } - - .detailBtn { - margin-left: 16px; - width: 65px; - height: 32px; - border-radius: 8px; - border: 1PX solid #337FFF; - font-size: 24px; - font-weight: 400; - color: #337FFF; - text-align: center; - line-height: 32px; - } + .detailRight { + font-size: 28px; + font-weight: 400; + color: #000000; } - .detailFont { - font-size: 28px; - font-weight: 400; - color: #b8b8b8; + .detailBtn { + margin-left: 16px; + width: 65px; + height: 32px; + border-radius: 8px; + border: 1px solid #337fff; + font-size: 24px; + font-weight: 400; + color: #337fff; + text-align: center; + line-height: 32px; } + } + + .detailFont { + font-size: 28px; + font-weight: 400; + color: #b8b8b8; + } } .remarkFont { - margin-top: 24px; - font-size: 28px; - font-weight: 400; - color: #000000; + margin-top: 24px; + font-size: 28px; + font-weight: 400; + color: #000000; } .safeBottom { - height: 300px; + height: 300px; } .bottomBox { - display: flex; - justify-content: space-between; - align-items: center; - // width: 750px; - width: 100%; - height: 160px; - background: #FFFFFF; - position: fixed; - bottom: 0; - padding-bottom: 24px; + display: flex; + justify-content: space-between; + align-items: center; + // width: 750px; + width: 100%; + height: 160px; + background: #ffffff; + position: fixed; + bottom: 0; + padding-bottom: 24px; - // position: relative; - .moreFontBox { - width: 200px; + // position: relative; + .moreFontBox { + width: 200px; - .moreFont { - font-size: 28px; - font-weight: 400; - color: rgba(0, 0, 0, 0.8); - margin-left: 48px; - } + .moreFont { + font-size: 28px; + font-weight: 400; + color: rgba(0, 0, 0, 0.8); + margin-left: 48px; } + } + .posssBox { + position: absolute; + left: 32px; + z-index: 99; + bottom: 170px; + // width: 120px; + padding: 24px; + background: #fff; + border: 1px solid #ccc; + box-shadow: 2px 2px 2px #ccc; + } - - .posssBox { - position: absolute; - left: 32px; - z-index: 99; - bottom: 170px; - // width: 120px; - padding: 24px; - background: #fff; - border: 1px solid #ccc; - box-shadow: 2px 2px 2px #ccc; - } - - .posssBox:after { - display: inline-block; - position: absolute; - bottom: -20px; - z-index: 88; - // left: 5px; - width: 0; - height: 0px; - content: ''; - border-style: solid; - border-width: 20px; - border-color: #fff #fff transparent transparent; - transform: rotate(135deg); - box-shadow: 2px -2px 2px #ccc; - } + .posssBox:after { + display: inline-block; + position: absolute; + bottom: -20px; + z-index: 88; + // left: 5px; + width: 0; + height: 0px; + content: ''; + border-style: solid; + border-width: 20px; + border-color: #fff #fff transparent transparent; + transform: rotate(135deg); + box-shadow: 2px -2px 2px #ccc; + } } .order_save_address { - height: 82px; - background: #007aff; - border-radius: 40px; - // width: 668px; - text-align: center; - line-height: 82px; - color: #fff; - margin-top: 20px; - margin-left: 24px; - margin-right: 24px; - margin-bottom: 20px; -} \ No newline at end of file + height: 82px; + background: #007aff; + border-radius: 40px; + // width: 668px; + text-align: center; + line-height: 82px; + color: #fff; + margin-top: 20px; + margin-left: 24px; + margin-right: 24px; + margin-bottom: 20px; +} diff --git a/src/pages/orderDetails/index.tsx b/src/pages/orderDetails/index.tsx index 6c3a359..1cdcc77 100644 --- a/src/pages/orderDetails/index.tsx +++ b/src/pages/orderDetails/index.tsx @@ -104,7 +104,7 @@ const GoodsItem = (porps: PropGoods) => { x{obj?.sale_mode === 0 ? it.roll : it.length / 100}{obj?.sale_mode === 0 ? '条' : 'm'} - ¥{it.sale_price / 100}/{obj?.sale_mode === 1 ? 'm' : 'kg'} + ¥{formatPriceDiv(it.sale_price)}/{obj?.sale_mode === 1 ? 'm' : 'kg'} ¥{formatPriceDiv(it.total_sale_price)} diff --git a/src/pages/submitOrder/index.module.scss b/src/pages/submitOrder/index.module.scss index 538202b..5f1a11f 100644 --- a/src/pages/submitOrder/index.module.scss +++ b/src/pages/submitOrder/index.module.scss @@ -1,383 +1,375 @@ page { - background: #f7f7f7; + background: #f7f7f7; } .mainBox { - .pussBox { - margin-top: 24px; - display: flex; - align-items: center; - - .pussName { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .pussPhone { - margin-left: 88px; - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - } - - .total { - margin-top: 44px; - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - margin-left: 32px; - margin-bottom: 8px; - } - - .productBox { - width: 702px; - background: #FFFFFF; - border-radius: 16px; - margin-left: 24px; - padding-bottom: 36px; - overflow: hidden; - - .flexMoney { - display: flex; - margin-top: 32px; - align-items: center; - justify-content: space-between; - - .flexTotalBox { - display: flex; - align-items: center; - - .totalFont { - margin-left: 32px; - margin-right: 8px; - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .tishi { - font-size: 28px; - } - } - - .shoudPay { - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #F64861; - margin-right: 32px; - } - } - } -} - - -.defaltBox { - margin: 24px; - padding: 24px 32px 24px 24px; - background: #FFFFFF; - border-radius: 16px; - - .titleBox { - width: 638px; - display: flex; - justify-content: space-between; - align-items: center; - - .title { - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #000000; - } - - .modeName { - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #337FFF; - } - } - - .modeLine { - margin-top: 24px; - width: 638px; - height: 1px; - background: #000000; - opacity: 0.1; - } - -} - -.goodsBox { + .pussBox { margin-top: 24px; - overflow: hidden; - border-bottom: 8px solid #F7F7F7; + display: flex; + align-items: center; - .goodsProduct { + .pussName { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .pussPhone { + margin-left: 88px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + } + + .total { + margin-top: 44px; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + margin-left: 32px; + margin-bottom: 8px; + } + + .productBox { + width: 702px; + background: #ffffff; + border-radius: 16px; + margin-left: 24px; + padding-bottom: 36px; + overflow: hidden; + + .flexMoney { + display: flex; + margin-top: 32px; + align-items: center; + justify-content: space-between; + + .flexTotalBox { + display: flex; + align-items: center; + + .totalFont { + margin-left: 32px; + margin-right: 8px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .tishi { + font-size: 28px; + } + } + + .shoudPay { font-size: 28px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; - color: #000000; - margin-left: 32px; + color: #f64861; + margin-right: 32px; + } + } + } +} + +.defaltBox { + margin: 24px; + padding: 24px 32px 24px 24px; + background: #ffffff; + border-radius: 16px; + + .titleBox { + width: 638px; + display: flex; + justify-content: space-between; + align-items: center; + + .title { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; } - .goodsLine { - width: 638px; - height: 1px; - background: #000000; - opacity: 0.1; - margin-left: 32px; - margin-top: 24px; + .modeName { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #337fff; + } + } + + .modeLine { + margin-top: 24px; + width: 638px; + height: 1px; + background: #000000; + opacity: 0.1; + } +} + +.goodsBox { + margin-top: 24px; + overflow: hidden; + border-bottom: 8px solid #f7f7f7; + + .goodsProduct { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + margin-left: 32px; + } + + .goodsLine { + width: 638px; + height: 1px; + background: #000000; + opacity: 0.1; + margin-left: 32px; + margin-top: 24px; + } + + .itemGoods { + margin-top: 24px; + display: flex; + + .itemPic { + margin-left: 32px; + margin-right: 42px; + width: 108px; + height: 108px; + // background: #322F2F; + border-radius: 8px; } - .itemGoods { - margin-top: 24px; + .itemRight { + padding-bottom: 24px; + width: 495px; + border-bottom: 1px solid #f7f7f7; + + .item_right_top { + margin-bottom: 41px; display: flex; + align-items: center; + justify-content: space-between; - .itemPic { - margin-left: 32px; - margin-right: 42px; - width: 108px; - height: 108px; - background: #322F2F; - border-radius: 8px; + .itemName { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; } - .itemRight { - padding-bottom: 24px; - width: 495px; - border-bottom: 1px solid #f7f7f7; - - .item_right_top { - margin-bottom: 41px; - display: flex; - align-items: center; - justify-content: space-between; - - .itemName { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .itemNums { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - } - - .item_right_Bottom { - display: flex; - align-items: center; - justify-content: space-between; - - .itemMoney { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .itemMoneyOne { - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #000000; - } - } + .itemNums { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; } + } - - } - - .itemGoods:last-child { - margin-top: 24px; + .item_right_Bottom { display: flex; + align-items: center; + justify-content: space-between; - .itemPic { - margin-left: 32px; - margin-right: 42px; - width: 108px; - height: 108px; - background: #322F2F; - border-radius: 8px; + .itemMoney { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; } - .itemRight { - padding-bottom: 24px; - width: 495px; - border-bottom: none; - - .item_right_top { - margin-bottom: 41px; - display: flex; - align-items: center; - justify-content: space-between; - - .itemName { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .itemNums { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - } - - .item_right_Bottom { - display: flex; - align-items: center; - justify-content: space-between; - - .itemMoney { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .itemMoneyOne { - font-size: 28px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #000000; - } - } + .itemMoneyOne { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; } - - + } } + } + + .itemGoods:last-child { + margin-top: 24px; + display: flex; + + .itemPic { + margin-left: 32px; + margin-right: 42px; + width: 108px; + height: 108px; + // background: #322F2F; + border-radius: 8px; + } + + .itemRight { + padding-bottom: 24px; + width: 495px; + border-bottom: none; + + .item_right_top { + margin-bottom: 41px; + display: flex; + align-items: center; + justify-content: space-between; + + .itemName { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .itemNums { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + } + + .item_right_Bottom { + display: flex; + align-items: center; + justify-content: space-between; + + .itemMoney { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .itemMoneyOne { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + } + } + } + } } .goodsBox:last-child { - border-bottom: none; + border-bottom: none; } .detailBox { + display: flex; + margin-top: 24px; + align-items: center; + justify-content: space-between; + + .detailRightFlex { display: flex; - margin-top: 24px; align-items: center; - justify-content: space-between; - .detailRightFlex { - display: flex; - align-items: center; - - .detailRight { - - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - - .detailBtn { - margin-left: 16px; - width: 65px; - height: 32px; - border-radius: 8px; - border: 1PX solid #337FFF; - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #337FFF; - text-align: center; - line-height: 32px; - } + .detailRight { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; } - .detailFont { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; + .detailBtn { + margin-left: 16px; + width: 65px; + height: 32px; + border-radius: 8px; + border: 1px solid #337fff; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #337fff; + text-align: center; + line-height: 32px; } -} + } -.remarkFont { - margin-top: 24px; + .detailFont { font-size: 28px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #000000; + } +} + +.remarkFont { + margin-top: 24px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; } .safeBottom { - height: 300px; + height: 300px; } .bottomBox { - width: 750px; - height: 160px; - background: #FFFFFF; - display: flex; - // padding-top: 16px; - position: fixed; - bottom: 0; - justify-content: space-between; + width: 750px; + height: 160px; + background: #ffffff; + display: flex; + // padding-top: 16px; + position: fixed; + bottom: 0; + justify-content: space-between; - .leftBottom { - margin-top: 22px; + .leftBottom { + margin-top: 22px; - .topFlex { - margin-left: 48px; - display: flex; - align-items: center; - margin-bottom: 14px; + .topFlex { + margin-left: 48px; + display: flex; + align-items: center; + margin-bottom: 14px; - .topFont { - font-size: 28px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - margin-right: 10px; - } + .topFont { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + margin-right: 10px; + } - .topTotal { - font-size: 24px; - font-family: PingFangSC-Medium, PingFang SC; - font-weight: 500; - color: #F64861; - } - } - - .bottomFlex { - margin-left: 48px; - font-size: 24px; - font-family: PingFangSC-Regular, PingFang SC; - font-weight: 400; - color: #000000; - } - } - - - .rightBottom { - margin-top: 16px; - width: 224px; - height: 80px; - background: #4581FF; - border-radius: 40px; - font-size: 32px; + .topTotal { + font-size: 24px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; - color: #FFFFFF; - text-align: center; - line-height: 80px; - margin-right: 24px; + color: #f64861; + } } -} \ No newline at end of file + + .bottomFlex { + margin-left: 48px; + font-size: 24px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + } + + .rightBottom { + margin-top: 16px; + width: 224px; + height: 80px; + background: #4581ff; + border-radius: 40px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #ffffff; + text-align: center; + line-height: 80px; + margin-right: 24px; + } +}