/* common styling for modals */
@import '..';

.modal {
  @apply --modal;

  padding: 4rem;
}

.overlay {
  @apply --absolute-fill;

  background-color: rgba(0, 0, 0, 0.8);
}

.clickable {
  @apply --clickable;
}

.modal_contents {
  z-index: 1;
  padding: 1rem;
  background-color: white;
}

.alert_modal_contents {
  @apply --font-body-2-dark;

  padding: 0.5rem 1rem;
}

.alert_modal_heading {
  @apply --font-header-dark;

  margin-bottom: 0.5rem;
}

.alert_modal_buttons {
  float: right;
  margin-top: 1rem;
}

/* common styling for modals */
@import '..';

.modal {
  @apply --modal;

  padding: 4rem;
}

.overlay {
  @apply --absolute-fill;

  background-color: rgba(0, 0, 0, 0.8);
}

.clickable {
  @apply --clickable;
}

.modal_contents {
  z-index: 1;
  width: 100%;
  padding: 1rem;
  background-color: white;
}

.alert_modal_contents {
  @apply --font-body-2-dark;

  padding: 0.5rem 1rem;
}

.alert_modal_heading {
  @apply --font-header-dark;

  margin-bottom: 0.5rem;
}

.alert_modal_buttons {
  float: right;
  margin-top: 1rem;
}

Set width of modal children to 100% by default
refactor(components): Set width of modal children to 100% by default
