UNPKG

@logo-software/theme-core

Version:

Logo design guide implementatio for bootstrap and .net projects

309 lines 93.5 kB
<html lang="en" data-lt-installed="true"> <head> <meta charset="utf-8"> <title>Samples</title> <base href="/"> <meta content="width=device-width, initial-scale=1" name="viewport"> <link rel="stylesheet" type="text/css" href="./main.css"/> </head> <body data-gr-c-s-loaded="true"> <logo-root _nghost-frv-c0="" ng-version="9.1.6"><p _ngcontent-frv-c0="" hidden=""><!--bindings={ "ng-reflect-ng-for-of": "[object Object],[object Object" }--><!----><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-for-of": "[object Object],[object Object" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/core-sample/mask-directi" href="#/logo/core-sample/mask-directive-showcase/mask-directive-showcase.component">Mask-directive</a><span _ngcontent-frv-c0=""> | </span><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/core-sample/endpoint-ser" href="#/logo/core-sample/endpoint-service-showcase/endpoint-service-showcase.component">Endpoint-service</a><span _ngcontent-frv-c0=""> | </span><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/core-sample/storage-clas" href="#/logo/core-sample/storage-class-showcase/storage-class-showcase.component">Storage-class</a><span _ngcontent-frv-c0=""> | </span><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/excel-sample/excel-showc" href="#/logo/excel-sample/excel-showcase/excel-showcase.component">Excel</a><span _ngcontent-frv-c0=""> | </span><!--bindings={}--><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/icons-sample/icons-showc" href="#/logo/icons-sample/icons-showcase/icons-showcase.component">Icons</a><span _ngcontent-frv-c0=""> | </span><!--bindings={}--><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/language-sample/language" href="#/logo/language-sample/language-showcase/language-showcase.component">Language</a><span _ngcontent-frv-c0=""> | </span><!--bindings={}--><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/paging-sample/paging-sho" href="#/logo/paging-sample/paging-showcase/paging-showcase.component">Paging</a><span _ngcontent-frv-c0=""> | </span><!--bindings={}--><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/table-sample/table-showc" href="#/logo/table-sample/table-showcase/table-showcase.component">Table</a><span _ngcontent-frv-c0=""> | </span><!--bindings={}--><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/theme-sample/theme-showc" href="#/logo/theme-sample/theme-showcase/theme-showcase.component">Theme</a><span _ngcontent-frv-c0=""> | </span><!--bindings={}--><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/toast-sample/toast-showc" href="#/logo/toast-sample/toast-showcase/toast-showcase.component">Toast</a><span _ngcontent-frv-c0=""> | </span><!--bindings={}--><!----><!----><!--bindings={ "ng-reflect-ng-if": "true" }--><!----><a _ngcontent-frv-c0="" ng-reflect-router-link="/logo/input-sample/input-showc" href="#/logo/input-sample/input-showcase/input-showcase.component">Input</a><span _ngcontent-frv-c0=""></span><!--bindings={}--><!----></p> <router-outlet _ngcontent-frv-c0=""></router-outlet> <logo-logo _nghost-frv-c1=""> <router-outlet _ngcontent-frv-c1=""></router-outlet> <logo-theme-showcase _nghost-baj-c2=""><div _ngcontent-baj-c2="" class="container"><div _ngcontent-baj-c2="" class="card colors"><h2 _ngcontent-baj-c2="">COLORS</h2><div _ngcontent-baj-c2="" class="container"><div _ngcontent-baj-c2="" class="row title"><div _ngcontent-baj-c2="" class="cell split-xs-11"></div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell title split-xs-11">100</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">200</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">300</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">400</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">500</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">600</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">700</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">800</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">900</div><div _ngcontent-baj-c2="" class="cell title split-xs-11">1000</div></div><!--bindings={ "ng-reflect-ng-for-of": "text,brand,primary,secondary,b" }--><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">text</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-100 black-color" ng-reflect-klass="color text-100" ng-reflect-ng-class="[object Object]"> #f3f3f3 </div><div _ngcontent-baj-c2="" class="color-text">text-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-200 black-color" ng-reflect-klass="color text-200" ng-reflect-ng-class="[object Object]"> #e7e7e7 </div><div _ngcontent-baj-c2="" class="color-text">text-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-300 black-color" ng-reflect-klass="color text-300" ng-reflect-ng-class="[object Object]"> #cecece </div><div _ngcontent-baj-c2="" class="color-text">text-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-400 black-color" ng-reflect-klass="color text-400" ng-reflect-ng-class="[object Object]"> #aaaaaa </div><div _ngcontent-baj-c2="" class="color-text">text-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-500 white-color" ng-reflect-klass="color text-500" ng-reflect-ng-class="[object Object]"> #858585 </div><div _ngcontent-baj-c2="" class="color-text">text-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-600 white-color" ng-reflect-klass="color text-600" ng-reflect-ng-class="[object Object]"> #7e7777 </div><div _ngcontent-baj-c2="" class="color-text">text-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-700 white-color" ng-reflect-klass="color text-700" ng-reflect-ng-class="[object Object]"> #746e6e </div><div _ngcontent-baj-c2="" class="color-text">text-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-800 white-color" ng-reflect-klass="color text-800" ng-reflect-ng-class="[object Object]"> #676161 </div><div _ngcontent-baj-c2="" class="color-text">text-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-900 white-color" ng-reflect-klass="color text-900" ng-reflect-ng-class="[object Object]"> #524d4d </div><div _ngcontent-baj-c2="" class="color-text">text-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color text-1000 white-color" ng-reflect-klass="color text-1000" ng-reflect-ng-class="[object Object]"> #373434 </div><div _ngcontent-baj-c2="" class="color-text">text-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">brand</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-100 black-color" ng-reflect-klass="color brand-100" ng-reflect-ng-class="[object Object]"> #f1e6ff </div><div _ngcontent-baj-c2="" class="color-text">brand-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-200 black-color" ng-reflect-klass="color brand-200" ng-reflect-ng-class="[object Object]"> #e3ccff </div><div _ngcontent-baj-c2="" class="color-text">brand-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-300 black-color" ng-reflect-klass="color brand-300" ng-reflect-ng-class="[object Object]"> #c899ff </div><div _ngcontent-baj-c2="" class="color-text">brand-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-400 black-color" ng-reflect-klass="color brand-400" ng-reflect-ng-class="[object Object]"> #9e4dff </div><div _ngcontent-baj-c2="" class="color-text">brand-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-500 white-color" ng-reflect-klass="color brand-500" ng-reflect-ng-class="[object Object]"> #7500ff </div><div _ngcontent-baj-c2="" class="color-text">brand-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-600 white-color" ng-reflect-klass="color brand-600" ng-reflect-ng-class="[object Object]"> #6c00eb </div><div _ngcontent-baj-c2="" class="color-text">brand-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-700 white-color" ng-reflect-klass="color brand-700" ng-reflect-ng-class="[object Object]"> #6300d9 </div><div _ngcontent-baj-c2="" class="color-text">brand-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-800 white-color" ng-reflect-klass="color brand-800" ng-reflect-ng-class="[object Object]"> #5800bf </div><div _ngcontent-baj-c2="" class="color-text">brand-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-900 white-color" ng-reflect-klass="color brand-900" ng-reflect-ng-class="[object Object]"> #460099 </div><div _ngcontent-baj-c2="" class="color-text">brand-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color brand-1000 white-color" ng-reflect-klass="color brand-1000" ng-reflect-ng-class="[object Object]"> #2f0066 </div><div _ngcontent-baj-c2="" class="color-text">brand-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">primary</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-100 black-color" ng-reflect-klass="color primary-100" ng-reflect-ng-class="[object Object]"> #e6f4ff </div><div _ngcontent-baj-c2="" class="color-text">primary-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-200 black-color" ng-reflect-klass="color primary-200" ng-reflect-ng-class="[object Object]"> #cce9ff </div><div _ngcontent-baj-c2="" class="color-text">primary-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-300 black-color" ng-reflect-klass="color primary-300" ng-reflect-ng-class="[object Object]"> #99d3ff </div><div _ngcontent-baj-c2="" class="color-text">primary-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-400 black-color" ng-reflect-klass="color primary-400" ng-reflect-ng-class="[object Object]"> #4db1ff </div><div _ngcontent-baj-c2="" class="color-text">primary-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-500 white-color" ng-reflect-klass="color primary-500" ng-reflect-ng-class="[object Object]"> #0090ff </div><div _ngcontent-baj-c2="" class="color-text">primary-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-600 white-color" ng-reflect-klass="color primary-600" ng-reflect-ng-class="[object Object]"> #0084eb </div><div _ngcontent-baj-c2="" class="color-text">primary-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-700 white-color" ng-reflect-klass="color primary-700" ng-reflect-ng-class="[object Object]"> #007ad9 </div><div _ngcontent-baj-c2="" class="color-text">primary-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-800 white-color" ng-reflect-klass="color primary-800" ng-reflect-ng-class="[object Object]"> #006cbf </div><div _ngcontent-baj-c2="" class="color-text">primary-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-900 white-color" ng-reflect-klass="color primary-900" ng-reflect-ng-class="[object Object]"> #005699 </div><div _ngcontent-baj-c2="" class="color-text">primary-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color primary-1000 white-color" ng-reflect-klass="color primary-1000" ng-reflect-ng-class="[object Object]"> #003a66 </div><div _ngcontent-baj-c2="" class="color-text">primary-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">secondary</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-100 black-color" ng-reflect-klass="color secondary-100" ng-reflect-ng-class="[object Object]"> #fcfdfe </div><div _ngcontent-baj-c2="" class="color-text">secondary-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-200 black-color" ng-reflect-klass="color secondary-200" ng-reflect-ng-class="[object Object]"> #f8fafd </div><div _ngcontent-baj-c2="" class="color-text">secondary-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-300 black-color" ng-reflect-klass="color secondary-300" ng-reflect-ng-class="[object Object]"> #f1f6fc </div><div _ngcontent-baj-c2="" class="color-text">secondary-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-400 black-color" ng-reflect-klass="color secondary-400" ng-reflect-ng-class="[object Object]"> #e7eff9 </div><div _ngcontent-baj-c2="" class="color-text">secondary-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-500 black-color" ng-reflect-klass="color secondary-500" ng-reflect-ng-class="[object Object]"> #dde8f7 </div><div _ngcontent-baj-c2="" class="color-text">secondary-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-600 black-color" ng-reflect-klass="color secondary-600" ng-reflect-ng-class="[object Object]"> #cad5e4 </div><div _ngcontent-baj-c2="" class="color-text">secondary-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-700 black-color" ng-reflect-klass="color secondary-700" ng-reflect-ng-class="[object Object]"> #bbc5d3 </div><div _ngcontent-baj-c2="" class="color-text">secondary-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-800 black-color" ng-reflect-klass="color secondary-800" ng-reflect-ng-class="[object Object]"> #a5aeba </div><div _ngcontent-baj-c2="" class="color-text">secondary-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-900 white-color" ng-reflect-klass="color secondary-900" ng-reflect-ng-class="[object Object]"> #848b95 </div><div _ngcontent-baj-c2="" class="color-text">secondary-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color secondary-1000 white-color" ng-reflect-klass="color secondary-1000" ng-reflect-ng-class="[object Object]"> #585d63 </div><div _ngcontent-baj-c2="" class="color-text">secondary-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">basic</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-100 black-color" ng-reflect-klass="color basic-100" ng-reflect-ng-class="[object Object]"> #fefefe </div><div _ngcontent-baj-c2="" class="color-text">basic-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-200 black-color" ng-reflect-klass="color basic-200" ng-reflect-ng-class="[object Object]"> #fcfdfe </div><div _ngcontent-baj-c2="" class="color-text">basic-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-300 black-color" ng-reflect-klass="color basic-300" ng-reflect-ng-class="[object Object]"> #fafbfd </div><div _ngcontent-baj-c2="" class="color-text">basic-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-400 black-color" ng-reflect-klass="color basic-400" ng-reflect-ng-class="[object Object]"> #f6f7fb </div><div _ngcontent-baj-c2="" class="color-text">basic-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-500 black-color" ng-reflect-klass="color basic-500" ng-reflect-ng-class="[object Object]"> #f2f4f9 </div><div _ngcontent-baj-c2="" class="color-text">basic-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-600 black-color" ng-reflect-klass="color basic-600" ng-reflect-ng-class="[object Object]"> #dfe0e5 </div><div _ngcontent-baj-c2="" class="color-text">basic-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-700 black-color" ng-reflect-klass="color basic-700" ng-reflect-ng-class="[object Object]"> #cecfd4 </div><div _ngcontent-baj-c2="" class="color-text">basic-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-800 black-color" ng-reflect-klass="color basic-800" ng-reflect-ng-class="[object Object]"> #b6b7bb </div><div _ngcontent-baj-c2="" class="color-text">basic-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-900 white-color" ng-reflect-klass="color basic-900" ng-reflect-ng-class="[object Object]"> #919295 </div><div _ngcontent-baj-c2="" class="color-text">basic-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color basic-1000 white-color" ng-reflect-klass="color basic-1000" ng-reflect-ng-class="[object Object]"> #616264 </div><div _ngcontent-baj-c2="" class="color-text">basic-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">light</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-100 black-color" ng-reflect-klass="color light-100" ng-reflect-ng-class="[object Object]"> white </div><div _ngcontent-baj-c2="" class="color-text">light-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-200 black-color" ng-reflect-klass="color light-200" ng-reflect-ng-class="[object Object]"> white </div><div _ngcontent-baj-c2="" class="color-text">light-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-300 black-color" ng-reflect-klass="color light-300" ng-reflect-ng-class="[object Object]"> white </div><div _ngcontent-baj-c2="" class="color-text">light-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-400 black-color" ng-reflect-klass="color light-400" ng-reflect-ng-class="[object Object]"> white </div><div _ngcontent-baj-c2="" class="color-text">light-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-500 black-color" ng-reflect-klass="color light-500" ng-reflect-ng-class="[object Object]"> white </div><div _ngcontent-baj-c2="" class="color-text">light-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-600 black-color" ng-reflect-klass="color light-600" ng-reflect-ng-class="[object Object]"> #ebebeb </div><div _ngcontent-baj-c2="" class="color-text">light-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-700 black-color" ng-reflect-klass="color light-700" ng-reflect-ng-class="[object Object]"> #d9d9d9 </div><div _ngcontent-baj-c2="" class="color-text">light-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-800 black-color" ng-reflect-klass="color light-800" ng-reflect-ng-class="[object Object]"> #bfbfbf </div><div _ngcontent-baj-c2="" class="color-text">light-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-900 white-color" ng-reflect-klass="color light-900" ng-reflect-ng-class="[object Object]"> #999999 </div><div _ngcontent-baj-c2="" class="color-text">light-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color light-1000 white-color" ng-reflect-klass="color light-1000" ng-reflect-ng-class="[object Object]"> #666666 </div><div _ngcontent-baj-c2="" class="color-text">light-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">dark</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-100 black-color" ng-reflect-klass="color dark-100" ng-reflect-ng-class="[object Object]"> #f0f0f0 </div><div _ngcontent-baj-c2="" class="color-text">dark-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-200 black-color" ng-reflect-klass="color dark-200" ng-reflect-ng-class="[object Object]"> #e1e1e1 </div><div _ngcontent-baj-c2="" class="color-text">dark-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-300 black-color" ng-reflect-klass="color dark-300" ng-reflect-ng-class="[object Object]"> #c3c3c3 </div><div _ngcontent-baj-c2="" class="color-text">dark-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-400 black-color" ng-reflect-klass="color dark-400" ng-reflect-ng-class="[object Object]"> #979797 </div><div _ngcontent-baj-c2="" class="color-text">dark-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-500 white-color" ng-reflect-klass="color dark-500" ng-reflect-ng-class="[object Object]"> #6a6a6a </div><div _ngcontent-baj-c2="" class="color-text">dark-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-600 white-color" ng-reflect-klass="color dark-600" ng-reflect-ng-class="[object Object]"> #645f5f </div><div _ngcontent-baj-c2="" class="color-text">dark-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-700 white-color" ng-reflect-klass="color dark-700" ng-reflect-ng-class="[object Object]"> #5d5858 </div><div _ngcontent-baj-c2="" class="color-text">dark-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-800 white-color" ng-reflect-klass="color dark-800" ng-reflect-ng-class="[object Object]"> #524d4d </div><div _ngcontent-baj-c2="" class="color-text">dark-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-900 white-color" ng-reflect-klass="color dark-900" ng-reflect-ng-class="[object Object]"> #413e3e </div><div _ngcontent-baj-c2="" class="color-text">dark-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color dark-1000 white-color" ng-reflect-klass="color dark-1000" ng-reflect-ng-class="[object Object]"> #2c2929 </div><div _ngcontent-baj-c2="" class="color-text">dark-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">gray</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-100 black-color" ng-reflect-klass="color gray-100" ng-reflect-ng-class="[object Object]"> #fafafa </div><div _ngcontent-baj-c2="" class="color-text">gray-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-200 black-color" ng-reflect-klass="color gray-200" ng-reflect-ng-class="[object Object]"> whitesmoke </div><div _ngcontent-baj-c2="" class="color-text">gray-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-300 black-color" ng-reflect-klass="color gray-300" ng-reflect-ng-class="[object Object]"> #ebebeb </div><div _ngcontent-baj-c2="" class="color-text">gray-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-400 black-color" ng-reflect-klass="color gray-400" ng-reflect-ng-class="[object Object]"> #dbdbdb </div><div _ngcontent-baj-c2="" class="color-text">gray-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-500 white-color" ng-reflect-klass="color gray-500" ng-reflect-ng-class="[object Object]"> #cccccc </div><div _ngcontent-baj-c2="" class="color-text">gray-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-600 white-color" ng-reflect-klass="color gray-600" ng-reflect-ng-class="[object Object]"> #bebaba </div><div _ngcontent-baj-c2="" class="color-text">gray-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-700 white-color" ng-reflect-klass="color gray-700" ng-reflect-ng-class="[object Object]"> #afacac </div><div _ngcontent-baj-c2="" class="color-text">gray-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-800 white-color" ng-reflect-klass="color gray-800" ng-reflect-ng-class="[object Object]"> #9b9898 </div><div _ngcontent-baj-c2="" class="color-text">gray-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-900 white-color" ng-reflect-klass="color gray-900" ng-reflect-ng-class="[object Object]"> #7c7979 </div><div _ngcontent-baj-c2="" class="color-text">gray-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color gray-1000 white-color" ng-reflect-klass="color gray-1000" ng-reflect-ng-class="[object Object]"> #525151 </div><div _ngcontent-baj-c2="" class="color-text">gray-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">success</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-100 black-color" ng-reflect-klass="color success-100" ng-reflect-ng-class="[object Object]"> #e6faf2 </div><div _ngcontent-baj-c2="" class="color-text">success-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-200 black-color" ng-reflect-klass="color success-200" ng-reflect-ng-class="[object Object]"> #ccf5e4 </div><div _ngcontent-baj-c2="" class="color-text">success-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-300 black-color" ng-reflect-klass="color success-300" ng-reflect-ng-class="[object Object]"> #99ebc9 </div><div _ngcontent-baj-c2="" class="color-text">success-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-400 black-color" ng-reflect-klass="color success-400" ng-reflect-ng-class="[object Object]"> #4ddba1 </div><div _ngcontent-baj-c2="" class="color-text">success-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-500 white-color" ng-reflect-klass="color success-500" ng-reflect-ng-class="[object Object]"> #01cc78 </div><div _ngcontent-baj-c2="" class="color-text">success-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-600 white-color" ng-reflect-klass="color success-600" ng-reflect-ng-class="[object Object]"> #00bd6e </div><div _ngcontent-baj-c2="" class="color-text">success-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-700 white-color" ng-reflect-klass="color success-700" ng-reflect-ng-class="[object Object]"> #00ae66 </div><div _ngcontent-baj-c2="" class="color-text">success-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-800 white-color" ng-reflect-klass="color success-800" ng-reflect-ng-class="[object Object]"> #009a5a </div><div _ngcontent-baj-c2="" class="color-text">success-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-900 white-color" ng-reflect-klass="color success-900" ng-reflect-ng-class="[object Object]"> #007b48 </div><div _ngcontent-baj-c2="" class="color-text">success-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color success-1000 white-color" ng-reflect-klass="color success-1000" ng-reflect-ng-class="[object Object]"> #005230 </div><div _ngcontent-baj-c2="" class="color-text">success-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">info</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-100 black-color" ng-reflect-klass="color info-100" ng-reflect-ng-class="[object Object]"> #e6f4ff </div><div _ngcontent-baj-c2="" class="color-text">info-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-200 black-color" ng-reflect-klass="color info-200" ng-reflect-ng-class="[object Object]"> #cce9ff </div><div _ngcontent-baj-c2="" class="color-text">info-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-300 black-color" ng-reflect-klass="color info-300" ng-reflect-ng-class="[object Object]"> #99d3ff </div><div _ngcontent-baj-c2="" class="color-text">info-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-400 black-color" ng-reflect-klass="color info-400" ng-reflect-ng-class="[object Object]"> #4db1ff </div><div _ngcontent-baj-c2="" class="color-text">info-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-500 white-color" ng-reflect-klass="color info-500" ng-reflect-ng-class="[object Object]"> #0090ff </div><div _ngcontent-baj-c2="" class="color-text">info-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-600 white-color" ng-reflect-klass="color info-600" ng-reflect-ng-class="[object Object]"> #0084eb </div><div _ngcontent-baj-c2="" class="color-text">info-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-700 white-color" ng-reflect-klass="color info-700" ng-reflect-ng-class="[object Object]"> #007ad9 </div><div _ngcontent-baj-c2="" class="color-text">info-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-800 white-color" ng-reflect-klass="color info-800" ng-reflect-ng-class="[object Object]"> #006cbf </div><div _ngcontent-baj-c2="" class="color-text">info-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-900 white-color" ng-reflect-klass="color info-900" ng-reflect-ng-class="[object Object]"> #005699 </div><div _ngcontent-baj-c2="" class="color-text">info-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color info-1000 white-color" ng-reflect-klass="color info-1000" ng-reflect-ng-class="[object Object]"> #003a66 </div><div _ngcontent-baj-c2="" class="color-text">info-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">warning</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-100 black-color" ng-reflect-klass="color warning-100" ng-reflect-ng-class="[object Object]"> #fef7e8 </div><div _ngcontent-baj-c2="" class="color-text">warning-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-200 black-color" ng-reflect-klass="color warning-200" ng-reflect-ng-class="[object Object]"> #feeed2 </div><div _ngcontent-baj-c2="" class="color-text">warning-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-300 black-color" ng-reflect-klass="color warning-300" ng-reflect-ng-class="[object Object]"> #fcdda4 </div><div _ngcontent-baj-c2="" class="color-text">warning-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-400 black-color" ng-reflect-klass="color warning-400" ng-reflect-ng-class="[object Object]"> #fac460 </div><div _ngcontent-baj-c2="" class="color-text">warning-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-500 white-color" ng-reflect-klass="color warning-500" ng-reflect-ng-class="[object Object]"> #f8aa1c </div><div _ngcontent-baj-c2="" class="color-text">warning-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-600 white-color" ng-reflect-klass="color warning-600" ng-reflect-ng-class="[object Object]"> #e89d16 </div><div _ngcontent-baj-c2="" class="color-text">warning-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-700 white-color" ng-reflect-klass="color warning-700" ng-reflect-ng-class="[object Object]"> #d69114 </div><div _ngcontent-baj-c2="" class="color-text">warning-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-800 white-color" ng-reflect-klass="color warning-800" ng-reflect-ng-class="[object Object]"> #bd8012 </div><div _ngcontent-baj-c2="" class="color-text">warning-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-900 white-color" ng-reflect-klass="color warning-900" ng-reflect-ng-class="[object Object]"> #97670e </div><div _ngcontent-baj-c2="" class="color-text">warning-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color warning-1000 white-color" ng-reflect-klass="color warning-1000" ng-reflect-ng-class="[object Object]"> #65440a </div><div _ngcontent-baj-c2="" class="color-text">warning-1000</div></div></div><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-11 color-names">danger</div><!--bindings={ "ng-reflect-ng-for-of": "100,200,300,400,500,600,700,80" }--><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-100 black-color" ng-reflect-klass="color danger-100" ng-reflect-ng-class="[object Object]"> #ffecee </div><div _ngcontent-baj-c2="" class="color-text">danger-100</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-200 black-color" ng-reflect-klass="color danger-200" ng-reflect-ng-class="[object Object]"> #ffd8dc </div><div _ngcontent-baj-c2="" class="color-text">danger-200</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-300 black-color" ng-reflect-klass="color danger-300" ng-reflect-ng-class="[object Object]"> #ffb2b9 </div><div _ngcontent-baj-c2="" class="color-text">danger-300</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-400 black-color" ng-reflect-klass="color danger-400" ng-reflect-ng-class="[object Object]"> #ff7885 </div><div _ngcontent-baj-c2="" class="color-text">danger-400</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-500 white-color" ng-reflect-klass="color danger-500" ng-reflect-ng-class="[object Object]"> #ff3e51 </div><div _ngcontent-baj-c2="" class="color-text">danger-500</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-600 white-color" ng-reflect-klass="color danger-600" ng-reflect-ng-class="[object Object]"> #eb394b </div><div _ngcontent-baj-c2="" class="color-text">danger-600</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-700 white-color" ng-reflect-klass="color danger-700" ng-reflect-ng-class="[object Object]"> #d93545 </div><div _ngcontent-baj-c2="" class="color-text">danger-700</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-800 white-color" ng-reflect-klass="color danger-800" ng-reflect-ng-class="[object Object]"> #bf2f3d </div><div _ngcontent-baj-c2="" class="color-text">danger-800</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-900 white-color" ng-reflect-klass="color danger-900" ng-reflect-ng-class="[object Object]"> #992531 </div><div _ngcontent-baj-c2="" class="color-text">danger-900</div></div><div _ngcontent-baj-c2="" class="cell split-xs-11"><div _ngcontent-baj-c2="" class="color danger-1000 white-color" ng-reflect-klass="color danger-1000" ng-reflect-ng-class="[object Object]"> #661920 </div><div _ngcontent-baj-c2="" class="color-text">danger-1000</div></div></div></div></div><!----><!--bindings={ "ng-reflect-ng-for-of": "button,input,link,checkbox" }--><div _ngcontent-baj-c2="" class="card"><h2 _ngcontent-baj-c2="">BUTTON</h2><div _ngcontent-baj-c2="" class="container"><div _ngcontent-baj-c2="" class="row title"><div _ngcontent-baj-c2="" class="cell split-xs-12"></div><!--bindings={ "ng-reflect-ng-for-of": "brand,primary,secondary,basic," }--><div _ngcontent-baj-c2="" class="cell split-xs-12"> brand </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> primary </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> secondary </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> basic </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> light </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> dark </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> gray </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> success </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> info </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> warning </div><div _ngcontent-baj-c2="" class="cell split-xs-12"> danger </div></div><!--bindings={ "ng-reflect-ng-for-of": "fill,outline,ghost" }--><!----><!--bindings={ "ng-reflect-ng-if": "brand,primary,secondary,basic,", "ng-reflect-ng-if-else": "[object Object]" }--><!----><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-12">fill</div><!--bindings={ "ng-reflect-ng-for-of": "brand,primary,secondary,basic," }--><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="brand "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="primary "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="secondary "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="basic "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="light "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="dark "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="gray "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" success "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" info "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" warning "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" danger "> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div></div><!----><!----><!--bindings={ "ng-reflect-ng-if": "brand,primary,secondary,basic,", "ng-reflect-ng-if-else": "[object Object]" }--><!----><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-12">outline</div><!--bindings={ "ng-reflect-ng-for-of": "brand,primary,secondary,basic," }--><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="brand outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="primary outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="secondary outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="basic outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="light outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="dark outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="gray outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" success outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" info outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" warning outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class=" danger outline"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div></div><!----><!----><!--bindings={ "ng-reflect-ng-if": "brand,primary,secondary,basic,", "ng-reflect-ng-if-else": "[object Object]" }--><!----><div _ngcontent-baj-c2="" class="row view"><div _ngcontent-baj-c2="" class="cell split-xs-12">ghost</div><!--bindings={ "ng-reflect-ng-for-of": "brand,primary,secondary,basic," }--><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="brand ghost"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="primary ghost"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "true" }--><button _ngcontent-baj-c2="" class="secondary ghost"> BTN </button><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings={ "ng-reflect-ng-if": "false" }--></div><div _ngcontent-baj-c2="" class="cell split-xs-12"><!--bindings={ "ng-reflect-ng-if": "false" }--><!--bindings