mp-common/common-filter-components/lane-search/lane-search.component.html

This is XPO MarketPlace common libary

<div class="xpo-filter-wrapper">
  <div class="xpo-bold">lane search</div>
  <div class="xpo-flex-grid">
    <div class="status-icon">
      <xpo-icon class="origin-stop-marker">status-delivered</xpo-icon>
      <div class="status-line"></div>
    </div>
    <div class="lane-input-container">
      <div class="lane-input">
        <xpo-input-container>
          <input xpoInput id="origin" placeholder="Origin" (change)="onChangeLaneFilter()" [(ngModel)]="filter.origin">
        </xpo-input-container>
        <xpo-input-container>
          <input xpoInput id="origin-dead-head" placeholder="Deadhead" (change)="onChangeLaneFilter()" [(ngModel)]="filter.laneOriginDeadHead">
        </xpo-input-container>
      </div>
    </div>
    <div class="lane-switch">
      <xpo-icon class="lane-switch-icon" (click)="swapOriginDest()">lane-switch-hor</xpo-icon>
    </div>
  </div>
  <div class="xpo-flex-grid">
    <div class="status-icon">
      <xpo-icon class="destination-stop-marker">status-delivered</xpo-icon>
    </div>
    <div class="lane-input-container">
      <div class="lane-input">
        <xpo-input-container>
          <input xpoInput id="destination" placeholder="Destination" (change)="onChangeLaneFilter()" [(ngModel)]="filter.destination">
        </xpo-input-container>
        <xpo-input-container>
          <input xpoInput id="destination-dead-head" placeholder="Deadhead" (change)="onChangeLaneFilter()" [(ngModel)]="filter.laneDestDeadHead">
        </xpo-input-container>
      </div>
    </div>
    <div class="lane-switch">
    </div>
  </div>
</div>