Menu
Structure, tone, and accessibility rules for beaver-nest-fe's landing-page content (tagline, footer, not-found/error copy). Auto-loads when authoring or validating beaver-nest-fe copy.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Comprehensive project planning standards for plans/ directory including folder structure (ideas/, backlog/, in-progress/, done/), stage-aware naming convention (done uses YYYY-MM-DD__identifier/; backlog and in-progress use identifier/ with no date prefix), five-document file organization (README.md, brd.md, prd.md, tech-docs.md, delivery.md for multi-file default; single README.md for trivially-small single-file exception), BRD/PRD content-placement rules, Gherkin acceptance criteria, and the mandatory structured multiple-choice grilling gates (pre-write and post-write) for resolving design decisions with the user. Essential for creating structured, executable project plans.
UI development skill covering design token usage, shadcn/ui + Radix composition patterns, accessibility requirements, anti-patterns catalog, and brand context for OrganicLever and OSE Platform. Auto-loads when working on TSX components, CSS, or UI design tasks.
| name | apps-beaver-nest-fe-developing-content |
| description | Structure, tone, and accessibility rules for beaver-nest-fe's landing-page content (tagline, footer, not-found/error copy). Auto-loads when authoring or validating beaver-nest-fe copy. |
beaver-nest-fe is a Next.js 16 App Router hello-world skeleton, not a blog or CMS-backed content
platform — it has no content/ collection, no date-prefixed files, and no MDX pipeline. Its entire
content surface today is inline JSX copy inside a handful of components and routes. This Skill
documents that surface so content agents change the right files in the right way instead of
inventing a blog-style structure that doesn't exist here.
When to use this Skill: creating or editing copy in apps/beaver-nest-fe/src/components/AppShell.tsx,
AppFrame.tsx, src/app/page.tsx, src/app/not-found.tsx, src/app/error.tsx, or src/app/layout.tsx
metadata.
| File | Content |
|---|---|
src/components/AppFrame.tsx | Shared header title (AppHeader title="BeaverNest") and footer copyright line |
src/components/AppShell.tsx | Landing page tagline, the backend-greeting line, and the "View on GitHub" link |
src/app/not-found.tsx | 404 heading, "Back to home" link, and its own <title> metadata |
src/app/error.tsx | Client-side error heading and "Try again" reset button |
src/app/layout.tsx | Root <html lang>, default <title>/<meta description> |
·) decode inside
JSX text children but not inside plain string attribute values (like title="...") — use the
literal Unicode character (·) directly in attributes instead.@open-sharia-enterprise/web-ui-token Tailwind classes
(text-primary, bg-accent, border-border, etc.) already in use in these files — never introduce
a raw hex color or arbitrary Tailwind value.AppFrame: every route-level page (page.tsx, not-found.tsx, error.tsx)
renders through AppFrame so the header/footer stay consistent — don't duplicate header/footer
markup in a new route.<h1> per rendered page, landmark elements (header/main/footer)
present, and any new interactive element needs a visible label or aria-label.src/app/icon.tsx (favicon, via next/og's ImageResponse) is excluded from
unit-test coverage in vitest.config.ts because jsdom cannot render it — verify icon changes via a
real build or Playwright instead of chasing unit coverage there.docs-applying-content-quality Skill for universal markdown/content rules (this Skill only covers
what's specific to beaver-nest-fe's JSX content surface)specs/apps/beaver-nest/behavior/beaver-nest-fe/gherkin/hello/landing-page.feature — the Gherkin
scenarios this content must keep satisfying