summaryrefslogtreecommitdiff
path: root/src-migrate/modules/cart/components/CartSummaryMobile.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src-migrate/modules/cart/components/CartSummaryMobile.tsx')
-rw-r--r--src-migrate/modules/cart/components/CartSummaryMobile.tsx36
1 files changed, 22 insertions, 14 deletions
diff --git a/src-migrate/modules/cart/components/CartSummaryMobile.tsx b/src-migrate/modules/cart/components/CartSummaryMobile.tsx
index 02258204..7a334fed 100644
--- a/src-migrate/modules/cart/components/CartSummaryMobile.tsx
+++ b/src-migrate/modules/cart/components/CartSummaryMobile.tsx
@@ -29,7 +29,7 @@ const CartSummaryMobile = ({
isLoaded = false,
}: Props) => {
const [showPopup, setShowPopup] = useState(false);
- const PPN : number = process.env.NEXT_PUBLIC_PPN ? parseFloat(process.env.NEXT_PUBLIC_PPN) : 0;
+ const PPN: number = process.env.NEXT_PUBLIC_PPN ? parseFloat(process.env.NEXT_PUBLIC_PPN) : 0;
return (
<>
<BottomPopup
@@ -88,22 +88,30 @@ const CartSummaryMobile = ({
</div>
</BottomPopup>
<div className='flex flex-col gap-y-3'>
- <Skeleton isLoaded={isLoaded} className={style.line}>
- <span className={clsxm(style.label, style.grandTotal)}>
+ <Skeleton
+ isLoaded={isLoaded}
+ className={clsxm(style.line, 'flex items-center justify-between !py-2')}
+ >
+ {/* Left: label */}
+ <span className={clsxm(style.label, style.grandTotal, 'leading-tight')}>
Grand Total
</span>
- <button
- onClick={() => setShowPopup(true)}
- className='bg-gray-300 w-6 h-6 items-center justify-center cursor-pointer hover:bg-red-400 md:hidden '
- >
- <ChevronDownIcon className='h-6 w-6 text-white' />
- </button>
- </Skeleton>
- <Skeleton isLoaded={isLoaded} className={style.line}>
- <span className={style.value}>
- Rp {formatCurrency(grandTotal || 0)}
- </span>
+
+ {/* Right: amount + chevron */}
+ <div className="flex items-center gap-2">
+ <span className={clsxm(style.value, 'whitespace-nowrap tabular-nums leading-tight')}>
+ Rp {formatCurrency(grandTotal || 0)}
+ </span>
+ <button
+ onClick={() => setShowPopup(true)}
+ aria-label="Expand ringkasan"
+ className="md:hidden flex w-5 h-5 items-center justify-center rounded bg-gray-300 hover:bg-gray-400"
+ >
+ <ChevronDownIcon className="h-4 w-4 text-white" />
+ </button>
+ </div>
</Skeleton>
+
</div>
</>
);