javascript - 如何修复 SweetAlert2 中奇怪的成功和错误图标？

Question

所以一月份 SweetAlert2 100% 正常。成功和错误图标上没有错误。但二月之后，图标看起来很奇怪，动画也很糟糕。

我尝试更新 CDN，因为 2 天前 SweetAlert2 更新了。但问题仍然没有解决。也许你可以帮助我。

---

这是图像:

Success icon error

Error icon error

这是代码。我正在使用 flashdata 来显示警报。

<?php if ($this->session->flashdata('success-reg')): ?>
<script>
Swal.fire({
    icon: 'success',
    title: 'Kamu berhasil daftar!',
    text: 'Silahkan Cek Email Kamu, Buat Verifikasi!',
    showConfirmButton: false,
    timer: 2500
})
</script>
<?php endif;?>

Answer 1

同样的问题:发生这种情况是因为 <span> 的 font-size 属性在文档的其余部分。 在我的例子中，为了解决这个问题，我强制将字体大小更改为 16px 到“创建”成功和错误图标的特定类元素。

• 成功图标:

.swal2-success-line-tip, .swal2-success-line-long {
  font-size: 16px !important;
}

• 对于错误图标:

.swal2-x-mark-line-right, .swal2-x-mark-line-left {
  font-size: 16px !important;
} 

这可能不是最优雅的解决方案，但它确实有效。