Using mat-grey palette with white and black color

[petervatler]

Bug, feature request, or proposal:

• Pure white and black hue cannot be used while using mat-grey palette.

What is the expected behavior?

• To be able to use pure white and black colors.

What is the current behavior?

It cannot be compiled.

What are the steps to reproduce?

• Use 0 or 1000 as hue parameter while using mat-color with mat-grey palette. It cannot be compiled because: "If this is a value between 0 and 1, it will be treated as opacity."
  Providing a Plunker (or similar) is the best way to get the team to see your issue.
  Plunker template: https://goo.gl/DlHd6U

What is the use-case or motivation for changing an existing behavior?

• These are very basic colors and commonly used and there are cases when these colors should be constant.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

• Tested on 4.x but I think it's a global issue.

Is there anything else we should know?

• None

[willshowell]

Can you show your scss?

[petervatler]

This is a specific theme scss for a re-usable component:

@mixin panel-theme($theme) {
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$warn: map-get($theme, warn);
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
.panel {
    border: none;
    &-heading {
        background: mat-color($mat-grey, 0) !important;
        h4 span {
            color: mat-color($mat-grey, 700);
            border-bottom: 1px solid mat-color($primary, 500);
        }
    }
    &-body {
        background: mat-color($mat-grey, 0);
    }
    &-footer {
        background: mat-color($mat-grey, 100) !important;
    }
}

}

[willshowell]

Oh right. Using mat-color($mat-grey, 0) will result in a 0 opacity of grey's default hue. Definitely a bug.

https://github.com/angular/material2/blob/master/src/lib/core/theming/_theming.scss#L47-L58

I don't see where 1000 would give you the same issue.

[petervatler]

With 1000 it compiles but doesn't work.

[jelbourn]

I'm not sure why the 0 and 1000 values were in that palette to begin with; they're not in the spec.

I'm removing those values in #6605; I'd recommend just using the black and white css colors.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}