<div class="content scroll">
  <table class="directions-table">
    <tr ng-repeat="item in directions.list">
      <td class="direction-sign">
        <span class="glyphicon" ng-class="directions.getTurnIconName(item.directions.turn)"></span>
      </td>
      <td class="direction" ng-style="{'border-right': '10px solid ' + directions.getLineColor(item.lastModified)}">
        <h3 class="direction-instruction">{{ ::item.directions.text }} <span ng-if="item.turnamenity">at {{ ::item.turnamenity.tags.name }}</span>
          <span class="glyphicon" ng-class="directions.getFlagIconName(key, value)"
            ng-repeat="(key, value) in item.flags">
          </span>
          <span ng-if="item.directions.warnings" ng-repeat="warning in item.directions.warnings">
            <img width="20px" height="20px" ng-src="{{ ::warning }}" />
          </span>
          <span ng-if="item.directions.features" ng-repeat="feature in item.directions.features">
            <img width="20px" height="20px" ng-src="{{ ::feature }}" />
          </span>
        </h3>
        <div class="direction-description"
          ng-if="item.directions.distanceMeters">{{ ::item.directions.distanceMeters | distance }}</div>
      </td>
    </tr>
  </table>
<div>

<div class="content scroll">
  <table class="directions-table">
    <tr ng-repeat="item in directions.list">
      <td class="direction-sign">
        <span class="glyphicon" ng-class="directions.getTurnIconName(item.directions.turn)"></span>
      </td>
      <td class="direction" ng-style="{'border-right': '10px solid ' + directions.getLineColor(item.lastModified, item.directions.warnings.length)}">
        <h3 class="direction-instruction">{{ ::item.directions.text }} <span ng-if="item.turnamenity">at {{ ::item.turnamenity.tags.name }}</span>
          <span class="glyphicon" ng-class="directions.getFlagIconName(key, value)"
            ng-repeat="(key, value) in item.flags">
          </span>
          <span ng-if="item.directions.warnings" ng-repeat="warning in item.directions.warnings">
            <img width="20px" height="20px" ng-src="{{ ::warning }}" />
          </span>
          <span ng-if="item.directions.features" ng-repeat="feature in item.directions.features">
            <img width="20px" height="20px" ng-src="{{ ::feature }}" />
          </span>
        </h3>
        <div class="direction-description"
          ng-if="item.directions.distanceMeters">{{ ::item.directions.distanceMeters | distance }}</div>
      </td>
    </tr>
  </table>
<div>

Fix directions side bar line color to match new legend
Fix directions side bar line color to match new legend
