Open travissimon opened 3 months ago
Hello, I had a loook at the at the stack blitz the problem was that
@mixin my-elevation($zValue) { @include mat-elevation($zValue, $custom-shadow-color, $custom-shadow-opacity); }
changed it to ( changed -, to . ):
@mixin my-elevation($zValue) { @include mat.elevation($zValue, $custom-shadow-color, $custom-shadow-opacity); }
then
applied it to the content div:
.content { @include my-elevation(5); }
then lastly with the button the issue was that the .mat-mdc-raised-button was overriding the elevation shadow with the "default" shadow of the button that is why it wasn't appearing when I attempted at first
then applied it to the content div:
.content { @include my-elevation(5); }
Hi Thabo. The functionality I am trying to figure out is how to change /all/ shadow colours, especially on the default material controls (without having to override each individual style.)
I have seen a screenshot (I think by @benelliott or maybe @mmalerba) where they were able to achieve this, but I haven't been able to replicate it.
Documentation Feedback
The current documentation does not provide sufficient documentation for how to change the shadow colour (possibly more relevant with dark themes).
I have found the original commits for the feature, so I know it is achievable, but I could not find enough documentation to implement it myself. My attempts can be seen at this Stack Blitz.
I'm selfishly just wanting to know how to implement the feature, but I'm also willing to update the documentation if that would be of assistance.
Thank you all for your work - Angular Material is great.
Affected documentation page
https://material.angular.io/guide/elevation#overridable-elevation