diff --git a/apps/sim/app/_styles/globals.css b/apps/sim/app/_styles/globals.css
index 013e6b1d45..1d5339f64d 100644
--- a/apps/sim/app/_styles/globals.css
+++ b/apps/sim/app/_styles/globals.css
@@ -47,32 +47,32 @@
@layer base {
:root,
.light {
- --bg: #f9faf8; /* main canvas - near white */
- --surface-1: #f9faf8; /* sidebar, panels - light warm gray */
- --surface-2: #fdfdfb; /* blocks, cards, modals - soft warm white */
- --surface-3: #f4f5f1; /* popovers, headers - more contrast */
- --surface-4: #f2f3ef; /* buttons base */
- --border: #d7dcda; /* primary border */
- --surface-5: #f0f1ed; /* inputs, form elements - subtle */
- --border-1: #d7dcda; /* stronger border - sage gray */
- --surface-6: #eceee9; /* popovers, elevated surfaces */
- --surface-7: #e8e9e4;
-
- --workflow-edge: #d7dcda; /* workflow handles/edges - matches border-1 */
-
- /* Text - warm neutrals */
+ --bg: #fdfdfd; /* main canvas - neutral near-white */
+ --surface-1: #fcfcfc; /* sidebar, panels */
+ --surface-2: #ffffff; /* blocks, cards, modals - pure white */
+ --surface-3: #f7f7f7; /* popovers, headers */
+ --surface-4: #f5f5f5; /* buttons base */
+ --border: #e0e0e0; /* primary border */
+ --surface-5: #f3f3f3; /* inputs, form elements */
+ --border-1: #e0e0e0; /* stronger border */
+ --surface-6: #f0f0f0; /* popovers, elevated surfaces */
+ --surface-7: #ececec;
+
+ --workflow-edge: #e0e0e0; /* workflow handles/edges - matches border-1 */
+
+ /* Text - neutral */
--text-primary: #2d2d2d;
--text-secondary: #404040;
--text-tertiary: #5c5c5c;
--text-muted: #737373;
--text-subtle: #8c8c8c;
- --text-inverse: #f0fff6;
+ --text-inverse: #ffffff;
--text-error: #ef4444;
/* Borders / dividers */
- --divider: #e8e9e4;
- --border-muted: #dfe0db;
- --border-success: #d7dcda;
+ --divider: #ededed;
+ --border-muted: #e4e4e4;
+ --border-success: #e0e0e0;
/* Brand & state */
--brand-400: #8e4cfb;
@@ -152,13 +152,13 @@
--c-883827: #7c2d12;
/* Terminal status badges */
- --terminal-status-error-bg: #feeeee;
+ --terminal-status-error-bg: #fef2f2;
--terminal-status-error-border: #f87171;
- --terminal-status-info-bg: #f5f5f4;
- --terminal-status-info-border: #a8a29e;
- --terminal-status-info-color: #57534e;
- --terminal-status-warning-bg: #fef9e7;
- --terminal-status-warning-border: #f5c842;
+ --terminal-status-info-bg: #f7f7f7;
+ --terminal-status-info-border: #a3a3a3;
+ --terminal-status-info-color: #525252;
+ --terminal-status-warning-bg: #fefce8;
+ --terminal-status-warning-border: #facc15;
--terminal-status-warning-color: #a16207;
}
.dark {
diff --git a/apps/sim/app/templates/[id]/template.tsx b/apps/sim/app/templates/[id]/template.tsx
index 9619bcb553..55752a5531 100644
--- a/apps/sim/app/templates/[id]/template.tsx
+++ b/apps/sim/app/templates/[id]/template.tsx
@@ -68,7 +68,7 @@ function TemplateDetailsLoading({ isWorkspaceContext, workspaceId }: TemplateDet
{/* Breadcrumb navigation */}
@@ -638,7 +638,7 @@ export default function TemplateDetails({ isWorkspaceContext = false }: Template
{/* Breadcrumb navigation */}
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/document.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/document.tsx
index 7b2d278cd4..69d726c025 100644
--- a/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/document.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/document.tsx
@@ -212,7 +212,7 @@ function DocumentLoading({
return (
-
+
@@ -234,7 +234,7 @@ function DocumentLoading({
-
+
-
+
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx
index 8274a9dd3a..0d1cf5d1e2 100644
--- a/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx
@@ -171,7 +171,7 @@ function KnowledgeBaseLoading({ knowledgeBaseName }: KnowledgeBaseLoadingProps)
return (
-
+
@@ -193,7 +193,7 @@ function KnowledgeBaseLoading({ knowledgeBaseName }: KnowledgeBaseLoadingProps)
-
+
-
+
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/components/base-card/base-card.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/components/base-card/base-card.tsx
index c643347a55..64782d86b0 100644
--- a/apps/sim/app/workspace/[workspaceId]/knowledge/components/base-card/base-card.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/components/base-card/base-card.tsx
@@ -67,26 +67,26 @@ function formatAbsoluteDate(dateString: string): string {
*/
export function BaseCardSkeleton() {
return (
-
+
@@ -122,7 +122,7 @@ export function BaseCard({ id, title, docCount, description, updatedAt }: BaseCa
return (
-
+
{title}
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/knowledge.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/knowledge.tsx
index 132757e8fc..9e68bf536b 100644
--- a/apps/sim/app/workspace/[workspaceId]/knowledge/knowledge.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/knowledge.tsx
@@ -131,7 +131,7 @@ export function Knowledge() {
<>
-
+
diff --git a/apps/sim/app/workspace/[workspaceId]/knowledge/layout.tsx b/apps/sim/app/workspace/[workspaceId]/knowledge/layout.tsx
index d1d899e550..4283b6f852 100644
--- a/apps/sim/app/workspace/[workspaceId]/knowledge/layout.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/knowledge/layout.tsx
@@ -2,5 +2,9 @@
* Knowledge Base layout - applies sidebar padding for all knowledge routes.
*/
export default function KnowledgeLayout({ children }: { children: React.ReactNode }) {
- return
{children}
+ return (
+
+ {children}
+
+ )
}
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/components/workflows-list/workflows-list.tsx b/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/components/workflows-list/workflows-list.tsx
index 8a9c2ba7e1..a78caa79fd 100644
--- a/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/components/workflows-list/workflows-list.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/components/workflows-list/workflows-list.tsx
@@ -35,9 +35,9 @@ export function WorkflowsList({
const { workflows } = useWorkflowRegistry()
return (
-
+
{/* Table header */}
-
+
Workflow
@@ -66,8 +66,8 @@ export function WorkflowsList({
onToggleWorkflow(workflow.workflowId)}
>
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx b/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx
index 5aaafb4652..e573b813c4 100644
--- a/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/logs/components/dashboard/dashboard.tsx
@@ -36,14 +36,14 @@ const SKELETON_BAR_HEIGHTS = [
function GraphCardSkeleton({ title }: { title: string }) {
return (
-
-
+
+
{title}
-
+
{SKELETON_BAR_HEIGHTS.map((height, i) => (
@@ -81,8 +81,8 @@ function WorkflowRowSkeleton() {
function WorkflowsListSkeleton({ rowCount = 5 }: { rowCount?: number }) {
return (
-
-
+
+
Workflow
@@ -570,8 +570,8 @@ export default function Dashboard({ logs, isLoading, error }: DashboardProps) {
-
-
+
+
Runs
@@ -581,7 +581,7 @@ export default function Dashboard({ logs, isLoading, error }: DashboardProps) {
)}
-
+
{globalDetails ? (
-
-
+
+
Errors
@@ -608,7 +608,7 @@ export default function Dashboard({ logs, isLoading, error }: DashboardProps) {
)}
-
+
{globalDetails ? (
-
-
+
+
Latency
@@ -635,7 +635,7 @@ export default function Dashboard({ logs, isLoading, error }: DashboardProps) {
)}
-
+
{globalDetails ? (
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/search/search.tsx b/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/search/search.tsx
index 2569d6c5fb..f4964ad44d 100644
--- a/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/search/search.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/search/search.tsx
@@ -163,7 +163,7 @@ export function AutocompleteSearch({
}}
>
-
+
{/* Search Icon */}
@@ -179,7 +179,7 @@ export function AutocompleteSearch({
className={cn(
'h-6 shrink-0 cursor-pointer whitespace-nowrap rounded-md px-2 text-[11px]',
highlightedBadgeIndex === index &&
- 'ring-1 ring-[var(--border-focus)] ring-offset-1 ring-offset-[var(--surface-5)]'
+ 'ring-1 ring-[var(--border-focus)] ring-offset-1 ring-offset-[var(--surface-3)] dark:ring-offset-[var(--surface-5)]'
)}
onClick={() => removeBadge(index)}
onKeyDown={(e) => {
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/layout.tsx b/apps/sim/app/workspace/[workspaceId]/logs/layout.tsx
index 4247f01e9a..ec0a23ca33 100644
--- a/apps/sim/app/workspace/[workspaceId]/logs/layout.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/logs/layout.tsx
@@ -1,3 +1,7 @@
export default function LogsLayout({ children }: { children: React.ReactNode }) {
- return
{children}
+ return (
+
+ {children}
+
+ )
}
diff --git a/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx b/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx
index b43e0f89e1..69f95ac562 100644
--- a/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/logs/logs.tsx
@@ -344,7 +344,7 @@ export default function Logs() {
return (
-
+
{/* Table container */}
-
+
{/* Table header */}
-
+
Date
diff --git a/apps/sim/app/workspace/[workspaceId]/templates/components/template-card.tsx b/apps/sim/app/workspace/[workspaceId]/templates/components/template-card.tsx
index 3f080de2d8..1b75649229 100644
--- a/apps/sim/app/workspace/[workspaceId]/templates/components/template-card.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/templates/components/template-card.tsx
@@ -29,19 +29,19 @@ export function TemplateCardSkeleton({ className }: { className?: string }) {
return (
-
+
-
+
{Array.from({ length: 3 }).map((_, index) => (
))}
@@ -49,14 +49,14 @@ export function TemplateCardSkeleton({ className }: { className?: string }) {
@@ -202,7 +202,7 @@ function TemplateCardInner({
@@ -223,7 +223,7 @@ function TemplateCardInner({
cursorStyle='pointer'
/>
) : (
-
+
)}
diff --git a/apps/sim/app/workspace/[workspaceId]/templates/layout.tsx b/apps/sim/app/workspace/[workspaceId]/templates/layout.tsx
index fb101fcaa1..bc62e41049 100644
--- a/apps/sim/app/workspace/[workspaceId]/templates/layout.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/templates/layout.tsx
@@ -2,5 +2,9 @@
* Templates layout - applies sidebar padding for all template routes.
*/
export default function TemplatesLayout({ children }: { children: React.ReactNode }) {
- return
{children}
+ return (
+
+ {children}
+
+ )
}
diff --git a/apps/sim/app/workspace/[workspaceId]/templates/templates.tsx b/apps/sim/app/workspace/[workspaceId]/templates/templates.tsx
index c92fa5bfc2..43a4bac2fd 100644
--- a/apps/sim/app/workspace/[workspaceId]/templates/templates.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/templates/templates.tsx
@@ -172,7 +172,7 @@ export default function Templates({
return (
-
+
diff --git a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/subflows/subflow-node.tsx b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/subflows/subflow-node.tsx
index 4d2be4ed3a..98375ee569 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/subflows/subflow-node.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/subflows/subflow-node.tsx
@@ -108,12 +108,12 @@ export const SubflowNodeComponent = memo(({ data, id }: NodeProps
{
const baseClasses = '!z-[10] !cursor-crosshair !border-none !transition-[colors] !duration-150'
- const colorClasses = '!bg-[var(--surface-7)]'
+ const colorClasses = '!bg-[var(--workflow-edge)]'
const positionClasses = {
- left: '!left-[-7px] !h-5 !w-[7px] !rounded-l-[2px] !rounded-r-none hover:!left-[-10px] hover:!w-[10px] hover:!rounded-l-full',
+ left: '!left-[-8px] !h-5 !w-[7px] !rounded-l-[2px] !rounded-r-none hover:!left-[-11px] hover:!w-[10px] hover:!rounded-l-full',
right:
- '!right-[-7px] !h-5 !w-[7px] !rounded-r-[2px] !rounded-l-none hover:!right-[-10px] hover:!w-[10px] hover:!rounded-r-full',
+ '!right-[-8px] !h-5 !w-[7px] !rounded-r-[2px] !rounded-l-none hover:!right-[-11px] hover:!w-[10px] hover:!rounded-r-full',
}
return cn(baseClasses, colorClasses, positionClasses[position])
@@ -205,13 +205,12 @@ export const SubflowNodeComponent = memo(({ data, id }: NodeProps
{/* Subflow Start */}
{/* Start handle inside - connects to first block in subflow */}
-
+
Start
@@ -85,9 +87,9 @@ function WorkflowPreviewSubflowInner({ data }: NodeProps