update color for warning card

This commit is contained in:
Nate Kelley 2025-09-26 10:42:08 -06:00
parent dbf1a6ef2f
commit 77012027ba
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
1 changed files with 15 additions and 15 deletions

View File

@ -25,14 +25,14 @@ export const NewChatWarning = React.memo(
const progressPercentage = (progress / 2) * 100;
return (
<div className="flex flex-col rounded-xl border border-gray-200 bg-white p-6 shadow-sm">
<div className="flex flex-col rounded border border-gray-200 bg-white p-6 shadow-sm">
<div className="mb-2 flex items-center justify-between">
<Text className="text-xl font-medium text-gray-800">Setup Checklist</Text>
<div className="flex items-center gap-2">
<div className="text-sm font-medium text-gray-500">{progress}/2 completed</div>
<div className="h-2 w-20 rounded-full bg-gray-100">
<div
className="h-full rounded-full bg-purple-500 transition-all duration-500 ease-in-out"
className="h-full rounded-full bg-gray-600 transition-all duration-500 ease-in-out"
style={{ width: `${progressPercentage}%` }}
/>
</div>
@ -65,7 +65,7 @@ export const NewChatWarning = React.memo(
<div
className={cn(
'mt-5 flex items-center rounded-lg border p-4',
'mt-5 flex items-center rounded border p-4',
allCompleted ? 'border-gray-200 bg-gray-50' : 'border-gray-200 bg-gray-50'
)}
>
@ -114,14 +114,14 @@ const SetupItem = ({ number, status, title, description, link, linkText }: Setup
return (
<div
className={cn(
'group relative flex items-start space-x-4 rounded-lg border p-4 transition-all duration-200 hover:shadow-sm',
status ? 'border-purple-700/30 bg-purple-50' : 'border-gray-200'
'group relative flex items-start space-x-4 rounded border p-4 transition-all duration-200 hover:shadow-sm',
status ? 'border-gray-400/30 bg-gray-50' : 'border-gray-200'
)}
>
<div
className={cn(
'text-md flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full font-medium',
status ? 'bg-purple-200/60 text-purple-700' : 'bg-gray-100 text-gray-500'
status ? 'bg-gray-200 text-gray-700' : 'bg-gray-100 text-gray-500'
)}
>
{status ? <CircleCheck title="Complete" /> : number}
@ -131,7 +131,7 @@ const SetupItem = ({ number, status, title, description, link, linkText }: Setup
<div className="flex items-center justify-between">
<Text className="font-medium text-gray-800">{title}</Text>
{status && (
<span className="rounded-full bg-purple-200/60 px-2 py-1 text-xs font-medium text-purple-700">
<span className="rounded-full bg-gray-200 px-2 py-1 text-xs font-medium text-gray-700">
Complete
</span>
)}
@ -170,8 +170,8 @@ const ContactAdminCard = ({ userRole }: ContactAdminCardProps) => {
<div className="flex flex-col rounded border border-gray-200 bg-white p-6">
<div className="mb-4 flex items-center justify-between">
<Text className="text-xl font-medium text-gray-800">Contact Admin Required</Text>
<div className="rounded-full bg-blue-100 px-3 py-1">
<Text className="text-sm font-medium text-blue-700">{roleLabel}</Text>
<div className="rounded bg-gray-100 px-3 py-1 border">
<Text className="text-sm font-medium text-gray-700">{roleLabel}</Text>
</div>
</div>
@ -180,20 +180,20 @@ const ContactAdminCard = ({ userRole }: ContactAdminCardProps) => {
</Paragraph>
<div className="space-y-4">
<div className="rounded-lg border border-blue-200 bg-blue-50 p-4">
<div className="rounded border border-gray-200 bg-gray-50 p-4">
<div className="flex items-start space-x-3">
<div className="flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full bg-blue-200">
<Text className="text-sm font-medium text-blue-700">
<div className="flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full bg-gray-200">
<Text className="text-sm font-medium text-gray-700">
<AlertWarning />
</Text>
</div>
<div className="min-w-0 flex-1">
<Text className="font-medium text-blue-800">Permission Required</Text>
<Paragraph className="mt-1 text-sm text-blue-700">
<Text className="font-medium text-gray-800">Permission Required</Text>
<Paragraph className="mt-1 text-sm text-gray-700">
Your current role is <span className="font-semibold">{roleLabel}</span>. To start
asking questions, an admin needs to:
</Paragraph>
<ul className="mt-2 list-disc space-y-1 pl-4 text-sm text-blue-700">
<ul className="mt-2 list-disc space-y-1 pl-4 text-sm text-gray-700">
<li>Connect data sources to your organization</li>
<li>Create datasets from those data sources</li>
<li>Grant you access to the relevant datasets</li>