index.less 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. @import '../style/var';
  2. .van-toast {
  3. position: fixed;
  4. top: 50%;
  5. left: 50%;
  6. display: flex;
  7. color: @toast-text-color;
  8. max-width: @toast-max-width;
  9. font-size: @toast-font-size;
  10. line-height: @toast-line-height;
  11. border-radius: @toast-border-radius;
  12. word-break: break-all;
  13. align-items: center;
  14. flex-direction: column;
  15. justify-content: center;
  16. box-sizing: content-box;
  17. transform: translate3d(-50%, -50%, 0);
  18. background-color: @toast-background-color;
  19. // hack for avoid max-width when use left & fixed
  20. width: fit-content;
  21. // allow newline charactor
  22. white-space: pre-wrap;
  23. // should not add pointer-events: none directly to body tag
  24. // that will cause unexpected tap-highlight-color in mobile safari
  25. &--unclickable {
  26. * {
  27. pointer-events: none;
  28. }
  29. }
  30. &--text {
  31. padding: @toast-text-padding;
  32. min-width: @toast-text-min-width;
  33. }
  34. &--default {
  35. width: @toast-default-width;
  36. padding: @toast-default-padding;
  37. min-height: @toast-default-min-height;
  38. .van-toast__icon {
  39. font-size: @toast-icon-size;
  40. }
  41. .van-loading {
  42. margin: 10px 0;
  43. }
  44. .van-toast__text {
  45. padding-top: 5px;
  46. }
  47. }
  48. &--top {
  49. top: @toast-position-top-distance;
  50. }
  51. &--bottom {
  52. top: auto;
  53. bottom: @toast-position-bottom-distance;
  54. }
  55. }