AngularJS bootstrap datepicker - day in week issue

Question

I am using AngularJS bootstrap datepicker. I am trying to format the "day in week" to show only the first letter, not three. Here is a screenshot of the calendar: http://imgur.com/YJlUGs6 I only managed to make it show the entire word, or the first three letters.
HTML:

<input type="text" name="sell_date_start" id="sell_date_start" class="form-control" datepicker-popup='MM/dd/yyyy' ng-model="dt1" is-open="opened1" min-date="minDate" close-text="Close" ng-click="open($event,'opened1')" readonly />

JS:

    .config(function (datepickerConfig, datepickerPopupConfig) {
        datepickerConfig.formatDayHeader = 'EEE';
    });

Answer 1

It uses Angular's date filters: https://docs.angularjs.org/api/ng/filter/date

Unfortunately, there is no option there for a single letter 'day in week.'

You could potentially provide your own template for the datepicker that adds an additional filter to limitTo one character.

Answer 2

You can also use CSS to display only the first letter of the 3 letter string.

For example the following HTML:

<div class="day-of-the-week">
    Sun
</div>

Could be styled as such with CSS:

div.day-of-the-week {
    font-size: 0;
}

div.day-of-the-week:first-letter {
    font-size: 14px;
}

Please note that the :first-letter psuedo selector only applies to block level elements.

See more about this selector here: http://www.w3schools.com/cssref/sel_firstletter.asp