角材料2 Sidenav阴影

Question

What is the best way to remove the shadow from a sidenav?

Here is a link to what it looks like: Link

Here is my code:

<md-sidenav-container class="windowFullHeight">

    <md-sidenav #start mode="side" opened="{{globalvariablesservice.SidebarValue()}}">
        <papp-sidebar></papp-sidebar>
    </md-sidenav>

    <div class="noMargin">
        <papp-topbar></papp-topbar>
        <!--<papp-calendar-grid></papp-calendar-grid> Broken-->
        <papp-ads class="vAlignBottom"></papp-ads>
    </div>

</md-sidenav-container>

<div class="container">
    <papp-settings></papp-settings>
</div>

Answer 1

The best way to do it is to just find out appropriate .css or .scss file from Angular2-material and selector and change it to desire value.

But I guess, you won't do it. So, other way to do is to target the desire selector and change it accordingly as shown below,

DEMO : https://plnkr.co/edit/K3aWIj8d0n4VGNBoGLDV?p=preview

styles.css

md-sidenav.md-sidenav-opened, md-sidenav.md-sidenav-opening{
  box-shadow: 0 0 0 0 !important;
}