<div class="cal-day-box">
<div class="row-fluid clearfix cal-row-head">
  <div class="span1 col-xs-1 cal-cell">Time</div>
  <div class="span11 col-xs-11 cal-cell">Events</div>
</div>


<div class="cal-day-panel" class="clearfix" style="height: 960px;">
<div class="cal-day-panel-hour">

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>06:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>06:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>07:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>07:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>08:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>08:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>09:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>09:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>10:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>10:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>11:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>11:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>12:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>12:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>13:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>13:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>14:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>14:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>15:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>15:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>16:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>16:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>17:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>17:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>18:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>18:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>19:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>19:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>20:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>20:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

<div class="cal-day-hour">

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>21:00</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

  <div class="row-fluid cal-day-hour-part">
    <div class="span1 col-xs-1"><b>21:30</b></div>
    <div class="span11 col-xs-11"></div>
  </div>

</div>

</div>


<div
  class="pull-left day-event day-highlight dh-event-{{ event.type }}"
  ng-repeat="event in view track by $index"
  ng-style="{top: event.top + 'px', left: event.left + 60 + 'px', height: event.height + 'px'}">

  <!--<span class="cal-hours">{{ event.starts_at | date:'d MMM HH:mm' }} - {{ event.ends_at | date:'d MMM HH:mm' }}<br></span>-->
  <a href="javascript:;" class="event-item" ng-click="eventClick({$event: event})">
    <span>{{ event.title | truncateEventTitle:20:event.height }}</span>
  </a>

</div>

</div>

</div>
