title: angular material 7 cdkoverlay set transparent/custom backdrop class
body: <p>I am using the cdkoverlay which seems to have a default dark backdrop. Looking at the docs <a href="https://material.angular.io/cdk/overlay/api#CdkConnectedOverlay" rel="nofollow noreferrer">Overlay Documentation</a> , I should be able to change to a transparent backdrop by setting the backdrop class. Am I doing something wrong?</p>
  
  <p>angular version - 7.2.7<br>
  cdk version - 7.3.3</p>
  
  <pre><code>&lt;button mat-icon-button (click)="isOpen = !isOpen" cdkOverlayOrigin 
          #trigger="cdkOverlayOrigin"&gt;
    &lt;mat-icon&gt;opacity&lt;/mat-icon&gt;
  &lt;/button&gt;
  
  &lt;ng-template cdkConnectedOverlay 
          [cdkConnectedOverlayHasBackdrop]="true"
          [cdkConnectedOverlayBackdropClass]="cdk-overlay-transparent-backdrop"   
          (backdropClick)="isOpen = false" 
          [cdkConnectedOverlayOrigin]="trigger" 
          [cdkConnectedOverlayOpen]="isOpen"&gt;
  
      &lt;div class="e6-menu-panel" role="dialog"&gt;
      &lt;div class="e6-grid-container" role="listbox" tabindex="0" cdkTrapFocus&gt;
      &lt;div class="e6-grid-item" *ngFor="let theme of themes; index as i"
          (click)="install(theme); isOpen=false" role="option"
          [style.background-color]="theme.primary"&gt;
  
          &lt;mat-icon class="e6-active-icon" *ngIf="current == theme"&gt;
            check_circle
          &lt;/mat-icon&gt;
      &lt;/div&gt;
      &lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/ng-template&gt;
  </code></pre>