base.less 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. /**
  2. * Entry of basic styles
  3. */
  4. @import './var.less';
  5. @import './css-variables.less';
  6. @import './normalize.less';
  7. @import './animation.less';
  8. @import './mixins/clearfix.less';
  9. @import './mixins/ellipsis.less';
  10. @import './mixins/hairline.less';
  11. .van-clearfix {
  12. .clearfix();
  13. }
  14. .van-ellipsis {
  15. .ellipsis();
  16. }
  17. .van-multi-ellipsis--l2 {
  18. .multi-ellipsis(2);
  19. }
  20. .van-multi-ellipsis--l3 {
  21. .multi-ellipsis(3);
  22. }
  23. .van-safe-area-top {
  24. padding-top: constant(safe-area-inset-top);
  25. padding-top: env(safe-area-inset-top);
  26. }
  27. .van-safe-area-bottom {
  28. padding-bottom: constant(safe-area-inset-bottom);
  29. padding-bottom: env(safe-area-inset-bottom);
  30. }
  31. .van-haptics-feedback {
  32. cursor: pointer;
  33. &:active {
  34. opacity: var(--van-active-opacity);
  35. }
  36. }
  37. [class*='van-hairline'] {
  38. &::after {
  39. .hairline();
  40. }
  41. }
  42. .van-hairline {
  43. &,
  44. &--top,
  45. &--left,
  46. &--right,
  47. &--bottom,
  48. &--surround,
  49. &--top-bottom {
  50. position: relative;
  51. }
  52. &--top::after {
  53. border-top-width: @border-width-base;
  54. }
  55. &--left::after {
  56. border-left-width: @border-width-base;
  57. }
  58. &--right::after {
  59. border-right-width: @border-width-base;
  60. }
  61. &--bottom::after {
  62. border-bottom-width: @border-width-base;
  63. }
  64. &,
  65. &-unset {
  66. &--top-bottom::after {
  67. border-width: @border-width-base 0;
  68. }
  69. }
  70. &--surround::after {
  71. border-width: @border-width-base;
  72. }
  73. }