feat: 购买页面

src/pages/pricing/components/OrderSummary/index.tsx

@@ -19,8 +19,8 @@ const OrderSummary = memo(({ selectedPlan }: OrderSummaryProps) => {
     const { orderTotal } = useService({ selectedPlan });
 
     return (
-        <div className="flex flex-col gap-5 bg-[#1B1D22] rounded-xl p-[25px_30px_25px_25px] shadow-[0px_4px_10px_0px_rgba(0,0,0,0.05)]">
-            <div className="flex flex-col gap-5">
+        <div className={`flex flex-col bg-[#1B1D22] rounded-xl shadow-[0px_4px_10px_0px_rgba(0,0,0,0.05)] ${isMobile ? 'p-[14px] gap-2' : 'p-[25px_30px_25px_25px] gap-5'}`}>
+            <div className={`flex flex-col ${isMobile ? 'gap-2' : 'gap-5'}`}>
                 <LabelValueItem
                     label={t('pages.pricing.orderSummary.orderTotal')}
                     value={orderTotal}
@@ -32,7 +32,7 @@ const OrderSummary = memo(({ selectedPlan }: OrderSummaryProps) => {
             </p>
             <div className={`flex gap-5 ${isMobile ? 'flex-col' : 'flex-row'}`}>
                 <Button
-                    className="bg-[#0EA5E9] text-white text-sm font-medium leading-[1.4] uppercase rounded-[25px] px-[42px] py-[10px] h-auto border-none hover:bg-[#0EA5E9]/80"
+                    className={`bg-[#0EA5E9] text-white text-sm font-medium leading-[1.4] uppercase rounded-[25px] px-[42px] py-[10px] h-auto border-none hover:bg-[#0EA5E9]/80 ${!isMobile ? 'w-[300px]' : ''}`}
                     onClick={() => {
                         // Handle payment
                     }}