mirror of
https://github.com/arc53/DocsGPT.git
synced 2026-05-07 06:30:03 +00:00
style: standardize colors across components according to figma
This commit is contained in:
Siddhant Rai
@@ -37,7 +37,7 @@ function MainLayout() {
|
||||
const [navOpen, setNavOpen] = useState(!(isMobile || isTablet));
|
||||
|
||||
return (
|
||||
<div className="bg-card relative h-screen overflow-hidden">
|
||||
<div className="bg-background relative h-screen overflow-hidden">
|
||||
<Navigation navOpen={navOpen} setNavOpen={setNavOpen} />
|
||||
<ActionButtons showNewChat={true} showShare={true} />
|
||||
<div
|
||||
|
||||
@@ -44,7 +44,7 @@ export default function Hero({
|
||||
<button
|
||||
key={key}
|
||||
onClick={() => handleQuestion({ question: demo.query })}
|
||||
className={`border-border text-foreground hover:bg-muted bg-card w-full rounded-[66px] border px-6 py-3.5 text-left transition-colors ${key >= 2 ? 'hidden md:block' : ''}`}
|
||||
className={`border-border text-foreground hover:bg-muted dark:hover:bg-muted/50 bg-card dark:bg-transparent w-full rounded-[66px] border px-6 py-3.5 text-left transition-colors ${key >= 2 ? 'hidden md:block' : ''}`}
|
||||
>
|
||||
<p className="text-black-1000 dark:text-foreground mb-2 font-semibold">
|
||||
{demo.header}
|
||||
|
||||
@@ -5,7 +5,7 @@ export default function PageNotFound() {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<div className="bg-card grid min-h-screen">
|
||||
<div className="bg-background grid min-h-screen">
|
||||
<p className="text-foreground mx-auto my-auto mt-20 flex w-full max-w-6xl flex-col place-items-center gap-6 rounded-3xl bg-gray-100 p-6 lg:p-10 xl:p-16 dark:text-gray-100">
|
||||
<h1>{t('pageNotFound.title')}</h1>
|
||||
<p>{t('pageNotFound.message')}</p>
|
||||
|
||||
@@ -757,7 +757,7 @@ export default function NewAgent({ mode }: { mode: 'new' | 'edit' | 'draft' }) {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-muted dark:bg-accent mt-3 flex w-full flex-1 grid-cols-5 flex-col gap-10 rounded-[30px] p-5 max-[1179px]:overflow-visible min-[1180px]:grid min-[1180px]:gap-5 min-[1180px]:overflow-hidden">
|
||||
<div className="bg-muted dark:bg-background mt-3 flex w-full flex-1 grid-cols-5 flex-col gap-10 rounded-[30px] p-5 max-[1179px]:overflow-visible min-[1180px]:grid min-[1180px]:gap-5 min-[1180px]:overflow-hidden">
|
||||
<div className="scrollbar-overlay col-span-2 flex flex-col gap-5 max-[1179px]:overflow-visible min-[1180px]:max-h-full min-[1180px]:overflow-y-auto min-[1180px]:pr-3">
|
||||
<div className="bg-card rounded-[30px] px-6 py-3">
|
||||
<h2 className="text-lg font-semibold">
|
||||
|
||||
@@ -2,13 +2,13 @@ import 'reactflow/dist/style.css';
|
||||
|
||||
import {
|
||||
AlertCircle,
|
||||
ChartColumn,
|
||||
Bot,
|
||||
ChartColumn,
|
||||
Database,
|
||||
Flag,
|
||||
GitBranch,
|
||||
Loader2,
|
||||
Link,
|
||||
Loader2,
|
||||
Pencil,
|
||||
Play,
|
||||
Plus,
|
||||
@@ -1333,12 +1333,12 @@ function WorkflowBuilderInner() {
|
||||
return (
|
||||
<>
|
||||
<MobileBlocker />
|
||||
<div className="bg-background fixed inset-0 z-50 hidden h-screen w-full flex-col md:flex">
|
||||
<div className="border-border flex items-center justify-between border-b bg-card px-6 py-4">
|
||||
<div className="bg-background dark:bg-outer-space fixed inset-0 z-50 hidden h-screen w-full flex-col md:flex">
|
||||
<div className="border-border bg-card dark:bg-background flex items-center justify-between border-b px-6 py-4">
|
||||
<div className="flex items-center gap-4">
|
||||
<button
|
||||
onClick={navigateBackToAgents}
|
||||
className="rounded-full border border-border p-3 text-sm text-muted-foreground hover:bg-accent"
|
||||
className="border-border text-muted-foreground hover:bg-accent rounded-full border p-3 text-sm"
|
||||
>
|
||||
<img src={ArrowLeft} alt="left-arrow" className="h-3 w-3" />
|
||||
</button>
|
||||
@@ -1368,7 +1368,7 @@ function WorkflowBuilderInner() {
|
||||
{showWorkflowSettings && (
|
||||
<div
|
||||
ref={workflowSettingsRef}
|
||||
className="absolute top-full left-0 z-50 mt-2 w-80 rounded-xl border border-border bg-card p-4 shadow-lg"
|
||||
className="border-border bg-card absolute top-full left-0 z-50 mt-2 w-80 rounded-xl border p-4 shadow-lg"
|
||||
>
|
||||
<div className="mb-3">
|
||||
<label className="mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300">
|
||||
@@ -1378,7 +1378,7 @@ function WorkflowBuilderInner() {
|
||||
type="text"
|
||||
value={workflowName}
|
||||
onChange={(e) => setWorkflowName(e.target.value)}
|
||||
className="focus:ring-ring w-full rounded-lg border border-border bg-card px-3 py-2 text-sm outline-none focus:ring-2 dark:text-white"
|
||||
className="focus:ring-ring border-border bg-card w-full rounded-lg border px-3 py-2 text-sm outline-none focus:ring-2 dark:text-white"
|
||||
placeholder="Enter workflow name"
|
||||
/>
|
||||
</div>
|
||||
@@ -1389,7 +1389,7 @@ function WorkflowBuilderInner() {
|
||||
<textarea
|
||||
value={workflowDescription}
|
||||
onChange={(e) => setWorkflowDescription(e.target.value)}
|
||||
className="focus:ring-ring w-full rounded-lg border border-border bg-card px-3 py-2 text-sm outline-none focus:ring-2 dark:text-white"
|
||||
className="focus:ring-ring border-border bg-card w-full rounded-lg border px-3 py-2 text-sm outline-none focus:ring-2 dark:text-white"
|
||||
rows={3}
|
||||
placeholder="Describe what this workflow does"
|
||||
/>
|
||||
@@ -1426,7 +1426,7 @@ function WorkflowBuilderInner() {
|
||||
colorClass: 'text-gray-500',
|
||||
},
|
||||
]}
|
||||
className="rounded-lg border-2 border-dashed border-border p-3 text-center transition-colors"
|
||||
className="border-border rounded-lg border-2 border-dashed p-3 text-center transition-colors"
|
||||
/>
|
||||
<p className="mt-1 text-[11px] text-gray-500 dark:text-gray-400">
|
||||
Image updates are included the next time you save.
|
||||
@@ -1446,7 +1446,7 @@ function WorkflowBuilderInner() {
|
||||
<div className="flex items-center gap-2">
|
||||
<button
|
||||
onClick={() => setShowWorkflowSettings((prev) => !prev)}
|
||||
className="flex items-center gap-2 rounded-full border border-border bg-card px-4 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-accent dark:text-gray-200"
|
||||
className="border-border bg-card hover:bg-accent flex items-center gap-2 rounded-full border px-4 py-2 text-sm font-medium text-gray-700 transition-colors dark:text-gray-200"
|
||||
>
|
||||
<Settings2 size={16} />
|
||||
Details
|
||||
@@ -1454,7 +1454,7 @@ function WorkflowBuilderInner() {
|
||||
{canManageAgent && (
|
||||
<button
|
||||
onClick={() => navigate(`/agents/logs/${effectiveAgentId}`)}
|
||||
className="flex items-center gap-2 rounded-full border border-border bg-card px-4 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-accent dark:text-gray-200"
|
||||
className="border-border bg-card hover:bg-accent flex items-center gap-2 rounded-full border px-4 py-2 text-sm font-medium text-gray-700 transition-colors dark:text-gray-200"
|
||||
>
|
||||
<ChartColumn size={16} />
|
||||
Logs
|
||||
@@ -1463,7 +1463,7 @@ function WorkflowBuilderInner() {
|
||||
{canManageAgent && (
|
||||
<button
|
||||
onClick={() => setAgentDetails('ACTIVE')}
|
||||
className="flex items-center gap-2 rounded-full border border-border bg-card px-4 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-accent dark:text-gray-200"
|
||||
className="border-border bg-card hover:bg-accent flex items-center gap-2 rounded-full border px-4 py-2 text-sm font-medium text-gray-700 transition-colors dark:text-gray-200"
|
||||
>
|
||||
<Link size={16} />
|
||||
Access Details
|
||||
@@ -1473,7 +1473,7 @@ function WorkflowBuilderInner() {
|
||||
<button
|
||||
onClick={() => setDeleteConfirmation('ACTIVE')}
|
||||
disabled={isDeletingAgent}
|
||||
className="flex items-center gap-2 rounded-full border border-red-200 bg-card px-4 py-2 text-sm font-medium text-red-600 transition-colors hover:bg-red-50 disabled:cursor-not-allowed disabled:opacity-50 dark:border-red-900/30 dark:text-red-400 dark:hover:bg-red-900/10"
|
||||
className="bg-card flex items-center gap-2 rounded-full border border-red-200 px-4 py-2 text-sm font-medium text-red-600 transition-colors hover:bg-red-50 disabled:cursor-not-allowed disabled:opacity-50 dark:border-red-900/30 dark:text-red-400 dark:hover:bg-red-900/10"
|
||||
>
|
||||
<Trash2 size={16} />
|
||||
{isDeletingAgent ? 'Deleting...' : 'Delete'}
|
||||
@@ -1489,7 +1489,7 @@ function WorkflowBuilderInner() {
|
||||
}
|
||||
setShowPreview(true);
|
||||
}}
|
||||
className="flex items-center gap-2 rounded-full border border-border bg-card px-4 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-accent dark:text-gray-200"
|
||||
className="border-border bg-card hover:bg-accent flex items-center gap-2 rounded-full border px-4 py-2 text-sm font-medium text-gray-700 transition-colors dark:text-gray-200"
|
||||
>
|
||||
<Play size={16} />
|
||||
Preview
|
||||
@@ -1499,7 +1499,7 @@ function WorkflowBuilderInner() {
|
||||
disabled={isPrimaryActionDisabled}
|
||||
className={`relative inline-flex items-center justify-center rounded-full px-6 py-2 text-sm font-medium shadow-sm transition-colors disabled:cursor-not-allowed ${
|
||||
canManageAgent && !hasSavableChanges
|
||||
? 'bg-gray-200 text-gray-500 dark:bg-accent dark:text-gray-400'
|
||||
? 'dark:bg-accent bg-gray-200 text-gray-500 dark:text-gray-400'
|
||||
: 'bg-primary hover:bg-primary/90 text-white disabled:opacity-50'
|
||||
}`}
|
||||
>
|
||||
@@ -1549,14 +1549,14 @@ function WorkflowBuilderInner() {
|
||||
)}
|
||||
|
||||
<div className="flex flex-1 overflow-hidden">
|
||||
<div className="border-border flex w-64 flex-col gap-6 border-r bg-muted p-4">
|
||||
<div className="border-border bg-muted dark:bg-background flex w-64 flex-col gap-6 border-r p-4">
|
||||
<div>
|
||||
<h3 className="mb-3 text-xs font-semibold tracking-wider text-gray-500 uppercase dark:text-gray-400">
|
||||
Core Nodes
|
||||
</h3>
|
||||
<div className="flex flex-col gap-2">
|
||||
<div
|
||||
className="group flex cursor-move items-center gap-3 rounded-full border border-border bg-card px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
className="group border-border bg-card flex cursor-move items-center gap-3 rounded-full border px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
draggable
|
||||
onDragStart={(e) => handleNodeDragStart(e, 'agent')}
|
||||
>
|
||||
@@ -1568,7 +1568,7 @@ function WorkflowBuilderInner() {
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className="group flex cursor-move items-center gap-3 rounded-full border border-border bg-card px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
className="group border-border bg-card flex cursor-move items-center gap-3 rounded-full border px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
draggable
|
||||
onDragStart={(e) => handleNodeDragStart(e, 'end')}
|
||||
>
|
||||
@@ -1580,7 +1580,7 @@ function WorkflowBuilderInner() {
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className="group flex cursor-move items-center gap-3 rounded-full border border-border bg-card px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
className="group border-border bg-card flex cursor-move items-center gap-3 rounded-full border px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
draggable
|
||||
onDragStart={(e) => handleNodeDragStart(e, 'note')}
|
||||
>
|
||||
@@ -1600,7 +1600,7 @@ function WorkflowBuilderInner() {
|
||||
</h3>
|
||||
<div className="flex flex-col gap-2">
|
||||
<div
|
||||
className="group flex cursor-move items-center gap-3 rounded-full border border-border bg-card px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
className="group border-border bg-card flex cursor-move items-center gap-3 rounded-full border px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
draggable
|
||||
onDragStart={(e) => handleNodeDragStart(e, 'state')}
|
||||
>
|
||||
@@ -1617,7 +1617,7 @@ function WorkflowBuilderInner() {
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="group flex cursor-move items-center gap-3 rounded-full border border-border bg-card px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
className="group border-border bg-card flex cursor-move items-center gap-3 rounded-full border px-4 py-3 shadow-sm transition-all hover:shadow-md"
|
||||
draggable
|
||||
onDragStart={(e) => handleNodeDragStart(e, 'condition')}
|
||||
>
|
||||
@@ -1639,7 +1639,7 @@ function WorkflowBuilderInner() {
|
||||
|
||||
<div
|
||||
ref={reactFlowWrapper}
|
||||
className="relative flex-1 bg-muted"
|
||||
className="bg-muted dark:bg-background/10 relative flex-1"
|
||||
>
|
||||
<ReactFlow
|
||||
nodes={nodes}
|
||||
@@ -1665,7 +1665,7 @@ function WorkflowBuilderInner() {
|
||||
className="absolute inset-0 z-10"
|
||||
onClick={handlePanelBackdropClick}
|
||||
/>
|
||||
<div className="border-border absolute top-4 right-4 z-20 w-96 rounded-2xl border bg-card shadow-[0px_4px_40px_-3px_#0000001A]">
|
||||
<div className="border-border bg-card absolute top-4 right-4 z-20 w-96 rounded-2xl border shadow-[0px_4px_40px_-3px_#0000001A]">
|
||||
<div className="border-border flex items-center justify-between border-b p-4">
|
||||
<h3 className="font-semibold text-gray-900 dark:text-white">
|
||||
{selectedNode.type === 'start' && 'Start Node'}
|
||||
@@ -1685,7 +1685,7 @@ function WorkflowBuilderInner() {
|
||||
|
||||
<div className="max-h-[calc(100vh-200px)] overflow-y-auto p-4">
|
||||
<div className="mb-4 flex flex-col gap-2">
|
||||
<div className="rounded-lg bg-muted p-3">
|
||||
<div className="bg-muted rounded-lg p-3">
|
||||
<div className="mb-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Node ID
|
||||
</div>
|
||||
@@ -1714,7 +1714,7 @@ function WorkflowBuilderInner() {
|
||||
label: e.target.value,
|
||||
})
|
||||
}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
placeholder="Enter node title"
|
||||
/>
|
||||
</div>
|
||||
@@ -1808,7 +1808,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
})
|
||||
}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
rows={3}
|
||||
placeholder="System prompt for the agent"
|
||||
/>
|
||||
@@ -1851,7 +1851,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
placeholder="Variable name for output"
|
||||
/>
|
||||
</div>
|
||||
@@ -1922,7 +1922,7 @@ function WorkflowBuilderInner() {
|
||||
e.target.value,
|
||||
)
|
||||
}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 font-mono text-xs transition-all outline-none focus:ring-2 dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card w-full rounded-xl border px-3 py-2 font-mono text-xs transition-all outline-none focus:ring-2 dark:text-white"
|
||||
rows={8}
|
||||
placeholder={`{
|
||||
"type": "object",
|
||||
@@ -1962,7 +1962,7 @@ function WorkflowBuilderInner() {
|
||||
content: e.target.value,
|
||||
})
|
||||
}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
rows={4}
|
||||
placeholder="Enter note content"
|
||||
/>
|
||||
@@ -1987,7 +1987,7 @@ function WorkflowBuilderInner() {
|
||||
) => (
|
||||
<div
|
||||
key={idx}
|
||||
className="rounded-xl border border-border p-3"
|
||||
className="border-border rounded-xl border p-3"
|
||||
>
|
||||
<div className="mb-2 flex items-center justify-between">
|
||||
<span className="text-sm font-medium text-gray-700 dark:text-gray-300">
|
||||
@@ -2037,7 +2037,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="border-border focus:ring-ring mb-1 w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:bg-accent dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card dark:bg-accent mb-1 w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
rows={2}
|
||||
placeholder="input.foo + 1"
|
||||
/>
|
||||
@@ -2077,7 +2077,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:bg-accent dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card dark:bg-accent w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
placeholder="variable_name"
|
||||
/>
|
||||
</div>
|
||||
@@ -2098,7 +2098,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="flex items-center gap-1 rounded-lg px-3 py-1.5 text-sm font-medium text-gray-600 transition-colors hover:bg-accent dark:text-gray-400"
|
||||
className="hover:bg-accent flex items-center gap-1 rounded-lg px-3 py-1.5 text-sm font-medium text-gray-600 transition-colors dark:text-gray-400"
|
||||
>
|
||||
<Plus size={14} />
|
||||
Add
|
||||
@@ -2111,7 +2111,7 @@ function WorkflowBuilderInner() {
|
||||
<p className="text-xs text-gray-500 dark:text-gray-400">
|
||||
Create conditions to branch your workflow
|
||||
</p>
|
||||
<div className="flex overflow-hidden rounded-lg border border-border">
|
||||
<div className="border-border flex overflow-hidden rounded-lg border">
|
||||
<button
|
||||
onClick={() =>
|
||||
handleUpdateNodeData({
|
||||
@@ -2125,7 +2125,7 @@ function WorkflowBuilderInner() {
|
||||
(selectedNode.data.config?.mode ||
|
||||
'simple') === 'simple'
|
||||
? 'bg-primary text-white'
|
||||
: 'text-gray-600 hover:bg-accent dark:text-gray-400'
|
||||
: 'hover:bg-accent text-gray-600 dark:text-gray-400'
|
||||
}`}
|
||||
>
|
||||
Simple
|
||||
@@ -2143,7 +2143,7 @@ function WorkflowBuilderInner() {
|
||||
selectedNode.data.config?.mode ===
|
||||
'advanced'
|
||||
? 'bg-primary text-white'
|
||||
: 'text-gray-600 hover:bg-accent dark:text-gray-400'
|
||||
: 'hover:bg-accent text-gray-600 dark:text-gray-400'
|
||||
}`}
|
||||
>
|
||||
Advanced
|
||||
@@ -2154,7 +2154,7 @@ function WorkflowBuilderInner() {
|
||||
(c: ConditionCase, idx: number) => (
|
||||
<div
|
||||
key={c.sourceHandle}
|
||||
className="rounded-xl border border-border p-3"
|
||||
className="border-border rounded-xl border p-3"
|
||||
>
|
||||
<div className="mb-2 flex items-center justify-between">
|
||||
<span className="text-sm font-semibold text-orange-600 dark:text-orange-400">
|
||||
@@ -2219,7 +2219,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="border-border focus:ring-ring mb-2 w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:bg-accent dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card dark:bg-accent mb-2 w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
placeholder="Case name (optional)"
|
||||
/>
|
||||
{(selectedNode.data.config?.mode ||
|
||||
@@ -2255,7 +2255,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm outline-none focus:ring-2 dark:bg-accent dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card dark:bg-accent w-full rounded-xl border px-3 py-2 text-sm outline-none focus:ring-2 dark:text-white"
|
||||
placeholder="Variable"
|
||||
/>
|
||||
<Select
|
||||
@@ -2347,7 +2347,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm outline-none focus:ring-2 dark:bg-accent dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card dark:bg-accent w-full rounded-xl border px-3 py-2 text-sm outline-none focus:ring-2 dark:text-white"
|
||||
placeholder="Value"
|
||||
/>
|
||||
</div>
|
||||
@@ -2372,7 +2372,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="border-border focus:ring-ring w-full rounded-xl border bg-card px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:bg-accent dark:text-white"
|
||||
className="border-border focus:ring-ring bg-card dark:bg-accent w-full rounded-xl border px-3 py-2 text-sm transition-all outline-none focus:ring-2 dark:text-white"
|
||||
rows={2}
|
||||
placeholder="Enter condition, e.g. input == 5"
|
||||
/>
|
||||
@@ -2414,7 +2414,7 @@ function WorkflowBuilderInner() {
|
||||
},
|
||||
});
|
||||
}}
|
||||
className="flex items-center gap-1 rounded-lg px-3 py-1.5 text-sm font-medium text-gray-600 transition-colors hover:bg-accent dark:text-gray-400"
|
||||
className="hover:bg-accent flex items-center gap-1 rounded-lg px-3 py-1.5 text-sm font-medium text-gray-600 transition-colors dark:text-gray-400"
|
||||
>
|
||||
<Plus size={14} />
|
||||
Add
|
||||
|
||||
@@ -157,7 +157,7 @@ function Dropdown<T extends DropdownOption>({
|
||||
return (
|
||||
<div
|
||||
key={i}
|
||||
className={`flex cursor-pointer items-center justify-between hover:bg-muted ${active ? 'bg-muted' : ''}`}
|
||||
className={`flex cursor-pointer items-center justify-between hover:bg-accent ${active ? 'bg-accent' : ''}`}
|
||||
>
|
||||
<span
|
||||
onClick={() => {
|
||||
|
||||
@@ -80,7 +80,7 @@ export default function DropdownModel() {
|
||||
return (
|
||||
<div ref={dropdownRef}>
|
||||
<div
|
||||
className={`border-border text-foreground mx-auto flex w-full cursor-pointer items-center justify-between border bg-transparent px-3 py-4 ${isOpen ? 'rounded-t-4xl' : 'rounded-4xl'}`}
|
||||
className={`text-foreground bg-muted dark:bg-card mx-auto flex w-full cursor-pointer items-center justify-between px-3 py-4 ${isOpen ? 'rounded-t-4xl' : 'rounded-4xl'}`}
|
||||
onClick={() => setIsOpen(!isOpen)}
|
||||
>
|
||||
{selectedModel?.display_name ? (
|
||||
@@ -101,7 +101,7 @@ export default function DropdownModel() {
|
||||
/>
|
||||
</div>
|
||||
{isOpen && (
|
||||
<div className="no-scrollbar border-border bg-card absolute right-0 left-0 z-20 -mt-1 max-h-52 w-full overflow-y-auto rounded-b-3xl border border-t-0 shadow-md">
|
||||
<div className="no-scrollbar bg-muted dark:bg-card absolute right-0 left-0 z-20 -mt-1 max-h-52 w-full overflow-y-auto rounded-b-3xl shadow-md">
|
||||
{availableModels && (availableModels?.length ?? 0) > 0 ? (
|
||||
availableModels.map((model: Model) => (
|
||||
<div
|
||||
@@ -110,7 +110,7 @@ export default function DropdownModel() {
|
||||
dispatch(setSelectedModel(model));
|
||||
setIsOpen(false);
|
||||
}}
|
||||
className={`border-border/50 hover:bg-muted flex h-10 w-full cursor-pointer items-center justify-between border-t`}
|
||||
className={`border-border/30 hover:bg-accent flex h-10 w-full cursor-pointer items-center justify-between border-t`}
|
||||
>
|
||||
<div className="flex w-full items-center justify-between">
|
||||
<p className="flex-1 truncate py-3 pr-2 pl-5">
|
||||
@@ -127,7 +127,7 @@ export default function DropdownModel() {
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="border-border/50 flex h-10 w-full items-center border-t">
|
||||
<div className="border-border/30 flex h-10 w-full items-center border-t">
|
||||
<p className="pl-5 text-sm text-muted-foreground">No models available</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -1438,7 +1438,7 @@ export default function MessageInput({
|
||||
onChange={handleVoiceFileAttachment}
|
||||
/>
|
||||
|
||||
<div className="border-border bg-card relative flex w-full flex-col rounded-[23px] border">
|
||||
<div className="border-border bg-card dark:bg-transparent relative flex w-full flex-col rounded-[23px] border">
|
||||
<div className="flex flex-wrap gap-1.5 px-2 py-2 sm:gap-2 sm:px-3">
|
||||
{attachments.map((attachment) => {
|
||||
return (
|
||||
|
||||
@@ -138,7 +138,7 @@ export const SharedConversation = () => {
|
||||
twitterTitle={title}
|
||||
twitterDescription="Shared conversations with DocsGPT"
|
||||
/>
|
||||
<div className="bg-card flex h-full flex-col items-center justify-between gap-2 overflow-y-hidden">
|
||||
<div className="bg-background flex h-full flex-col items-center justify-between gap-2 overflow-y-hidden">
|
||||
<div className="dark:border-b-silver w-full max-w-[1200px] border-b p-2 md:w-9/12 lg:w-8/12 xl:w-8/12 2xl:w-6/12">
|
||||
<h1 className="font-semi-bold text-foreground dark:text-foreground text-4xl">
|
||||
{title}
|
||||
|
||||
@@ -868,7 +868,7 @@ Avoid over-scrolling in mobile browsers
|
||||
|
||||
:root {
|
||||
--radius: 0.625rem;
|
||||
--background: #fbfbfb;
|
||||
--background: #ffffff;
|
||||
--foreground: #171717;
|
||||
--card: #ffffff;
|
||||
--card-foreground: #171717;
|
||||
@@ -880,7 +880,7 @@ Avoid over-scrolling in mobile browsers
|
||||
--secondary-foreground: #7d54d1;
|
||||
--muted: #f6f6f6;
|
||||
--muted-foreground: #737373;
|
||||
--accent: #f0eef6;
|
||||
--accent: #ececec;
|
||||
--accent-foreground: #171717;
|
||||
--destructive: #ef4444;
|
||||
--border: #d9d9d9;
|
||||
@@ -891,11 +891,11 @@ Avoid over-scrolling in mobile browsers
|
||||
--chart-3: oklch(0.398 0.07 227.392);
|
||||
--chart-4: oklch(0.828 0.189 84.429);
|
||||
--chart-5: oklch(0.769 0.188 70.08);
|
||||
--sidebar: #ffffff;
|
||||
--sidebar: #fbfbfb;
|
||||
--sidebar-foreground: #171717;
|
||||
--sidebar-primary: #7d54d1;
|
||||
--sidebar-primary-foreground: #ffffff;
|
||||
--sidebar-accent: #f0eef6;
|
||||
--sidebar-accent: #ececec;
|
||||
--sidebar-accent-foreground: #171717;
|
||||
--sidebar-border: #d9d9d9;
|
||||
--sidebar-ring: #7d54d1;
|
||||
@@ -907,38 +907,38 @@ Avoid over-scrolling in mobile browsers
|
||||
*/
|
||||
|
||||
.dark {
|
||||
--background: #0e0e0e;
|
||||
--background: #222327;
|
||||
--foreground: #fafafa;
|
||||
--card: #222222;
|
||||
--card: #2b2c31;
|
||||
--card-foreground: #fafafa;
|
||||
--popover: #2c2c2c;
|
||||
--popover: #2b2c31;
|
||||
--popover-foreground: #fafafa;
|
||||
--primary: #976af3;
|
||||
--primary-foreground: #ffffff;
|
||||
--secondary: #2c2c2c;
|
||||
--secondary: #2b2c31;
|
||||
--secondary-foreground: #e0e0e0;
|
||||
--muted: #2c2c2c;
|
||||
--muted: #35363b;
|
||||
--muted-foreground: #a1a1a1;
|
||||
--accent: #383838;
|
||||
--accent: #3e3f45;
|
||||
--accent-foreground: #fafafa;
|
||||
--destructive: #dc2626;
|
||||
--border: #404040;
|
||||
--input: #404040;
|
||||
--border: #44454c;
|
||||
--input: #44454c;
|
||||
--ring: #976af3;
|
||||
--chart-1: oklch(0.488 0.243 264.376);
|
||||
--chart-2: oklch(0.696 0.17 162.48);
|
||||
--chart-3: oklch(0.769 0.188 70.08);
|
||||
--chart-4: oklch(0.627 0.265 303.9);
|
||||
--chart-5: oklch(0.645 0.246 16.439);
|
||||
--sidebar: #0d0d0d;
|
||||
--sidebar: #161616;
|
||||
--sidebar-foreground: #fafafa;
|
||||
--sidebar-primary: #976af3;
|
||||
--sidebar-primary-foreground: #ffffff;
|
||||
--sidebar-accent: #2c2c2c;
|
||||
--sidebar-accent: #222327;
|
||||
--sidebar-accent-foreground: #fafafa;
|
||||
--sidebar-border: #404040;
|
||||
--sidebar-border: #2b2c31;
|
||||
--sidebar-ring: #976af3;
|
||||
--answer-bubble: #32333b;
|
||||
--answer-bubble: #2e303e;
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
Reference in New Issue
Block a user