From a3078c7fc80a58967829b669dd2a200c58597b01 Mon Sep 17 00:00:00 2001 From: waleed Date: Mon, 6 Jul 2026 12:42:59 -0700 Subject: [PATCH 1/2] improvement(inbox): align Sim Mailer settings page with design-system tokens MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replace literal pixel text-size classes (text-[12px]/[13px]/[14px]/[16px]) with the named Tailwind scale tokens across inbox.tsx, inbox-enable-toggle, inbox-settings-tab, and inbox-task-list — pixel-identical, no visual change. Swap the hand-rolled toggle-row span pair for the emcn Label component, matching the toggle-row convention used elsewhere in settings. --- .../inbox-enable-toggle/inbox-enable-toggle.tsx | 8 +++++--- .../inbox-settings-tab/inbox-settings-tab.tsx | 14 +++++++------- .../components/inbox-task-list/inbox-task-list.tsx | 14 +++++++------- .../settings/components/inbox/inbox.tsx | 6 +++--- 4 files changed, 22 insertions(+), 20 deletions(-) diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-enable-toggle/inbox-enable-toggle.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-enable-toggle/inbox-enable-toggle.tsx index b8eb1683031..0159c6ac807 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-enable-toggle/inbox-enable-toggle.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-enable-toggle/inbox-enable-toggle.tsx @@ -8,6 +8,7 @@ import { ChipModalField, ChipModalFooter, ChipModalHeader, + Label, Switch, } from '@sim/emcn' import { createLogger } from '@sim/logger' @@ -62,12 +63,13 @@ export function InboxEnableToggle() { <>
- Enable email inbox - + +

Allow this workspace to receive tasks via email - +

-

+

Send emails here to create tasks.

@@ -158,7 +158,7 @@ export function InboxSettingsTab() {
-

+

Only emails from these addresses can create tasks.

@@ -171,7 +171,7 @@ export function InboxSettingsTab() { className='flex items-center justify-between border-[var(--border)] border-b px-3 py-2.5 last:border-b-0' >
- {member.email} + {member.email} member @@ -185,9 +185,9 @@ export function InboxSettingsTab() { className='flex items-center justify-between border-[var(--border)] border-b px-3 py-2.5 last:border-b-0' >
- {sender.email} + {sender.email} {sender.label && ( - + ({sender.label}) )} @@ -203,7 +203,7 @@ export function InboxSettingsTab() { {sendersData?.workspaceMembers.length === 0 && sendersData?.senders.length === 0 && ( -
+
No allowed senders configured.
)} @@ -212,7 +212,7 @@ export function InboxSettingsTab() {
{removeSenderError && ( -

+

{removeSenderError}

)} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-task-list/inbox-task-list.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-task-list/inbox-task-list.tsx index 6b4e88013c2..0200cdf45ab 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-task-list/inbox-task-list.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/components/inbox-task-list/inbox-task-list.tsx @@ -142,28 +142,28 @@ export function InboxTaskList() { <>
- + {task.subject} {task.hasAttachments && ( )}
- + {task.fromName || task.fromEmail} {task.status === 'rejected' && task.rejectionReason && ( - + {formatRejectionReason(task.rejectionReason)} )} {task.status === 'failed' && task.errorMessage && ( - + {task.errorMessage} )} {task.status === 'completed' && task.resultSummary && ( - + {task.resultSummary} )} @@ -171,13 +171,13 @@ export function InboxTaskList() { task.status !== 'failed' && task.status !== 'rejected' && task.bodyPreview && ( - + {task.bodyPreview} )}
- + {formatRelativeTime(task.createdAt)} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/inbox.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/inbox.tsx index a88bff9c5ca..270eb72a563 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/inbox.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/inbox/inbox.tsx @@ -39,10 +39,10 @@ export function Inbox() {
-

+

Sim Mailer requires an active Max plan

-

+

Upgrade to Max and ensure billing is active to receive tasks via email and let Sim work on your behalf.

@@ -70,7 +70,7 @@ export function Inbox() { -

+

Email tasks received by this workspace.

From 0d398e12f1b71f34daad04e5d64c5adeba41dad9 Mon Sep 17 00:00:00 2001 From: waleed Date: Mon, 6 Jul 2026 12:53:50 -0700 Subject: [PATCH 2/2] improvement(settings): extend design-system token migration across all settings pages MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replace literal pixel text-size classes with named Tailwind scale tokens (text-caption/small/sm/base/md/lg) across every other settings page and shared component (member-list, api-keys, mcp, billing, credential-sets, workflow-mcp-servers, mothership, admin, byok, copilot, custom-tools, settings-resource-row, and the ee/ access-control, data-retention, whitelabeling, and shared setting-row components) — pixel-identical, no visual change. Document the row title/subtitle token pairing and toggle-row Label convention in sim-settings-pages.md and the add-settings-page skill's audit checklist so future pages default to it. --- .claude/rules/sim-settings-pages.md | 50 +++++++++++++++++++ .claude/skills/add-settings-page/SKILL.md | 17 +++++-- .../credit-usage/credit-usage-view.tsx | 6 +-- .../settings/components/admin/admin.tsx | 6 +-- .../settings/components/api-keys/api-keys.tsx | 16 +++--- .../settings/components/billing/billing.tsx | 8 +-- .../credit-usage-section.tsx | 4 +- .../components/byok/byok-key-manager.tsx | 2 +- .../byok/byok-provider-keys-modal.tsx | 6 +-- .../settings/components/copilot/copilot.tsx | 4 +- .../credential-sets/credential-sets.tsx | 4 +- .../components/custom-tools/custom-tools.tsx | 4 +- .../settings/components/mcp/mcp.tsx | 24 ++++----- .../components/member-list/member-list.tsx | 4 +- .../components/mothership/mothership.tsx | 8 +-- .../settings-resource-row.tsx | 4 +- .../workflow-mcp-servers.tsx | 10 ++-- .../components/access-control.tsx | 6 +-- .../components/group-detail.tsx | 6 +-- apps/sim/ee/components/setting-row.tsx | 4 +- .../components/data-retention-settings.tsx | 10 ++-- .../components/whitelabeling-settings.tsx | 12 ++--- 22 files changed, 131 insertions(+), 84 deletions(-) diff --git a/.claude/rules/sim-settings-pages.md b/.claude/rules/sim-settings-pages.md index f2e7a5f63b5..38e9a364554 100644 --- a/.claude/rules/sim-settings-pages.md +++ b/.claude/rules/sim-settings-pages.md @@ -96,6 +96,55 @@ Adding a new settings page: `settings/[section]/settings.tsx`. 3. Build the component body inside `` — no shell, no title block. +## Text-scale tokens (no literal pixel sizes) + +Settings pages never use a literal `text-[Npx]` class — always the named Tailwind +scale token from `apps/sim/tailwind.config.ts`'s `fontSize` extension (`text-micro` +10px, `text-xs` 11px, `text-caption` 12px, `text-small` 13px, `text-sm` 14px +[Tailwind default, unmodified], `text-base` 15px, `text-md` 16px, `text-lg` 18px +[Tailwind default]). A literal size is either a straight rename to the equivalent +token (if the pixel value matches one exactly) or a sign the page never migrated — +grep `text-\[1[0-8]px\]` under `apps/sim/app/workspace/*/settings/**` and +`apps/sim/ee/**` to find stragglers. + +For a two-line list row (title/value on top, a muted subtitle below — a name + +email, a tool name + description, a server name + status), the established +pairing is: + +- **Title / row value**: `text-[var(--text-body)] text-sm` +- **Subtitle / muted description**: `text-[var(--text-muted)] text-caption` + +This is not a stylistic guess — it is the tokenized form of the literal-pixel +pairing (`text-[14px] text-[var(--text-body)]` / `text-[12px] +text-[var(--text-muted)]`) already used for this exact row shape across +`member-list.tsx`, `api-keys.tsx`, `mcp.tsx`, `billing.tsx`, `credential-sets.tsx`, +`workflow-mcp-servers.tsx`, and others — keep new rows consistent with it rather +than inventing a new size pairing. + +For a toggle row (a `Switch` with a title and optional description), use the emcn +`Label` component for the title — never a hand-rolled `` — paired with +`Switch`'s `id`/`Label`'s `htmlFor`: + +```tsx +
+
+ +

One-line description.

+
+ +
+``` + +`Label`'s own default styling (`font-medium text-[var(--text-primary)] +text-small`) already matches the established title treatment — do not add a +`className` overriding its size/color unless the row genuinely needs something +different. + +`--text-primary`/`--text-secondary` and `--text-body`/`--text-muted` are both real, +independently-defined tokens (not interchangeable — they resolve to different +colors) and both see legitimate use across settings pages; this rule only pins +down the **row title/subtitle** shape above, not every text element on every page. + ## Other shared settings primitives (do not re-roll these) - **`SettingsEmptyState`** (`…/components/settings-empty-state`) — the canonical @@ -175,4 +224,5 @@ A settings page is design-system-clean when: - [ ] Detail sub-views and entitlement/loading gates keep their own chrome (intentional). - [ ] If it has editable state: Save/Discard go through `SaveDiscardActions`, dirty is wired via `useSettingsUnsavedGuard` (called before any early-return gate), and there is **no** hand-rolled Save button / `beforeunload` / "Unsaved changes" modal. - [ ] No business logic, handlers, or conditional rendering changed by the migration. +- [ ] No literal `text-[Npx]` classes — named scale tokens only (see "Text-scale tokens" above). - [ ] `tsc`, `biome`, and the page's tests pass. diff --git a/.claude/skills/add-settings-page/SKILL.md b/.claude/skills/add-settings-page/SKILL.md index 2da63f9a08e..69173332ad4 100644 --- a/.claude/skills/add-settings-page/SKILL.md +++ b/.claude/skills/add-settings-page/SKILL.md @@ -50,21 +50,30 @@ For each page component, confirm the checklist in `.claude/rules/sim-settings-pa **gate** early-return. Anything else is a page that still needs migrating. 2. Find hand-rolled title blocks (should be 0 outside detail views): `git grep -n "text-\[var(--text-body)\] text-lg" -- 'apps/sim/**/settings/' 'apps/sim/ee/'` -3. Confirm each page imports `SettingsPanel` and that its `NavigationItem` has an +3. Find literal pixel text sizes (should be 0 — see "Text-scale tokens" in + `.claude/rules/sim-settings-pages.md` for the token map and the row + title/subtitle pairing convention): + `git grep -n "text-\[1[0-8]px\]" -- 'apps/sim/**/settings/' 'apps/sim/ee/'` +4. Confirm each page imports `SettingsPanel` and that its `NavigationItem` has an accurate `description` of consistent length with its peers. - Editable pages: confirm Save/Discard go through `SaveDiscardActions` and dirty is wired via `useSettingsUnsavedGuard` (called before early-return gates) — flag any hand-rolled Save button, `beforeunload`, or unsaved modal. `git grep -n "beforeunload" -- 'apps/sim/**/settings/' 'apps/sim/ee/'` should only hit the centralized `use-settings-before-unload.ts`. -4. When migrating a page, change ONLY the structural shell→`SettingsPanel` swap: +5. When migrating a page, change ONLY the structural shell→`SettingsPanel` swap: move header chips to `actions`, the standalone search to `search`, delete the `

` title block, replace the three closing `

` (column/scroll/shell) with ``, and keep modal siblings in a `<>` fragment. Do NOT touch handlers, state, queries, conditional rendering, or detail/gate returns. Drop per-page `gap-*`/`pt-*` on the content column in favor of the panel default. -5. Remove now-unused imports (`ChipInput`/`Search`) ONLY after grepping that +6. When fixing literal pixel text sizes, replace ONLY the size class with its + exact-pixel-equivalent named token (e.g. `text-[12px]` → `text-caption`, + never a different size) — this must render pixel-identical, not restyle the + page. Leave color tokens (`--text-primary` vs `--text-body`, etc.) untouched + unless they're also being changed for an unrelated, deliberate reason. +7. Remove now-unused imports (`ChipInput`/`Search`) ONLY after grepping that they are not still used elsewhere in the file (e.g. by a detail view). -6. **Verify the whole sweep:** `tsc --noEmit`, `biome check` on every touched +8. **Verify the whole sweep:** `tsc --noEmit`, `biome check` on every touched file, and run the affected pages' tests. Diff each file against the base and confirm the change is purely structural before shipping. diff --git a/apps/sim/app/workspace/[workspaceId]/settings/billing/credit-usage/credit-usage-view.tsx b/apps/sim/app/workspace/[workspaceId]/settings/billing/credit-usage/credit-usage-view.tsx index 5e29dfc68f1..e44851bf789 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/billing/credit-usage/credit-usage-view.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/billing/credit-usage/credit-usage-view.tsx @@ -50,13 +50,13 @@ interface UsageLogRowProps { function UsageLogRow({ log }: UsageLogRowProps) { return (
- + {formatDateTime(new Date(log.createdAt))} - + {rowLabel(log)} - + {formatApportionedCreditCost(log.creditCost, log.dollarCost)}
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx index f2fdfd98a44..95e1faadb0b 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/admin/admin.tsx @@ -251,7 +251,7 @@ export function Admin() { unbanUser.error || impersonateUser.error || impersonationGuardError) && ( -

+

{impersonationGuardError || (setUserRole.error || banUser.error || unbanUser.error || impersonateUser.error) ?.message || @@ -304,7 +304,7 @@ export function Admin() { <>

- {planName} plan - {priceText} + {planName} plan + {priceText}
{!subscription.isEnterprise && @@ -594,13 +594,13 @@ export function Billing() { 'flex items-center gap-2.5 rounded-lg p-2 text-left transition-colors' const rowContent = ( <> - + {invoice.date} {invoice.badge.label} - + {invoice.amount} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/billing/components/credit-usage-section/credit-usage-section.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/billing/components/credit-usage-section/credit-usage-section.tsx index 2c8f4a993af..9631b1aeccc 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/billing/components/credit-usage-section/credit-usage-section.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/billing/components/credit-usage-section/credit-usage-section.tsx @@ -24,10 +24,10 @@ export function CreditUsageSection({ workspaceId }: CreditUsageSectionProps) {
- + {isPending || isError ? '—' : formatCreditsLabel(totalCredits ?? 0)} - Last 30 days + Last 30 days
View usage logs diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-key-manager.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-key-manager.tsx index 5ae372eddd8..e274f191076 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-key-manager.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-key-manager.tsx @@ -259,7 +259,7 @@ export function BYOKKeyManager(props: BYOKKeyManagerProps) { const keyCount = getProviderKeys(provider.id).length return (
- + {keyCount} {keyCount === 1 ? 'key' : 'keys'} setManagingProviderId(provider.id)}>Manage diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-provider-keys-modal.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-provider-keys-modal.tsx index f60805706c9..139500d319f 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-provider-keys-modal.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/byok/byok-provider-keys-modal.tsx @@ -50,10 +50,10 @@ export function BYOKProviderKeysModal({ {keys.map((key) => (
- + {key.name ?? 'Unnamed key'} - + {key.maskedKey}
@@ -65,7 +65,7 @@ export function BYOKProviderKeysModal({ ))}
{atCapacity && ( -

+

Key limit reached ({maxKeys} keys per provider).

)} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/copilot/copilot.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/copilot/copilot.tsx index 6d17bf41545..82a6be65d86 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/copilot/copilot.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/copilot/copilot.tsx @@ -136,14 +136,14 @@ export function Copilot() {
- + {key.name || 'Unnamed Key'} (last used: {formatLastUsed(key.lastUsed).toLowerCase()})
-

{key.displayKey}

+

{key.displayKey}

- + {name} {member.credentials.length === 0 && ( @@ -551,7 +551,7 @@ export function CredentialSets() {
- + {emailPrefix} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/custom-tools/custom-tools.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/custom-tools/custom-tools.tsx index a537708b167..2825860e593 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/custom-tools/custom-tools.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/custom-tools/custom-tools.tsx @@ -121,11 +121,11 @@ export function CustomTools() { {filteredTools.map((tool) => (
- + {tool.title || 'Unnamed Tool'} {tool.schema?.function?.description && ( -

+

{tool.schema.function.description}

)} diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/mcp.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/mcp.tsx index b0a185065b8..27158a0b7d2 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/mcp.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/mcp/mcp.tsx @@ -95,10 +95,10 @@ function ServerListItem({
- + {server.name || 'Unnamed Server'} - ({transportLabel}) + ({transportLabel})

- Server Name -

- {server.name || 'Unnamed Server'} -

+ Server Name +

{server.name || 'Unnamed Server'}

- Transport -

{transportLabel}

+ Transport +

{transportLabel}

{server.url && (
- URL -

{server.url}

+ URL +

{server.url}

)} {server.connectionStatus === 'error' && (
- Status -

+ Status +

{server.lastError || 'Unable to connect'}

@@ -431,7 +429,7 @@ export function MCP() { {server.authType === 'oauth' && server.connectionStatus !== 'connected' && (
- Authentication + Authentication
- + {u.user_id} @@ -335,7 +335,7 @@ function OverviewTab({ key={r.request_id} className='flex items-center gap-3 border-[var(--border-secondary)] border-b px-3 py-1.5 text-small last:border-b-0' > - + {r.request_id ?? '—'} @@ -437,7 +437,7 @@ function LicensesTab({ environment }: { environment: MothershipEnv }) {

License key (only shown once):

- + {generatedKey}
@@ -515,7 +515,7 @@ function StatCard({ {loading ? ( ) : ( -

{value ?? '—'}

+

{value ?? '—'}

)}
) diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/settings-resource-row/settings-resource-row.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/settings-resource-row/settings-resource-row.tsx index d01bfe131d6..a3bf1b764d6 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/settings-resource-row/settings-resource-row.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/settings-resource-row/settings-resource-row.tsx @@ -35,9 +35,9 @@ export function SettingsResourceRow({
{icon}
- {title} + {title} {description != null && ( - {description} + {description} )}
diff --git a/apps/sim/app/workspace/[workspaceId]/settings/components/workflow-mcp-servers/workflow-mcp-servers.tsx b/apps/sim/app/workspace/[workspaceId]/settings/components/workflow-mcp-servers/workflow-mcp-servers.tsx index f97f9a0cc11..c851726fce2 100644 --- a/apps/sim/app/workspace/[workspaceId]/settings/components/workflow-mcp-servers/workflow-mcp-servers.tsx +++ b/apps/sim/app/workspace/[workspaceId]/settings/components/workflow-mcp-servers/workflow-mcp-servers.tsx @@ -414,10 +414,8 @@ function ServerDetailView({ workspaceId, serverId, onBack }: ServerDetailViewPro {tools.map((tool) => (
- - {tool.toolName} - -

+ {tool.toolName} +

{tool.toolDescription || 'No description'}

@@ -960,7 +958,7 @@ export function WorkflowMcpServers() {
- + {server.name} {server.isPublic && ( @@ -969,7 +967,7 @@ export function WorkflowMcpServers() { )}
-

{toolsLabel}

+

{toolsLabel}

- - {group.name} - + {group.name} {group.isDefault && ( Default )}
- + {group.isDefault ? 'Everyone in the organization' : `${ diff --git a/apps/sim/ee/access-control/components/group-detail.tsx b/apps/sim/ee/access-control/components/group-detail.tsx index d5c2f61f8e6..539c36c1583 100644 --- a/apps/sim/ee/access-control/components/group-detail.tsx +++ b/apps/sim/ee/access-control/components/group-detail.tsx @@ -208,10 +208,8 @@ function AddMembersModal({
-
- {name} -
-
+
{name}
+
{email}
diff --git a/apps/sim/ee/components/setting-row.tsx b/apps/sim/ee/components/setting-row.tsx index dd5b138029c..4d854cd908a 100644 --- a/apps/sim/ee/components/setting-row.tsx +++ b/apps/sim/ee/components/setting-row.tsx @@ -13,7 +13,7 @@ export function SettingRow({ label, description, labelTooltip, children }: Setti return (
- + {labelTooltip && ( @@ -25,7 +25,7 @@ export function SettingRow({ label, description, labelTooltip, children }: Setti )}
- {description &&

{description}

} + {description &&

{description}

} {children}
) diff --git a/apps/sim/ee/data-retention/components/data-retention-settings.tsx b/apps/sim/ee/data-retention/components/data-retention-settings.tsx index 9503ffea1f8..22257645f59 100644 --- a/apps/sim/ee/data-retention/components/data-retention-settings.tsx +++ b/apps/sim/ee/data-retention/components/data-retention-settings.tsx @@ -960,14 +960,12 @@ export function DataRetentionSettings() { >
- - Organization - + Organization Default
- + {orgRowSummary()}
@@ -981,10 +979,10 @@ export function DataRetentionSettings() { className='flex items-center gap-2.5 rounded-lg p-2 text-left transition-colors hover-hover:bg-[var(--surface-active)]' >
- + {workspaceName(workspaceId)} - + {overrideRowSummary(workspaceId)}
diff --git a/apps/sim/ee/whitelabeling/components/whitelabeling-settings.tsx b/apps/sim/ee/whitelabeling/components/whitelabeling-settings.tsx index 04f34a50472..9d1cc2b6a1a 100644 --- a/apps/sim/ee/whitelabeling/components/whitelabeling-settings.tsx +++ b/apps/sim/ee/whitelabeling/components/whitelabeling-settings.tsx @@ -83,7 +83,7 @@ function ColorInput({ label, value, onChange, placeholder = '#000000' }: ColorIn return (
- +
{!isValidHex && ( -

+

Must be a valid hex color (e.g. #33c482)

)} @@ -384,7 +384,7 @@ export function WhitelabelingSettings() { size='sm' onClick={logoUpload.handleThumbnailClick} disabled={logoUpload.isUploading} - className='text-[13px]' + className='text-small' > {logoUpload.previewUrl ? 'Change' : 'Upload'} @@ -393,7 +393,7 @@ export function WhitelabelingSettings() { variant='ghost' size='sm' onClick={logoUpload.handleRemove} - className='text-[13px] text-[var(--text-muted)] hover:text-[var(--text-primary)]' + className='text-[var(--text-muted)] text-small hover:text-[var(--text-primary)]' > @@ -442,7 +442,7 @@ export function WhitelabelingSettings() { size='sm' onClick={wordmarkUpload.handleThumbnailClick} disabled={wordmarkUpload.isUploading} - className='text-[13px]' + className='text-small' > {wordmarkUpload.previewUrl ? 'Change' : 'Upload'} @@ -451,7 +451,7 @@ export function WhitelabelingSettings() { variant='ghost' size='sm' onClick={wordmarkUpload.handleRemove} - className='text-[13px] text-[var(--text-muted)] hover:text-[var(--text-primary)]' + className='text-[var(--text-muted)] text-small hover:text-[var(--text-primary)]' >