/ Layout
= extend('/layouts/default');

/ Component
- title = 'Icons';

/ Partials
= partial('partials/styles.slm');
= partial('partials/links.slm');
= partial('partials/head.mixin.slm');
= partial('partials/content-header.mixin.slm');
= partial('section/section.mixin.slm');
= partial('section/section-text.mixin.slm');

/ Content blocks
= content('head');
  = mixin('head', title);

= content('header');
  = mixin('header', title);

= content('content');
  = mixin('content-header', title);
  = mixin('section', 'Program Category Icons', 'elements/icons/icons-program-category', 'gutter', this.variables['icons-program-category']);
  = mixin('section', 'Program Card Icons', 'elements/icons/icons-program-card', 'gutter', this.variables['icons-program-card']);
  = mixin('section', 'Checklist Category Icons', 'elements/icons/icons-checklist', 'gutter', this.variables['icons-checklist']);
  = mixin('section', 'Logos', 'elements/icons/icons-logo', 'gutter', this.variables['icons-logo']);

  = mixin('section', 'UI Icons', 'elements/icons/icons', 'gutter', this.variables['icons-ui']);

  = mixin('section-text', 'Icon Usage', 'elements/icons/icons.readme');
  = mixin('section', 'Subway Icons', 'elements/icons/icons-subway', 'gutter', this.variables['icons-subway']);