# Hours week table

> Opening hours as a timetable. A tracked label, a display heading and a short line of address sit in the left third; opposite them seven ruled rows run Monday to Sunday, the day at the left and the hours at the right, both set well above body size, with the closed day set apart in italic and in your label colour. One note line under the rules covers bank holidays. No table block and no script: seven plain rows you can edit in place. States no colour and no font of its own.

Canonical: https://patternpaste.com/pattern/hours-week-table.html
Section: Contact
Access: Free, and free to keep.
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: column, columns, group, heading, paragraph
Keywords: opening hours, hours, times, week, closed, shop, trade counter

## Variations (2)

### Week table (the default)

Identical markup in every theme.

Your base ground with your contrast on it, the heading at the left and seven currentColor-ruled day rows at the right. The closed day is italic, so it reads as different in any theme.

### Yellow and red

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

A trade counter look: states signal yellow, near-black type and rules, and the closed day in deep red, with an Arial Black heading over Arial rows.


---

## The signature moment: the week as seven ruled rows, one of them shut

**Seven rows of equal height, each a day against its hours across the full
column, with the closed day set apart.** The hours are the second mass on the
section: day and hours are `clamp(1.25rem, 1.9vw, 1.75rem)`, well above body
size, so a visitor reads the week at a glance rather than hunting through a
paragraph. The mark survives colourlessness because it is made of rhythm and
rule length: the rows are the same height, the rules run the width of the
column, and the closed day breaks the pattern by being italic, not by being
coloured.

## What it inherits from your theme

- The ground is `base` and every line of type is `contrast`, each a two-rung
  chain. Text is at 4.5:1 or better in the stock themes.
- The rules are `currentColor`, so they follow your text.
- The label and the closed day start on `role-label` and fall through to
  `contrast`; in a stock theme they are your contrast colour.
- The heading is off the type ladder on purpose, a bare
  `clamp(2.5rem, 5vw, 4.75rem)`: its size is the composition. The body line
  takes `medium`.
- The typeface is your theme's.

## What it decides for itself

- Each row is a flex group with `nowrap` and `space-between`, so the hours
  stay on the same line as the day down to 390px.
- The two columns are 38 and 62 per cent and stack below 782px, heading first.

## The Styled look

`yellow-and-red` states signal yellow `#ffd21f`, near-black `#141414` type and
rules, and the closed day in deep red `#a8101a` (5.2:1 on the yellow), with an
Arial Black heading over Arial rows. It is for a trade counter or a builders'
merchant that wants to be seen from the road.

## What to change first

The hours, the closed day (move the italic and the label colour with it), the
address line and the bank-holiday note.
