# XWUIHrCareerPortalPage

Recruitment-module page that configures and previews the public employer-branding careers portal. It loads `hrApi.getCareerPortal()` and renders a single preview card showing the company name, a published/draft status pill, the hero headline (localized via `headlineAr` when `locale: 'ar'`), the count of vacant jobs, and a clickable external link to the live careers URL. Use it as the admin-facing preview surface when managing how the public careers page appears. Built on `HrPageBase` (extends `XWUIShellPage`), so it accepts the standard page props (`title`, `titleAr`, `description`, `breadcrumbs`, `toolbar`) plus `hrApiOptions` for selecting the API environment.

## Basic Usage

Loads the careers portal config from the sandbox HR API and renders the preview card with the company headline, published/draft pill, vacant-jobs count, and the live portal URL link.

```example
file: examples/BasicUsage.ts
html: examples/BasicUsage.html
title: Basic Usage
description: Constructs the page against createHrApi({ env: 'sandbox' }) and renders the career-portal preview card (headline, status pill, vacant jobs, URL).
```

## Arabic locale (RTL)

Passes `{ locale: 'ar' }` with a `titleAr` so the page resolves the Arabic title (`صفحة التوظيف`) and renders right-to-left.

```example
file: examples/ArabicLocale.ts
html: examples/ArabicLocale.html
title: Arabic locale (RTL)
description: Arabic title via titleAr plus locale 'ar' for a right-to-left page.
```

## Constrained, centered layout

Caps the content column at 1200px, centers it, and adds roomier padding via the shell-page config.

```example
file: examples/ConstrainedLayout.ts
html: examples/ConstrainedLayout.html
title: Constrained, centered layout
description: `{ maxWidth: '1200px', centered: true, padding: '2rem' }` constrains and centers the page column.
```

```api
```