<commit_before>mixin prism(html) 
  pre.language-bash
    code.language-bash(ngNonBindable)!= html

#banner(style="background: #111111; color: #ccc; tex-align: center;")
  .slds-container--large.slds-container--center
    .slds-grid.slds-grid--align-center.slds-p-around--x-large
      .slds-col.slds-text-align--center
        img(src='img/shield.svg', alt='', style="height: 180px;")
        .slds-text-heading--large(style="color:#FFF;") NG-LIGHTNING
        .slds-text-heading--small.slds-p-top--small Native Angular 2 components & directives for Lightning Design System

.slds-container--large.slds-container--center.slds-m-top--large.slds-p-around--x-large

  .slds-grid.slds-m-top--large
    .slds-col--padded.slds-text-align--center.slds-size--1-of-3
      .slds-text-heading--medium BUILDING FOR THE FUTURE
      .slds-m-top--large 
        | Built upon next generation frameworks like 
        b: a(href="https://angular.io/") Angular 2 
        | and 
        b: a(href="https://www.lightningdesignsystem.com/") Salesforce's Lightning Design System
        | , rest ​assured that you building an application to stand the test of time.
    .slds-col--padded.slds-text-align--center.slds-size--1-of-3
      .slds-text-heading--medium BEST PRACTICES
      .slds-m-top--large 
        | We focus on building stateless functional components that depend only on their input properties, guaranteeing better performance, more development flexibility and seamless integration with your application's requirements.
    .slds-col--padded.slds-text-align--center.slds-size--1-of-3
      .slds-text-heading--medium  ACCESSIBILITY
      .slds-m-top--large 
        | We put a lot of effort to follow Lightning Design System's accessibility guidelines, to assure that your product is operable by people with a wide range of abilities
        | and meets all legal requirements.

  hr

  .slds-p-vertical--large
    .slds-text-heading--large.slds-m-bottom--large Getting started
    p.slds-m-bottom--small 
      | Install through 
      code npm
      | :
    +prism(install)
      
    p.slds-m-vertical--small 
      | If you use&nbsp;
      strong SystemJS
      | &nbsp;to load your files, you may want to use our bundle file through&nbsp;
      a(href="https://npmcdn.com/") npmcdn
      | .
    +prism(bundle)

  .slds-p-vertical--large
    .slds-text-heading--large.slds-m-bottom--large Reading the documentation
    p 
      | Each component has API documentation, examples, and a working demo. They can be found&nbsp; 
      a([routerLink]="['Components']") here
      | .

  .slds-p-vertical--large
    .slds-text-heading--large.slds-m-bottom--large Usage
    p.slds-m-bottom--small <commit_msg>chore(demo): fix router link to components page<commit_after>mixin prism(html) 
  pre.language-bash
    code.language-bash(ngNonBindable)!= html

#banner(style="background: #111111; color: #ccc; tex-align: center;")
  .slds-container--large.slds-container--center
    .slds-grid.slds-grid--align-center.slds-p-around--x-large
      .slds-col.slds-text-align--center
        img(src='img/shield.svg', alt='', style="height: 180px;")
        .slds-text-heading--large(style="color:#FFF;") NG-LIGHTNING
        .slds-text-heading--small.slds-p-top--small Native Angular 2 components & directives for Lightning Design System

.slds-container--large.slds-container--center.slds-m-top--large.slds-p-around--x-large

  .slds-grid.slds-m-top--large
    .slds-col--padded.slds-text-align--center.slds-size--1-of-3
      .slds-text-heading--medium BUILDING FOR THE FUTURE
      .slds-m-top--large 
        | Built upon next generation frameworks like 
        b: a(href="https://angular.io/") Angular 2 
        | and 
        b: a(href="https://www.lightningdesignsystem.com/") Salesforce's Lightning Design System
        | , rest ​assured that you building an application to stand the test of time.
    .slds-col--padded.slds-text-align--center.slds-size--1-of-3
      .slds-text-heading--medium BEST PRACTICES
      .slds-m-top--large 
        | We focus on building stateless functional components that depend only on their input properties, guaranteeing better performance, more development flexibility and seamless integration with your application's requirements.
    .slds-col--padded.slds-text-align--center.slds-size--1-of-3
      .slds-text-heading--medium  ACCESSIBILITY
      .slds-m-top--large 
        | We put a lot of effort to follow Lightning Design System's accessibility guidelines, to assure that your product is operable by people with a wide range of abilities
        | and meets all legal requirements.

  hr

  .slds-p-vertical--large
    .slds-text-heading--large.slds-m-bottom--large Getting started
    p.slds-m-bottom--small 
      | Install through 
      code npm
      | :
    +prism(install)
      
    p.slds-m-vertical--small 
      | If you use&nbsp;
      strong SystemJS
      | &nbsp;to load your files, you may want to use our bundle file through&nbsp;
      a(href="https://npmcdn.com/") npmcdn
      | .
    +prism(bundle)

  .slds-p-vertical--large
    .slds-text-heading--large.slds-m-bottom--large Reading the documentation
    p 
      | Each component has API documentation, examples, and a working demo. They can be found&nbsp; 
      a([routerLink]="['/components']") here
      | .

  .slds-p-vertical--large
    .slds-text-heading--large.slds-m-bottom--large Usage
    p.slds-m-bottom--small 
{'fraction_non_alphanumeric': 0.12874747103181902, 'fraction_numerical': 0.0062534485929740665, 'mean_word_length': 2.6594885598923286, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 6, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3495566', 'n_tokens_mistral': 1901, 'n_tokens_neox': 1792, 'n_words': 400}