How can I apply the density for only one button?
Defining the density in the style in my less file doesn't work:
.smallDiagramButton {
@include mat.button-density(-3);
}
And using it later in the html:
<button mat-raised-button color="primary" class="smallDiagramButton">Text</button>
No matter if I apply the style class the button "size" (density) doesn't change.
But using
@include mat.button-density(-3);
in the global theme.scss the density is applied to ALL buttons in my app - what I doesn't want to.
You need to put the density styles to the parent element, and not the button itself.
Template:
<div class="smallDiagramButtonContainer">
<button mat-raised-button color="primary">Text</button>
</div>
Styles:
.smallDiagramButtonContainer {
@include mat.button-density(-3);
}