framework7/components/dialog/dialog-ios.less

Full featured mobile HTML framework for building iOS & Android apps

.ios {
  .dialog {
    box-shadow: var(--f7-glass-shadow);
    .ios-glass-backdrop();
    border-radius: var(--f7-dialog-border-radius);
    &.modal-out {
      transform: translate3d(0, -50%, 0) scale(1);
    }
  }
  .dialog-inner {
    border-radius: var(--f7-dialog-border-radius) var(--f7-dialog-border-radius) 0 0;
  }
  .dialog-title {
    + .dialog-text {
      margin-top: 12px;
    }
  }
  .dialog-buttons {
    padding: 0 14px 14px 14px;
    justify-content: center;
    gap: 8px;
  }
  .dialog-button {
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
  }

  .dialog-no-buttons {
    .dialog-inner {
      border-radius: var(--f7-dialog-border-radius);
    }
  }
  // Inputs
  .dialog-input-field {
    margin-top: 15px;
  }
  .dialog-input {
    padding: 0 12px;
    + .dialog-input {
      margin-top: 12px;
    }
  }
  .dialog-input-double {
    + .dialog-input-double {
      margin-top: 0;
      .dialog-input {
        border-top: 0;
        margin-top: 0;
      }
    }
  }

  // Preloader
  .dialog-preloader {
    text-align: center;
    .dialog-title ~ .preloader,
    .dialog-text ~ .preloader {
      margin-top: 15px;
    }
  }
  .dialog-progress {
    .dialog-title ~ .progressbar,
    .dialog-text ~ .progressbar,
    .dialog-title ~ .progressbar-infinite,
    .dialog-text ~ .progressbar-infinite {
      margin-top: 15px;
    }
  }
}