danak/shop-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsive

Browse Source
This commit is contained in:
hamid zarghami
2025-09-03 15:06:15 +03:30
parent 138f26e293
commit d051e7110a
33 changed files with 440 additions and 393 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/CartSummary.tsx
+9 -9
View File
@@ -22,8 +22,8 @@ const Row: FC<{ label: string; value: string | number; emphasize?: boolean }> =
) => {
return (
<div className="flex items-center justify-between text-[#333333]">
<div className="text-sm font-light">{label}</div>
<div className={emphasize ? "font-semibold" : "font-light"}>
<div className="text-xs sm:text-sm font-light">{label}</div>
<div className={`text-sm sm:text-base ${emphasize ? "font-semibold" : "font-light"}`}>
{typeof value === "number" ? NumberFormat(value) : value}
</div>
</div>
@@ -34,30 +34,30 @@ const CartSummary: FC<CartSummaryProps> = (props) => {
const { itemsCount, itemsPrice, discount, total, onConfirm, onDownloadInvoice, className, confirmHref, confirmLabel } = props;
return (
<div className={"rounded-2xl border border-border p-6 h-fit bg-[#FAFAFA] " + (className ?? "")}>
<div className={"rounded-xl sm:rounded-2xl border border-border p-4 sm:p-6 h-fit bg-[#FAFAFA] " + (className ?? "")}>
<div className="flex items-center justify-between">
<div className="text-sm text-muted-foreground">تعداد کالاها</div>
<div>{NumberFormat(itemsCount)} محصول</div>
<div className="text-xs sm:text-sm text-muted-foreground">تعداد کالاها</div>
<div className="text-sm sm:text-base font-medium">{NumberFormat(itemsCount)} محصول</div>
</div>
<div className="mt-6 space-y-5">
<div className="mt-4 sm:mt-6 space-y-3 sm:space-y-5">
<Row label="قیمت کالاها" value={itemsPrice} />
<Row label="تخفیف" value={discount} />
<Row label="جمع فاکتور" value={total} emphasize />
</div>
<div className="mt-8 space-y-3">
<div className="mt-6 sm:mt-8 space-y-2 sm:space-y-3">
<Button
type="button"
onClick={() => onDownloadInvoice?.()}
className="w-full h-12 rounded-xl bg-[#303030] text-white shadow hover:bg-[#303030]/90"
className="w-full h-10 sm:h-12 rounded-lg sm:rounded-xl bg-[#303030] text-white shadow hover:bg-[#303030]/90 text-sm sm:text-base"
>
دانلود پیش‌فاکتور
</Button>
<Button
type="button"
onClick={() => !confirmHref && onConfirm?.()}
className="w-full h-12 rounded-xl text-white"
className="w-full h-10 sm:h-12 rounded-lg sm:rounded-xl text-white text-sm sm:text-base"
>
{confirmHref ? (
<Link href={confirmHref} className="w-full h-full flex items-center justify-center">