date-picker-modal.html

<div class="ionic-datepicker">
  <div class="row no_padding">
    <div class="col col-10 left_arrow">
      <button class="button-clear color_blue" ng-click="prevMonth()"
              ng-class="{'pointer_events_none':(disablePreviousDates && previousDayEpoch > currentMonthFirstDayEpoch)}">
        <i class="icon ion-chevron-left"></i>
      </button>
    </div>
    <div class="col col-80 drop_down">
      <div class="row select_section">
        <div class="col-50">
          <div class="list">
            <label class="item item-input item-select">
              <select ng-model="currentMonth" ng-change="monthChanged(currentMonth)" class="month_select">
                <option value="{{month}}" ng-repeat="month in monthsList" ng-selected="month == currentMonthSelected">
                  {{month}}
                </option>
              </select>
            </label>
          </div>
        </div>
        <div class="col-50">
          <div class="list">
            <label class="item item-input item-select">
              <select ng-model="currentYear" ng-change="yearChanged(currentYear)" class="year_select">
                <option value="{{year}}" ng-repeat="year in yearsList" ng-selected="year == currentYearSelected">
                  {{year}}
                </option>
              </select>
            </label>
          </div>
        </div>
      </div>
    </div>
    <div class="col col-10 right_arrow">
      <button class="button-clear color_blue" ng-click="nextMonth()"
              ng-class="{'pointer_events_none':(disableFutureDates && nextDayEpoch < currentMonthLastDayEpoch)}">
        <i class="icon ion-chevron-right"></i>
      </button>
    </div>
  </div>
  <div class="calendar_grid">
    <div class="row">
      <div class="col" ng-repeat="weekName in weekNames track by $index" style="font-weight: bold"> {{ weekName }}</div>
    </div>
    <div style="height: 180px;">
      <div class="row" ng-repeat="row in rows track by $index" style="text-align: center;">
        <div class="col no_padding" ng-repeat="col in cols track by $index"
             ng-class="{'date_col': (dayList[$parent.$index * numColumns + $index].day != undefined),
      'date_selected': (dayList[$parent.$index * numColumns + $index].dateString === selctedDateStringCopy && dayList[$parent.$index * numColumns + $index].day != undefined) ,
      'today' : (dayList[$parent.$index * numColumns + $index].date == today.date && dayList[$parent.$index * numColumns + $index].month == today.month && dayList[$parent.$index * numColumns + $index].year == today.year)}">
          <div class="date_cell" ng-click="dateSelected(dayList[$parent.$index * numColumns + $index])"
               ng-class="{'pointer_events_none':((disablePreviousDates && previousDayEpoch > dayList[$parent.$index * numColumns + $index].epochLocal) || (disableFutureDates && nextDayEpoch < dayList[$parent.$index * numColumns + $index].epochLocal) || (disabledDates.indexOf(dayList[$parent.$index * numColumns + $index].epochLocal)>-1))}">
            {{ dayList[$parent.$index * numColumns + $index].date }}
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="error_msg" ng-show="date_selection.submitted === true && date_selection.selected === false">Please select
    a
    date.
  </div>
</div>