asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

fix(dashboard): align items inside quick view popover (#8847)

Browse Source 
* fix(dashboard): align items inside quick view popover

* chore: remove unwanted w-* classes
This commit is contained in:
Riqwan Thamir
2024-08-28 14:37:35 +02:00
committed by GitHub
parent ba24e6882d
commit 8fbfb1445d
1 changed files with 15 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/admin-next/dashboard/src/routes/orders/order-detail/components/order-activity-section/activity-items.tsx
+15 -23
View File
@@ -53,24 +53,21 @@ function ActivityItems(props: ActivityItemsProps) {
<Popover.Content <Popover.Content
align="center" align="center"
side="top" side="top"
className="bg-ui-bg-component p-0" className="bg-ui-bg-component p-0 max-w-[200px]"
> >
<div className="flex flex-col"> <div className="flex flex-col">
{!!itemsToSend?.length && ( {!!itemsToSend?.length && (
<div className="p-3"> <div className="p-3">
<div className="txt-compact-small-plus"> <div className="txt-compact-small-plus mb-1">
{t("orders.activity.events.common.toSend")} {t("orders.activity.events.common.toSend")}
</div> </div>
<div className="flex flex-col items-center"> <div className="flex flex-col">
{itemsToSend?.map((item) => { {itemsToSend?.map((item) => {
const originalItem = itemsMap?.get(item.item_id)! const originalItem = itemsMap?.get(item.item_id)!
return ( return (
<div <div className="flex items-center gap-x-3" key={item.id}>
className="flex flex-1 items-center gap-x-3"
key={item.id}
>
<Text size="small" className="text-ui-fg-subtle"> <Text size="small" className="text-ui-fg-subtle">
{item.quantity}x {item.quantity}x
</Text> </Text>
@@ -78,11 +75,10 @@ function ActivityItems(props: ActivityItemsProps) {
<Thumbnail <Thumbnail
src={originalItem?.variant?.product?.thumbnail} src={originalItem?.variant?.product?.thumbnail}
/> />
<div className="">
<Text className="txt-compact-small text-ui-fg-subtle"> <Text className="txt-compact-small text-ui-fg-subtle truncate">
{`${originalItem?.variant?.title} · ${originalItem?.variant?.product?.title}`} {`${originalItem?.variant?.title} · ${originalItem?.variant?.product?.title}`}
</Text> </Text>
</div>
</div> </div>
) )
})} })}
@@ -94,19 +90,16 @@ function ActivityItems(props: ActivityItemsProps) {
{!!itemsToReturn?.length && ( {!!itemsToReturn?.length && (
<div className="border-t-2 border-dotted p-3"> <div className="border-t-2 border-dotted p-3">
<div className="txt-compact-small-plus"> <div className="txt-compact-small-plus mb-1">
{t("orders.activity.events.common.toReturn")} {t("orders.activity.events.common.toReturn")}
</div> </div>
<div className="flex flex-col items-center"> <div className="flex flex-col">
{itemsToReturn?.map((item) => { {itemsToReturn?.map((item) => {
const originalItem = itemsMap?.get(item.item_id)! const originalItem = itemsMap?.get(item.item_id)!
return ( return (
<div <div className="flex items-center gap-x-3" key={item.id}>
className="flex flex-1 items-center gap-x-3"
key={item.id}
>
<Text size="small" className="text-ui-fg-subtle"> <Text size="small" className="text-ui-fg-subtle">
{item.quantity}x {item.quantity}x
</Text> </Text>
@@ -114,11 +107,10 @@ function ActivityItems(props: ActivityItemsProps) {
<Thumbnail <Thumbnail
src={originalItem?.variant?.product?.thumbnail} src={originalItem?.variant?.product?.thumbnail}
/> />
<div className="">
<Text className="txt-compact-small text-ui-fg-subtle"> <Text className="txt-compact-small text-ui-fg-subtle truncate">
{`${originalItem?.variant?.title} · ${originalItem?.variant?.product?.title}`} {`${originalItem?.variant?.title} · ${originalItem?.variant?.product?.title}`}
</Text> </Text>
</div>
</div> </div>
) )
})} })}