Introduction

The Address displays the full address of a geolocated piece of content. It is most often used for events and for the points of a map, and it gives the reader a clear reference of where something takes place.

The address is always shown in full. Whatever the constraints of the layout, it is never truncated.

Anatomy

The icon and the text

The Address pairs a location icon from the Icons family with the address itself, written next to it as a line of text. The icon takes the color of the text.

Layout

Spacing

Between the icon and the text, the spacing is always 4px, whatever the layout and whatever the device.

Icon size

The size of the icon follows the size of the text. It is the font size of the address plus 6px, with a minimum of 16px and a maximum of 32px. This keeps the icon legible next to a small text without letting it grow oversized next to a large one.

Several lines

A long address wraps over several lines rather than being cut. When it does, the icon stays aligned with the first line of text.

Placement

The Address lives in the cells that display geolocated content, events and map points, below the title and the other information of the item. Each meta-cell decides where it shows it, and each list turns it on with its Address option, which also sets its font.