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

/ Component
- title = 'Card';

/ 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', false, 'components/card/card');
  = mixin('section', 'Card With Icon', 'components/card/card-icon');
  = mixin('section', 'Card With Icon and Information', 'components/card/card-icon-info');
  = mixin('section', 'Card With Icon, Information, and Apply Button', 'components/card/card-icon-info-apply');
  = mixin('section', 'Removable Card', 'components/card/card-removable', 'gutter');

  = mixin('section', 'Vue Card', 'components/card/card.vue');
  = mixin('section-text', 'Vue Component Usage', 'components/card/card.readme.vue');

= content('script');
  javascript:
    VueComponents.card();