# Job sheet breakdown

> One big job priced as the sheet it was written on: beside a label, heading, a short list of what moves the price, a button and a photograph, a card headed with the job number and address lists each line with its quantity and amount on hairlines, then the subtotal and VAT, then the total at display size ruled off twice, and a stamp reading fixed price, agreed before we start. On a phone the sheet sits under the prose. The example photograph can be replaced in the editor. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/job-sheet-breakdown.html
Section: Pricing
Access: Included in Pattern Paste access.
Needs: Requires a block theme on WordPress 7.0. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type.
Blocks: button, buttons, column, columns, group, heading, image, list, list-item, paragraph
Keywords: prices, quote, estimate, breakdown, rewire, electrician, trades, invoice

## Variations (2)

### Job sheet (the default)

Identical markup in every theme.

Your base ground with the sheet on the plate role inside a rule-role hairline, the head and the double rule above the total in currentColor and a currentColor stamp.

### Spur

This variation states its own colours and states its own type: identical in every theme.

The Spur electrician and plumber set: a white sheet with 4px corners and a hard conduit-grey offset shadow on switch white, cable-black double rule under Arial Black amounts, a live-blue outlined stamp, a live-blue button and the coil of cable beside it.


---

## The signature moment: the total is ruled off twice, the way a job sheet is

**Two nested groups, each with a 1px top border and 3px between them, sit
above the total**, which is set at display size. It is never
`border-style: double`, which WordPress does not measure. Every line is a row
group, never `core/table` (a table cannot rule one row twice): the item and
its quantity at left, the amount at right, a hairline under each. The sums
add up: £5,740 before VAT, £1,148 VAT at 20%, £6,888 in all. On a phone the
columns stack and the quantity stays under its item, so no row is squeezed.

## What it inherits from your theme

- **Typeface.** The base states no font family.
- **Palette.** Your `base` ground with `contrast` type; the sheet is on the
  plate role with its text role, line hairlines on the rule role, the head
  rule, the double rule and the stamp in `currentColor`. Labels are on the
  label role. The button is your theme's own.

## What it decides for itself

- **The heading.** The `xx-large` rung: its job is hierarchy.
- **The total.** Bold at a display clamp; amounts at a stated clamp so they
  line up down the right edge.
- **The split.** 5/12 prose, 7/12 sheet.

## What to change first

1. **The lines and amounts.** Keep the sums true: subtotal, VAT and total
   are typed, not calculated.
2. **The job number and address** at the head of the sheet.
3. **The photograph** and the list of what moves the price.

## The Spur look

Part of the Spur Pattern Set, an electrician and plumber in Beeston: switch
white `#f2f3ef`, cable black `#14181c` ink, slate `#4a535b` muted ink, live
blue `#1747c9` labels, the stamp and the button, white cards on a conduit
`#c5ccd2` hairline, with a signal yellow `#ffd21a` kept for emergencies.
Headings and amounts are Arial Black; body, labels and buttons are Arial.
The sheet has 4px corners and a hard 6px offset shadow in the hairline
colour; the stamp has 2px corners like a cable tag. Take the base for your
theme's colours, or the look's **Use my theme** chip.

## Notes

- Core blocks only: columns, group, heading, paragraph, list, buttons, image.
- The example photograph is from the WordPress.org Photo Directory (CC0).