@mijadesign/mjui-react-taro
Version:
京东风格的轻量级移动端 React 组件库,支持一套代码生成 H5 和小程序
2 lines (1 loc) • 2.07 kB
CSS
.nut-navbar{width:var(--nutui-navbar-width, 100%);position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;height:var(--nutui-navbar-height, 44px);box-sizing:border-box;background:var(--nutui-navbar-background, #ffffff);box-shadow:var(--nutui-navbar-box-shadow, 0 0 transparent);font-size:var(--nutui-navbar-font-size, var(--nutui-font-size-2, 15px));color:var(--nutui-navbar-color, var(--nutui-color-title, #0d0d0d));overflow:hidden;padding:0 16px}.nut-navbar-fixed{position:fixed;top:0;left:0;right:0;width:100%}.nut-navbar-placeholder{display:inline-block;width:100%}.nut-navbar-safe-area-inset-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.nut-navbar-title-wrapper{justify-content:space-between}.nut-navbar-title{height:100%;text-align:center;display:flex;flex:1;flex-direction:row;align-items:center;font-size:var(--nutui-navbar-title-font-size, var(--nutui-font-size-2, 15px));font-weight:var(--nutui-navbar-title-font-weight, var(--nutui-font-weight-bold, 700));color:var(--nutui-navbar-title-font-color, var(--nutui-color-title, #0d0d0d))}.nut-navbar-title-center{max-width:129px;justify-content:center}.nut-navbar-title ::-webkit-scrollbar{display:none}.nut-navbar-left,.nut-navbar-right{display:flex;align-items:center;flex-direction:row;max-width:124px;height:100%;cursor:pointer}.nut-navbar-left .nut-icon,.nut-navbar-left .nutui-iconfont,.nut-navbar-right .nut-icon,.nut-navbar-right .nutui-iconfont{width:20px;height:20px;font-size:20px}.nut-navbar-left-maxwidth,.nut-navbar-right-maxwidth{box-sizing:border-box;width:108px}.nut-navbar-left{padding-right:16px;gap:16px}.nut-navbar-left-rtl{padding-right:0;padding-left:16px}.nut-navbar-left-back{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:16px}.nut-navbar-left-hidden{padding-left:0;padding-right:0}.nut-navbar-right{padding-left:16px;justify-content:flex-end;gap:16px}.nut-navbar-right-rtl{padding-right:16px;padding-left:0}.nut-navbar-rtl .nut-icon-ArrowLeft{transform:rotateY(180deg)}