index.less 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. @import './var.less';
  2. :root {
  3. --van-nav-bar-height: @nav-bar-height;
  4. --van-nav-bar-background-color: @nav-bar-background-color;
  5. --van-nav-bar-arrow-size: @nav-bar-arrow-size;
  6. --van-nav-bar-icon-color: @nav-bar-icon-color;
  7. --van-nav-bar-text-color: @nav-bar-text-color;
  8. --van-nav-bar-title-font-size: @nav-bar-title-font-size;
  9. --van-nav-bar-title-text-color: @nav-bar-title-text-color;
  10. --van-nav-bar-z-index: @nav-bar-z-index;
  11. }
  12. .van-nav-bar {
  13. position: relative;
  14. z-index: var(--van-nav-bar-z-index);
  15. line-height: var(--van-line-height-lg);
  16. text-align: center;
  17. background: var(--van-nav-bar-background-color);
  18. user-select: none;
  19. &--fixed {
  20. position: fixed;
  21. top: 0;
  22. left: 0;
  23. width: 100%;
  24. }
  25. &--safe-area-inset-top {
  26. padding-top: constant(safe-area-inset-top);
  27. padding-top: env(safe-area-inset-top);
  28. }
  29. .van-icon {
  30. color: var(--van-nav-bar-icon-color);
  31. }
  32. &__content {
  33. position: relative;
  34. display: flex;
  35. align-items: center;
  36. height: var(--van-nav-bar-height);
  37. }
  38. &__arrow {
  39. margin-right: var(--van-padding-base);
  40. font-size: var(--van-nav-bar-arrow-size);
  41. }
  42. &__title {
  43. max-width: 60%;
  44. margin: 0 auto;
  45. color: var(--van-nav-bar-title-text-color);
  46. font-weight: var(--van-font-weight-bold);
  47. font-size: var(--van-nav-bar-title-font-size);
  48. }
  49. &__left,
  50. &__right {
  51. position: absolute;
  52. top: 0;
  53. bottom: 0;
  54. display: flex;
  55. align-items: center;
  56. padding: 0 var(--van-padding-md);
  57. font-size: var(--van-font-size-md);
  58. }
  59. &__left {
  60. left: 0;
  61. }
  62. &__right {
  63. right: 0;
  64. }
  65. &__text {
  66. color: var(--van-nav-bar-text-color);
  67. }
  68. }