title: customize the mat-calendar, remove month label
body: <p>I am trying to remove the month label from angular material mat-calendar.
  Here is the stackblitz link</p>
  
  <p><a href="https://stackblitz.com/edit/am-all-imports-mviy6e?file=styles.scss" rel="noreferrer">https://stackblitz.com/edit/am-all-imports-mviy6e?file=styles.scss</a></p>
  
  <pre><code>  &lt;mat-calendar [dateClass]="dateClass()" [selected]="selectedDate" (selectedChange)="onSelect($event)"&gt;&lt;/mat-calendar&gt;
  
  
  onSelect(event){
      console.log(event);
      this.selectedDate = event;
    }
  
    dateClass() {
      return (date: Date): MatCalendarCellCssClasses =&gt; {
        const highlightDate = this.datesToHighlight
          .map(strDate =&gt; new Date(strDate))
          .some(d =&gt; d.getDate() === date.getDate() &amp;&amp; d.getMonth() === date.getMonth() &amp;&amp; d.getFullYear() === date.getFullYear());
  
        return highlightDate ? 'special-date' : '';
      };
  </code></pre>
  
  <p>}</p>
  
  <p>For css:-</p>
  
  <pre><code>.mat-calendar-body-label{
     display: none;
    }
  </code></pre>
  
  <p>If i use above css code then, it move the calendar dates from left to right and make calendar distorted.</p>
  
  <p>if I use this:-</p>
  
  <pre><code>.mat-calendar-body-label{
    opacity: 0;
    }
  </code></pre>
  
  <p>then it will leave empty row if there is no date</p>