Dealogic Styleguide

section menu

Header

Headers define a group of elements.

Examples

Tile Header

Wednesday
Sep 17 2017
Wednesday
Sep 17 2017
<div class="dl-tiles-header">
  <div class="weekday">Wednesday</div>
  <div class="date">Sep 17 2017</div>
</div>

<div class="dl-tiles-header selected">
  <div class="weekday">Wednesday</div>
  <div class="date">Sep 17 2017</div>
</div>

Schedule Header

Tuesday 23 Aug 2017

<h2 class="dl-schedule-header">Tuesday 23 Aug 2017</h2>

Group Header

Headline

Title Header

<div class="dl-group-header">
  <div class="sup">Headline</div>
  <h2>Title Header</h2>
</div>

Group Break Header

Used in a Picklist to group a list of options.

Location
<div class="dl-group-break-header">
  <div class="dl-title-tag">Location</div>
</div>