CSS конфликт? при использовании sweetalert2 с библиотекой камеры HTML5 - PullRequest
Новая
       27

CSS конфликт? при использовании sweetalert2 с библиотекой камеры HTML5

0 голосов
/ 08 июля 2020

У меня проблема с макетом предупреждений при использовании Sweetalert2 на странице, использующей «библиотеку» камеры HTML5 (https://github.com/kasperkamperman/MobileCameraTemplate). Sweetalert2 отлично работает на других страницах, но на странице, которая делает фотографии, все в диалоге испорчено. Я подозреваю, что это где-то конфликт CSS, но я не могу его найти.

если я использую пример 

    Swal.fire({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  icon: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  confirmButtonText: 'Yes, delete it!'
}).then((result) => {
  if (result.value) {
    Swal.fire(
      'Deleted!',
      'Your file has been deleted.',
      'success'
    )
  }
})

, я получаю кнопки, наложенные

если я использую пример 

const swalWithBootstrapButtons = Swal.mixin({
  customClass: {
    confirmButton: 'btn btn-success',
    cancelButton: 'btn btn-danger'
  },
  buttonsStyling: false
})

swalWithBootstrapButtons.fire({
  title: 'Are you sure?',
  text: "You won't be able to revert this!",
  icon: 'warning',
  showCancelButton: true,
  confirmButtonText: 'Yes, delete it!',
  cancelButtonText: 'No, cancel!',
  reverseButtons: true
}).then((result) => {
  if (result.value) {
    swalWithBootstrapButtons.fire(
      'Deleted!',
      'Your file has been deleted.',
      'success'
    )
  } else if (
    /* Read more about handling dismissals below */
    result.dismiss === Swal.DismissReason.cancel
  ) {
    swalWithBootstrapButtons.fire(
      'Cancelled',
      'Your imaginary file is safe :)',
      'error'
    )
  }
})

я получаю только одну кнопку, без стиля, но не ожидаемого стиля

У кого-нибудь есть идеи?

...