angular / angular/components

Proposal: remove background-color from .mat-drawer-container

Open
#7,536 13 comments 37 reactions 0 assignees View on GitHub
area: material/sidenav P3
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

#### Bug, feature request, or proposal:
Proposal: remove `background-color` from `.mat-drawer-container`

#### What is the expected behavior?
The common background that I've set in my app appears on a page with a drawer

#### What is the current behavior?
Putting a drawer on a page requires putting the page contents inside `md-drawer-container` which comes with `background-color` set that overrides any app background that's been set.

#### What are the steps to reproduce?
Add a drawer to a page with a non-standard background

#### What is the use-case or motivation for changing an existing behavior?
Overlays for drawers and sliders are typically supposed to block the majority of the UI. IMHO material shouldn't be providing a background-color for this majority.

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
2.0.0-beta.10

#### Is there anything else we should know?

Contributor guide

Open the contributing guide

Research direction

Start by searching the Angular Material styles for `.mat-drawer-container` and the `md-drawer-container` component entry point, then reproduce the issue with a non-standard app background and a drawer. Done means the app background remains visible behind drawer-page content without breaking drawer behavior, with relevant tests updated or added if that area has coverage.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.