access-nyc-patterns/src/views/section/section.mixin.slm

User Interface Patterns for Benefits Access

= partial('demo-specs.mixin.slm');
= partial('demo-block.mixin.slm');
- this.site.navigation = (this.site.navigation) ? this.site.navigation : [];

= mixin('section', 'title', 'path', 'layout = columns', 'grid = false', 'specs = true', 'code = true');
  - id = (this.title && this.title !== '') ? this.title.toLowerCase().split(' ').join('-') : false;
  - if (this.title)
    - let navitem = {'title': this.title, 'id': id};
    - this.site.navigation.push(navitem);

  section id=id class='pb-4 mb-4'
    div class='page-wrapper px-2'
      header class='layout--home-body'
        div class='my-0 px-2 pt-1 pb-4 border-b border-color-grey-light'
          - let srcPadding = false
          - if (this.title)
            - srcPadding = 'pt-2'
            h2 class='m-0'
              a href='#${id}' class='text-color-grey-mid font-normal no-underline capitalize'
                = this.title;

          div class=srcPadding
            - let source = this.path.split('/')
            - source.splice(source.length - 1, 1)
            - source = source.join('/');

            p class='text-font-size-small m-0'
              = 'Source: ';
              code
                a href='${link_source}/tree/v${this.variables.version}/src/${source}'
                  = 'src/' + this.path

      - if (this.specs != 'false')
        = mixin('demo-specs', this.path + '.md');

      - if (this.code != 'false')
        = mixin('demo-block', this.path + '.slm', this.layout, this.grid);