Align the card dates into 2 columns instead of 1
This commit is contained in:
@@ -1,4 +1,3 @@
|
||||
|
||||
import { useState } from 'react';
|
||||
import { Calendar, Factory, Clock } from 'lucide-react';
|
||||
import { HoverCard, HoverCardContent, HoverCardTrigger } from '@/components/ui/hover-card';
|
||||
@@ -101,12 +100,13 @@ const JobCardDetails: React.FC<JobCardDetailsProps> = ({ job }) => {
|
||||
|
||||
return (
|
||||
<div className="flex-shrink-0">
|
||||
<div className="grid grid-cols-1 gap-2">
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-2">
|
||||
<div className="flex items-center gap-2 text-sm text-gray-400">
|
||||
<Factory className="w-4 h-4" />
|
||||
<span className="w-16">Job ID:</span>
|
||||
<span>{job.id}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 text-sm text-gray-400">
|
||||
<Calendar className="w-4 h-4" />
|
||||
<span className="w-16">Created:</span>
|
||||
@@ -119,6 +119,7 @@ const JobCardDetails: React.FC<JobCardDetailsProps> = ({ job }) => {
|
||||
fieldName="jobStart"
|
||||
icon={<Clock className="w-4 h-4" />}
|
||||
/>
|
||||
|
||||
<DateField
|
||||
label="End"
|
||||
value={job.jobEnd}
|
||||
@@ -132,6 +133,7 @@ const JobCardDetails: React.FC<JobCardDetailsProps> = ({ job }) => {
|
||||
fieldName="saleStart"
|
||||
icon={<Calendar className="w-4 h-4" />}
|
||||
/>
|
||||
|
||||
<DateField
|
||||
label="Sale End"
|
||||
value={job.saleEnd}
|
||||
|
Reference in New Issue
Block a user