_dialog-legacy-padding.scss 1.1 KB

12345678910111213141516171819202122232425262728293031
  1. // Legacy padding for the dialog. Copied from the non-MDC dialog styles.
  2. $legacy-padding: 24px !default;
  3. /// Mixin that applies creates styles for MDC-based dialog's to have legacy outer
  4. /// padding. By default, the dialog does not have any padding. The individual directives
  5. /// such as `matDialogContent`, `matDialogActions` or `matDialogTitle` set the padding.
  6. @mixin legacy-padding() {
  7. // Sets the outer padding for the projected dialog user-content.
  8. .mat-mdc-dialog-surface {
  9. padding: $legacy-padding;
  10. }
  11. // Updates the MDC title, content and action elements to account for the legacy outer
  12. // padding. The elements will be shifted so that they behave as if there is no margin.
  13. // This allows us to still rely on MDC's dialog spacing while maintaining a default outer
  14. // padding for backwards compatibility.
  15. .mat-mdc-dialog-container {
  16. .mat-mdc-dialog-title {
  17. margin-top: -$legacy-padding;
  18. }
  19. .mat-mdc-dialog-actions {
  20. margin-bottom: -$legacy-padding;
  21. }
  22. .mat-mdc-dialog-title, .mat-mdc-dialog-content, .mat-mdc-dialog-actions {
  23. margin-left: -$legacy-padding;
  24. margin-right: -$legacy-padding;
  25. }
  26. }
  27. }