_modal.scss 960 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. @mixin expand-modal-fullscreen($hasModalHeader: true, $hasModalFooter: true, $margin: 1rem) {
  2. // full-screen modal
  3. width: auto;
  4. max-width: unset !important;
  5. height: calc(100vh - $margin * 2);
  6. margin: $margin !important;
  7. .modal-content {
  8. height: calc(100vh - $margin * 2);
  9. }
  10. .modal-body {
  11. padding: $margin;
  12. }
  13. // expand .modal-body (with calculating height)
  14. .modal-body {
  15. $modal-header: 54px;
  16. $modal-footer: 46px;
  17. $margin-body: 0;
  18. @if $hasModalHeader {
  19. $margin-body: $margin-body + $modal-header;
  20. }
  21. @if $hasModalFooter {
  22. $margin-body: $margin-body + $modal-footer;
  23. }
  24. height: calc(100% - #{$margin-body});
  25. }
  26. }
  27. // expanded window layout
  28. .modal-dialog.grw-modal-expanded {
  29. @include expand-modal-fullscreen(true, true);
  30. }
  31. // expanded window layout without modal-header & modal-footer
  32. .modal-dialog.grw-body-only-modal-expanded {
  33. @include expand-modal-fullscreen(false, false);
  34. }