Fuck with the colors a bit
This commit is contained in:
@@ -2,7 +2,7 @@
|
|||||||
import { ChevronLeft, ChevronRight } from 'lucide-react';
|
import { ChevronLeft, ChevronRight } from 'lucide-react';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import { IndJob } from '@/lib/types';
|
import { IndJob } from '@/lib/types';
|
||||||
import { getNextStatus, getPreviousStatus, getStatusColor } from '@/utils/jobStatusUtils';
|
import { getNextStatus, getPreviousStatus, getStatusBackgroundColor, getStatusBackgroundColorBright, getStatusColor } from '@/utils/jobStatusUtils';
|
||||||
import { useJobs } from '@/hooks/useDataService';
|
import { useJobs } from '@/hooks/useDataService';
|
||||||
import { useToast } from '@/hooks/use-toast';
|
import { useToast } from '@/hooks/use-toast';
|
||||||
|
|
||||||
@@ -74,7 +74,7 @@ const JobStatusNavigation: React.FC<JobStatusNavigationProps> = ({ job }) => {
|
|||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
handleStatusChange(previousStatus);
|
handleStatusChange(previousStatus);
|
||||||
}}
|
}}
|
||||||
className={`${getStatusColor(previousStatus)} text-white px-4 py-2 rounded flex items-center justify-center gap-1 hover:opacity-80 transition-opacity w-32`}
|
className={`${getStatusBackgroundColorBright(previousStatus)} text-white px-4 py-2 rounded flex items-center justify-center gap-1 hover:opacity-80 transition-opacity w-32`}
|
||||||
data-no-navigate
|
data-no-navigate
|
||||||
title={`Move to ${previousStatus}`}
|
title={`Move to ${previousStatus}`}
|
||||||
>
|
>
|
||||||
@@ -88,7 +88,7 @@ const JobStatusNavigation: React.FC<JobStatusNavigationProps> = ({ job }) => {
|
|||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
handleStatusChange(nextStatus);
|
handleStatusChange(nextStatus);
|
||||||
}}
|
}}
|
||||||
className={`${getStatusColor(nextStatus)} text-white px-4 py-2 rounded flex items-center justify-center gap-1 hover:opacity-80 transition-opacity w-32`}
|
className={`${getStatusBackgroundColorBright(nextStatus)} text-white px-4 py-2 rounded flex items-center justify-center gap-1 hover:opacity-80 transition-opacity w-32`}
|
||||||
data-no-navigate
|
data-no-navigate
|
||||||
title={`Move to ${nextStatus}`}
|
title={`Move to ${nextStatus}`}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -20,18 +20,35 @@ export const getStatusColor = (status: string) => {
|
|||||||
|
|
||||||
export const getStatusBackgroundColor = (status: string) => {
|
export const getStatusBackgroundColor = (status: string) => {
|
||||||
switch (status) {
|
switch (status) {
|
||||||
case 'Planned': return 'bg-gray-600/20';
|
case 'Planned': return `bg-gray-600/25`;
|
||||||
case 'Acquisition': return 'bg-yellow-600/20';
|
case 'Acquisition': return `bg-yellow-600/25`;
|
||||||
case 'Staging': return 'bg-amber-600/20';
|
case 'Staging': return `bg-amber-600/25`;
|
||||||
case 'Inbound': return 'bg-orange-600/20';
|
case 'Inbound': return `bg-orange-600/25`;
|
||||||
case 'Running': return 'bg-blue-600/20';
|
case 'Running': return `bg-blue-600/25`;
|
||||||
case 'Done': return 'bg-purple-600/20';
|
case 'Done': return `bg-purple-600/25`;
|
||||||
case 'Delivered': return 'bg-indigo-600/20';
|
case 'Delivered': return `bg-indigo-600/25`;
|
||||||
case 'Outbound': return 'bg-pink-600/20';
|
case 'Outbound': return `bg-pink-600/25`;
|
||||||
case 'Selling': return 'bg-emerald-600/20';
|
case 'Selling': return `bg-emerald-600/25`;
|
||||||
case 'Closed': return 'bg-green-600/20';
|
case 'Closed': return `bg-green-600/25`;
|
||||||
case 'Tracked': return 'bg-cyan-600/20';
|
case 'Tracked': return `bg-cyan-600/25`;
|
||||||
default: return 'bg-gray-600/20';
|
default: return `bg-gray-600/25`;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export const getStatusBackgroundColorBright = (status: string) => {
|
||||||
|
switch (status) {
|
||||||
|
case 'Planned': return `bg-gray-600/55`;
|
||||||
|
case 'Acquisition': return `bg-yellow-600/55`;
|
||||||
|
case 'Staging': return `bg-amber-600/55`;
|
||||||
|
case 'Inbound': return `bg-orange-600/55`;
|
||||||
|
case 'Running': return `bg-blue-600/55`;
|
||||||
|
case 'Done': return `bg-purple-600/55`;
|
||||||
|
case 'Delivered': return `bg-indigo-600/55`;
|
||||||
|
case 'Outbound': return `bg-pink-600/55`;
|
||||||
|
case 'Selling': return `bg-emerald-600/55`;
|
||||||
|
case 'Closed': return `bg-green-600/55`;
|
||||||
|
case 'Tracked': return `bg-cyan-600/55`;
|
||||||
|
default: return `bg-gray-600/55`;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user