@gravity-ui/uikit/build/cjs/components/Modal/Modal.css

Gravity UI base styling and components

.g-modal {
  display: block;
  visibility: visible;
  margin: 0;
  position: fixed;
  inset: 0;
  z-index: 1000;
  outline: none;
  background-color: var(--g-color-sfx-veil);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  transition-property: opacity;
  transition-timing-function: ease-out;
  transition-duration: 150ms;
}
.g-modal[data-floating-ui-status=unmounted] {
  display: none;
  visibility: hidden;
  margin: -9999px 0 0 -9999px;
}
.g-modal__content-aligner {
  min-width: 100%;
  min-height: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.g-modal__content-wrapper {
  margin: var(--g-modal-margin, 20px);
  border-radius: var(--g-modal-border-radius, 5px);
  overflow-x: hidden;
}
.g-modal__content {
  height: var(--g-modal-height, auto);
  width: var(--g-modal-width, auto);
  background-color: var(--g-color-base-modal);
  border-radius: var(--g-modal-border-radius, 5px);
  outline: none;
  transition: height 0.35s ease-in-out, transform 0.15s ease-out;
}
.g-modal__content_has-scroll {
  overflow-y: auto;
  max-height: calc(100vh - var(--g-modal-margin, 20px) * 2);
}
.g-modal[data-floating-ui-status=initial], .g-modal[data-floating-ui-status=close] {
  opacity: 0;
}
.g-modal[data-floating-ui-status=open] {
  opacity: 1;
}
.g-modal[data-floating-ui-status=initial] .g-modal__content {
  transform: scale(0.75);
}