matt/dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update cards size/layout

Browse Source
This commit is contained in:
Matt
2025-01-03 17:02:33 -05:00
parent 2c5f7cc446
commit 9718eaf146
1 changed files with 9 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
dashboard/src/components/dashboard/MiniEventFeed.jsx
View File

@@ -145,9 +145,9 @@ const EventCard = ({ event }) => {
return (
<EventDialog event={event}>
<Card className={`w-[240px] shrink-0 hover:brightness-110 cursor-pointer transition-colors h-[140px] bg-gradient-to-br ${getBgGradient(event.metric_id)} backdrop-blur-sm`}>
<CardHeader className="flex flex-row items-center justify-between space-y-0 p-3 pb-2">
<div className="flex items-center gap-2">
<Card className={`w-[210px] shrink-0 hover:brightness-110 cursor-pointer transition-colors h-[125px] bg-gradient-to-br ${getBgGradient(event.metric_id)} backdrop-blur-sm`}>
<CardHeader className="flex flex-row items-center justify-between space-y-0 px-3 py-2 pb-0">
<div className="flex items-baseline justify-between w-full pr-1">
<CardTitle className="text-sm font-bold text-gray-100">
{eventType.label}
</CardTitle>
@@ -174,7 +174,7 @@ const EventCard = ({ event }) => {
</div>
</div>
{(details.IsOnHold || details.OnHoldReleased || details.StillOwes || details.LocalPickup || details.HasPreorder || details.HasNotions || details.OnlyDigitalGC || details.HasDigitalGC || details.HasDigiItem || details.OnlyDigiItem) && (
<div className="flex gap-1.5 items-center flex-wrap mt-2">
<div className="flex gap-1.5 items-center flex-wrap mt-1">
{details.IsOnHold && (
<Badge
variant="secondary"
@@ -254,9 +254,7 @@ const EventCard = ({ event }) => {
#{details.OrderId} • {formatShipMethodSimple(details.ShipMethod)}
</div>
</div>
<div className="text-xs text-gray-400 mt-1.5 truncate">
{details.ShippingStreet1}, {details.ShippingCity}, {details.ShippingState} {details.ShippingZip}
</div>
</>
)}
@@ -381,10 +379,10 @@ const MiniEventFeed = ({
}, [fetchEvents]);
return (
<div className="fixed bottom-0 left-0 right-0 bg-background/80 backdrop-blur-sm border-t">
<div className="p-4">
<div className="overflow-x-auto">
<div className="flex flex-row-reverse gap-3 pr-4" style={{ width: 'max-content' }}>
<div className="fixed bottom-0 left-0 right-0">
<div className="p-2">
<div className="overflow-x-auto overflow-y-hidden [&::-webkit-scrollbar]:hidden [-ms-overflow-style:'none'] [scrollbar-width:'none']">
<div className="flex flex-row gap-3 pr-4" style={{ width: 'max-content' }}>
{loading && !events.length ? (
<LoadingState />
) : error ? (