| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 | @import './var.less';:root {  --van-nav-bar-height: @nav-bar-height;  --van-nav-bar-background-color: @nav-bar-background-color;  --van-nav-bar-arrow-size: @nav-bar-arrow-size;  --van-nav-bar-icon-color: @nav-bar-icon-color;  --van-nav-bar-text-color: @nav-bar-text-color;  --van-nav-bar-title-font-size: @nav-bar-title-font-size;  --van-nav-bar-title-text-color: @nav-bar-title-text-color;  --van-nav-bar-z-index: @nav-bar-z-index;}.van-nav-bar {  position: relative;  z-index: var(--van-nav-bar-z-index);  line-height: var(--van-line-height-lg);  text-align: center;  background: var(--van-nav-bar-background-color);  user-select: none;  &--fixed {    position: fixed;    top: 0;    left: 0;    width: 100%;  }  &--safe-area-inset-top {    padding-top: constant(safe-area-inset-top);    padding-top: env(safe-area-inset-top);  }  .van-icon {    color: var(--van-nav-bar-icon-color);  }  &__content {    position: relative;    display: flex;    align-items: center;    height: var(--van-nav-bar-height);  }  &__arrow {    margin-right: var(--van-padding-base);    font-size: var(--van-nav-bar-arrow-size);  }  &__title {    max-width: 60%;    margin: 0 auto;    color: var(--van-nav-bar-title-text-color);    font-weight: var(--van-font-weight-bold);    font-size: var(--van-nav-bar-title-font-size);  }  &__left,  &__right {    position: absolute;    top: 0;    bottom: 0;    display: flex;    align-items: center;    padding: 0 var(--van-padding-md);    font-size: var(--van-font-size-md);  }  &__left {    left: 0;  }  &__right {    right: 0;  }  &__text {    color: var(--van-nav-bar-text-color);  }}
 |