diff --git a/.agents/skills/emcn-design-review/SKILL.md b/.agents/skills/emcn-design-review/SKILL.md index 415a85046dd..04e39da1f8e 100644 --- a/.agents/skills/emcn-design-review/SKILL.md +++ b/.agents/skills/emcn-design-review/SKILL.md @@ -234,7 +234,7 @@ Use for context menus and action menus: @@ -281,19 +281,21 @@ Rules: - Stack multiple skeletons for lists ### Icons -Standard sizing — `h-[14px] w-[14px]` is the dominant pattern (400+ uses): +Standard sizing — use the `size-*` shorthand. `size-[14px]` is the dominant pattern: ```tsx - + ``` -Size scale by frequency: -1. `h-[14px] w-[14px]` — default for inline icons (most common) -2. `h-[16px] w-[16px]` — slightly larger inline icons -3. `h-3 w-3` (12px) — compact/tight spaces -4. `h-4 w-4` (16px) — Tailwind equivalent, also common -5. `h-3.5 w-3.5` (14px) — Tailwind equivalent of 14px -6. `h-5 w-5` (20px) — larger icons, section headers +Always prefer `size-*` over the legacy `h-* w-*` pair. `size-[14px]` is canonical; treat any `h-[Npx] w-[Npx]` or `h-N w-N` pair as a refactor target. + +Size scale (most common first): +1. `size-[14px]` — default for inline icons +2. `size-[16px]` — slightly larger inline icons +3. `size-3` (12px) — compact/tight spaces +4. `size-4` (16px) — Tailwind equivalent +5. `size-3.5` (14px) — Tailwind equivalent of 14px +6. `size-5` (20px) — larger icons, section headers Use `text-[var(--text-icon)]` for icon color (113+ uses in codebase). @@ -332,4 +334,5 @@ Use `text-[var(--text-icon)]` for icon color (113+ uses in codebase). - Importing from emcn subpaths instead of barrel export - Using arbitrary z-index (`z-50`, `z-[9999]`) instead of z-index tokens - Custom shadows instead of shadow tokens -- Icon sizes that don't follow the established scale (default to `h-[14px] w-[14px]`) +- Icon sizes that don't follow the established scale (default to `size-[14px]`) +- Splitting equal height/width into `h-* w-*` pairs instead of the `size-*` shorthand diff --git a/.claude/commands/emcn-design-review.md b/.claude/commands/emcn-design-review.md index ecfad5bcc20..e1e3860ecc7 100644 --- a/.claude/commands/emcn-design-review.md +++ b/.claude/commands/emcn-design-review.md @@ -65,7 +65,7 @@ Modal `size="sm"`, title "Delete/Remove {ItemType}", `variant="destructive"` act ## Icons -Default: `h-[14px] w-[14px]` (400+ uses). Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px. +Default: `size-[14px]`. Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px. Use the `size-*` shorthand — flag `h-[Npx] w-[Npx]` and `h-N w-N` pairs as refactor targets. ## Anti-patterns to flag diff --git a/.claude/rules/emcn-components.md b/.claude/rules/emcn-components.md index 011a3280f4c..53373bc9236 100644 --- a/.claude/rules/emcn-components.md +++ b/.claude/rules/emcn-components.md @@ -32,4 +32,5 @@ function Label({ className, ...props }) { - Export component and variants (if using CVA) - TSDoc with usage examples - Consistent tokens: `font-medium`, `text-[12px]`, `rounded-[4px]` +- Equal height/width → `size-*` (e.g. `size-[14px]`, `size-4`), never `h-[Npx] w-[Npx]` or `h-N w-N`. Default icon size is `size-[14px]` - `transition-colors` for hover states diff --git a/.claude/rules/sim-styling.md b/.claude/rules/sim-styling.md index 1b8c384a703..65911694a4a 100644 --- a/.claude/rules/sim-styling.md +++ b/.claude/rules/sim-styling.md @@ -11,7 +11,8 @@ paths: 1. **No inline styles** - Use Tailwind classes 2. **No duplicate dark classes** - Skip `dark:` when value matches light mode 3. **Exact values** - `text-[14px]`, `h-[26px]` -4. **Transitions** - `transition-colors` for interactive states +4. **Equal h/w → `size-*`** - Use `size-[14px]` / `size-4`, never `h-[14px] w-[14px]` or `h-4 w-4`. Default icon size is `size-[14px]` +5. **Transitions** - `transition-colors` for interactive states ## Conditional Classes diff --git a/.cursor/commands/emcn-design-review.md b/.cursor/commands/emcn-design-review.md index a68e96eb9b4..e51e5bc4445 100644 --- a/.cursor/commands/emcn-design-review.md +++ b/.cursor/commands/emcn-design-review.md @@ -60,7 +60,7 @@ Modal `size="sm"`, title "Delete/Remove {ItemType}", `variant="destructive"` act ## Icons -Default: `h-[14px] w-[14px]` (400+ uses). Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px. +Default: `size-[14px]`. Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px. Use the `size-*` shorthand — flag `h-[Npx] w-[Npx]` and `h-N w-N` pairs as refactor targets. ## Anti-patterns to flag diff --git a/AGENTS.md b/AGENTS.md index 0ab9bf6eb1d..cfa04710cf1 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -357,6 +357,12 @@ Use Tailwind only, no inline styles. Use `cn()` from `@/lib/utils` for condition
``` +For equal height and width, use the `size-*` shorthand — never `h-[Npx] w-[Npx]` or `h-N w-N`. Default icon size is `size-[14px]`. + +```typescript + +``` + ## EMCN Components Import from `@/components/emcn`, never from subpaths (except CSS files). Use CVA when 2+ variants exist. diff --git a/CLAUDE.md b/CLAUDE.md index 4b27c318579..9807d221ca6 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -347,6 +347,12 @@ Use Tailwind only, no inline styles. Use `cn()` from `@/lib/utils` for condition
``` +For equal height and width, use the `size-*` shorthand — never `h-[Npx] w-[Npx]` or `h-N w-N`. Default icon size is `size-[14px]`. + +```typescript + +``` + ## EMCN Components Import from `@/components/emcn`, never from subpaths (except CSS files). Use CVA when 2+ variants exist. diff --git a/apps/docs/app/[lang]/[[...slug]]/page.tsx b/apps/docs/app/[lang]/[[...slug]]/page.tsx index 91c37262564..6fb69448f8b 100644 --- a/apps/docs/app/[lang]/[[...slug]]/page.tsx +++ b/apps/docs/app/[lang]/[[...slug]]/page.tsx @@ -306,9 +306,12 @@ export async function generateMetadata(props: { siteName: 'Sim Documentation', type: 'article', locale: OG_LOCALE_MAP[lang] ?? 'en_US', - alternateLocale: i18n.languages - .filter((l) => l !== lang) - .map((l) => OG_LOCALE_MAP[l] ?? 'en_US'), + alternateLocale: i18n.languages.reduce((locales, l) => { + if (l !== lang) { + locales.push(OG_LOCALE_MAP[l] ?? 'en_US') + } + return locales + }, []), images: [ { url: ogImageUrl, diff --git a/apps/docs/app/[lang]/layout.tsx b/apps/docs/app/[lang]/layout.tsx index 4f32bf20765..8c25b2f411f 100644 --- a/apps/docs/app/[lang]/layout.tsx +++ b/apps/docs/app/[lang]/layout.tsx @@ -11,6 +11,7 @@ import { import { Navbar } from '@/components/navbar/navbar' import { SimLogoFull } from '@/components/ui/sim-logo' import { i18n } from '@/lib/i18n' +import { serializeJsonLd } from '@/lib/json-ld' import { source } from '@/lib/source' import { DOCS_BASE_URL } from '@/lib/urls' import '../global.css' @@ -78,14 +79,6 @@ export default async function Layout({ children, params }: LayoutProps) { }, }, inLanguage: lang, - potentialAction: { - '@type': 'SearchAction', - target: { - '@type': 'EntryPoint', - urlTemplate: `${DOCS_BASE_URL}/api/search?q={search_term_string}`, - }, - 'query-input': 'required name=search_term_string', - }, } return ( @@ -97,7 +90,7 @@ export default async function Layout({ children, params }: LayoutProps) {