Skip to content
Barbican Docs

Shared sections

Blocks used on more than one page — social links, phone lists, licenses, and associations.

A few blocks appear on more than one page — an office and an agent both have social links, phone numbers, and licenses — so Barbican ships one block for each, in an office and a member variant, sharing the same hooks. Each has the standard Header control (show / hide + label) and a Brand accent.

Social media · barbican/office-social-media, barbican/member-social-media

Section titled “Social media · barbican/office-social-media, barbican/member-social-media”

Branded link tiles for a brokerage’s or agent’s social profiles. The platform marks (Facebook, Instagram, LinkedIn, TikTok, YouTube, …) keep their own brand colours by design; the hooks restyle the surrounding row.

Class Targets
barbican-social The whole section
barbican-social__heading The header label (also barbican-eyebrow)
barbican-social__list The row of tiles
barbican-social__item One profile link (icon + label)
barbican-social__icon The rounded brand-colour tile
barbican-social__label The text next to the icon
/* Make the social tiles round instead of rounded-square */
.barbican-social__icon { border-radius: 50%; }

Other phones · barbican/office-other-phones, barbican/member-other-phones

Section titled “Other phones · barbican/office-other-phones, barbican/member-other-phones”

A labelled list of additional phone numbers, each a tel: link with a type icon.

Class Targets
barbican-phones The whole section
barbican-phones__heading The header label (also barbican-eyebrow)
barbican-phones__list The list
barbican-phones__item One phone row
barbican-phones__icon The type icon (mobile / fax / …), tinted with --barbican-brand
barbican-phones__text The label + number stack
barbican-phones__label The type label (“Mobile”, “Office”, …)
barbican-phones__number The number (the tel: link)
barbican-phones__ext The “ext. NNN” suffix

Licenses · barbican/office-corporate-licenses, barbican/member-state-licenses

Section titled “Licenses · barbican/office-corporate-licenses, barbican/member-state-licenses”

Credential cards for a brokerage’s corporate licenses or an agent’s state licenses. Both are the same four RESO fields — type, number, jurisdiction, expiration — so they share one card.

Class Targets
barbican-licenses The whole section
barbican-licenses__heading The header label (also barbican-eyebrow)
barbican-licenses__grid The card grid
barbican-licenses__card One licence card (also barbican-card)
barbican-licenses__icon The shield icon, tinted with --barbican-brand
barbican-licenses__type The licence type (“Broker”, “Corporate”)
barbican-licenses__state The jurisdiction pill
barbican-licenses__number The “License NNN” line
barbican-licenses__label The “License” caption
barbican-licenses__value The licence number (monospace)
barbican-licenses__expiry The expiration line
barbican-licenses__expiry--expired The expiration line when the date has passed

Associations · barbican/office-associations, barbican/member-associations

Section titled “Associations · barbican/office-associations, barbican/member-associations”

Read-only key/value lists of a RESO association collection, rendered by the generic resource-record renderer. The hooks are flat (barbican-<part>) rather than strict block__element, but carry the same collision-safe barbican- prefix.

Class Targets
barbican-resource-records The whole section
barbican-eyebrow The header label
barbican-resource-record One record’s card
barbican-resource-record-head A record’s subheading
barbican-spec-grid The key/value grid within a record
barbican-spec-fact One key/value pair (label + value)