Haz todo lo posible por comprender el código bien antes de utilizarlo a tu trabajo si tdeseas aportar algo puedes dejarlo en la sección de comentarios.
Solución:
En vez de /deep/
Deberías usar ::ng-deep
, que es un alias proporcionado por angular. Apoyo para /deep/
etc. ya se eliminó del navegador Chrome. Entonces, en tu ejemplo, eso sería:
::ng-deep .parametersPanel .mat-expansion-panel-body
padding: 0;
En tus style.css
o el estilo de sus componentes, debe agregar el siguiente css:
/deep/ .parametersPanel .mat-expansion-panel-body
padding: 0;
Esto se debe a la encapsulación de vistas. Puede leer más sobre esto aquí: https://angular.io/guide/component-styles
Actualizar:
El uso de /deep/
, ::ng-deep
para modificar los estilos de los componentes de material ha quedado obsoleto. Ver este enlace.
Sin embargo, usando @angular/core
^6.1.0
y @angular/material
^6.4.6
Pude cambiar el estilo del panel de Expansión de Angular Material sin tener que agregar nada específico. Parece que ahora puede simplemente cambiar el estilo en el archivo css de sus componentes. Así que esto debería funcionar:
.mat-expansion-panel-body
padding: 0;
Puede leer aquí para obtener más información sobre la desaprobación de /deep/
, ::ng-deep
aquí.
Esto funciona al 100%.
Agregue esto dentro de su estilo.css:
.mat-expansion-panel-content > .mat-expansion-panel-body
padding: 0 !important;