JeroenVinke

<template>
  <style>
    .active {
      background-color: red;
    }
  </style>
  
  <ul class="nav navbar-nav">
    <li repeat.for="row of router.navigation" class="${row.isActive ? 'active' : ''}">
      <a data-toggle="collapse" data-target="#skeleton-navigation-navbar-collapse.in" href.bind="row.href">${row.title}</a>

JeroenVinke

<template>
  <ul class="nav navbar-nav">
    <li repeat.for="row of router.navigation" class="${row.isActive ? 'active' : ''}">
      <a data-toggle="collapse" data-target="#skeleton-navigation-navbar-collapse.in" href.bind="row.href">${row.title}</a>
    </li>
  </ul>
  
  <router-view></router-view>
</template>

JeroenVinke

<template>
  <router-view></router-view>
</template>

JeroenVinke

<template>
  <router-view></router-view>
</template>

JeroenVinke

<template>
  <router-view></router-view>
</template>

JeroenVinke

<template>
  <require from="aurelia-kendoui-bridge/dateinput/dateinput"></require>

  <div class="demo-section k-content">
    <h4>Enter a date</h4>
    <input ak-date-input="k-format: MM/dd/yyyy" title="please enter date" style="width: 100%" />
  </div>
</template>

JeroenVinke

<template>
  <require from="aurelia-kendoui-bridge/listbox/listbox"></require>
  <require from="./style.css!css"></require>

  <div class="demo-section k-content">
    <div>
      <label for="optional" id="employees">Employees</label>
      <label for="selected">Developers</label>
      <br />
      

JeroenVinke

<template>
  <require from="aurelia-kendoui-bridge/mediaplayer/mediaplayer"></require>
  
  <div class="demo-section k-content wide" style="max-width: 900px;">
            
    <div id="mediaPlayer" style="height:360px"
            ak-mediaplayer="k-media.bind: { title: 'Recap of Progress', source: 'http://telerik-media.s3.amazonaws.com/digital-factory/digital-factory-720.mp4'};
            k-auto-play.bind: true;
            k-navigatable.bind: true;        
            k-widget.bind:mediaPlayer"></div>

JeroenVinke

.customer-photo {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-size: 32px 35px;
    background-position: center center;
    vertical-align: middle;
    line-height: 32px;
    box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);

JeroenVinke

.customer-photo {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-size: 32px 35px;
    background-position: center center;
    vertical-align: middle;
    line-height: 32px;
    box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);