angular menu color palettes

[atkins.chrisw]

Is there a way to make the menu background be a lite grey instead of white.
I like it highlighting in lite-blue, but I would like a lite grey backgound as well.

[Jared Wiltshire]

Find the navigation side bar in main.html and change the background color there, try background-100 or background-200
e.g.

<md-content flex role="navigation" md-colors="{background: 'background-100'}">

If you need more control of the color insert something like this in your styles.css

md-content[role=navigation] {
  background-color: lightGrey !important;
}

[atkins.chrisw]

Thanks Jared, that worked great!!!

Is there a way I could have the background image i am using on the index page, stretch out behind the side navigation bar.

[Jared Wiltshire]

You could try setting the background on the body element then making the side navigation bar background color transparent or semi transparent (opacity).

[atkins.chrisw]

Jared. I did this.

main.css
html {
font-size: 62.5%;
line-height: 1.4;
}

body {
font-size: 1.6rem;
background-image: url(/modules/dashboards/web/vitalimages/vitalicons/Test3.jpg);

}

I don't know where to set it up for the sidenav to be transparent. Do I still try this in the index.html, or do I move to the main.html page?

[Jared Wiltshire]

@atkins.chrisw
Add some CSS to your styles file which sets background-color: transparent; on the sidenav element (you may need to add !important as the sidenav may have inline styles I think). Or add md-colors="{background: 'background-A100-0.0'}" to the sidenav element.