# Job Recommendation block

> Recommended job role card with company logo, location, work mode, and salary meta row

Job recommendation card with company logo tile, role title, and an icon meta row for location, work mode, and salary, plus a description and Quick Apply / View Details buttons. ReUI Frame, shadcn Button, Separator. Job board, careers, hiring.

- Type: Pro block
- Category: [Card](https://web.dev.reui.io/blocks/application/card.md)
- Page: https://web.dev.reui.io/blocks/application/card/card-24
- MCP: `get_block("card-24")`
- Built with: Button, Frame, Separator
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## Best for

A profile matched job opening with a dark logo tile, a 3 fact row ending in pay, Quick Apply and View Details

## Agent notes

- `CARDS` holds only the location, work mode and pay row; the role, company, `Binance` logo and blurb are hardcoded in `CardItem`
- Quick Apply and View Details are `Button` elements with no handler; wire them to your apply flow and job page
- `CardItem` fixes its Frame at a 592px width; give it a fluid width before placing it in a grid or a narrow column

## When not to use

- An applicant record for recruiters, with copyable contact fields and skill badges: use [Applicant Record](https://web.dev.reui.io/blocks/application/card/card-9.md) (`get_block("card-9")`)
- Many open roles as rows to search, sort and filter: use the [Base blocks](https://web.dev.reui.io/blocks/data-grid/base.md)

## Install

```bash
npx shadcn@latest add @reui/card-24
```

## About Card blocks

### When to use

- Rows and grids of KPI tiles, each a value and a label with an optional trend badge or icon
- Grids of small linked cards for features, setup steps, guides, integrations or partner logos
- One record or offer per card: a profile, applicant, delivery, meeting, job, asset price or promo

### When not to use

- A metric panel with a progress bar, a segmented gauge or supporting rows under the total: use the [Stats blocks](https://web.dev.reui.io/blocks/application/stats.md)
- A KPI whose trend over time is plotted, with a period switcher or tooltips: use the [Area Chart blocks](https://web.dev.reui.io/blocks/chart/area-chart.md)
- A whole overview page: a header, a row of KPI tiles, then a work list or trend panel: use the [Dashboard blocks](https://web.dev.reui.io/blocks/application/dashboard.md)

### Agent notes

- Every block centers itself in a padded `min-h-svh` wrapper in page.tsx or its root component; remove it when the card goes inside your own page

Every ReUI item has a twin like this one; the index is https://web.dev.reui.io/llms.txt. Agents with the ReUI MCP (https://web.dev.reui.io/docs/mcp) get the same guidance from the getters named above.