UNPKG

@nutui/nutui-react-taro

Version:

京东风格的轻量级移动端 React 组件库,支持一套代码生成 H5 和小程序

127 lines (126 loc) 2.34 kB
/* #ifdef harmony */ /* #endif */ /* #ifndef harmony */ /* #endif */ .nut-elevator { width: 100%; display: block; position: relative; overflow: hidden; } .nut-elevator-list { display: block; position: relative; top: 0; overflow: hidden; font-size: 12px; color: #1a1a1a; } .nut-elevator-list-inner { height: 100%; width: 100%; display: block; background-color: #ffffff; overflow: auto; } .nut-elevator-list-item { display: block; } .nut-elevator-list-item-code { display: flex; position: relative; height: 35px; line-height: 35px; font-size: 14px; color: #1a1a1a; padding: 0 20px; font-weight: 600; box-sizing: border-box; border-bottom: 1px solid rgba(0, 0, 0, 0.06); background-color: inherit; } .nut-elevator-list-item-name { display: flex; align-items: center; padding: 0 20px; height: 30px; line-height: 30px; } .nut-elevator-list-item-name-highcolor { color: #ff0f23; } .nut-elevator-list-fixed { display: flex; align-items: center; width: 100%; position: absolute; top: 0; left: 0; z-index: 1; padding: 0 20px; height: 35px; background-color: #ffffff; box-sizing: border-box; box-shadow: 0 0 10px #eee; } .nut-elevator-list-fixed-title { font-size: 14px; color: #ff0f23; font-weight: 600; } .nut-elevator-code-current { position: absolute; right: 60px; top: 50%; transform: translateY(-50%); width: 45px; height: 45px; line-height: 45px; border-radius: 50%; background: #fff; box-shadow: 0 3px 3px 1px rgb(240, 240, 240); text-align: center; } .nut-elevator-bars { position: absolute; right: 10px; top: 50%; color: #888b94; font-size: 12px; transform: translateY(-50%); padding: 15px 0; background-color: #f2f3f5; border-radius: 6px; text-align: center; z-index: 1; } .nut-elevator-bars-inner-item { display: block; padding: 3px; cursor: pointer; } .nut-elevator-bars-inner-item-active { font-weight: 600; color: #ff0f23; } [dir=rtl] .nut-elevator-list-fixed, .nut-rtl .nut-elevator-list-fixed { left: auto; right: 0; } [dir=rtl] .nut-elevator-code-current { right: auto; left: 60px; } .nut-rtl .nut-elevator-code-current { right: auto; left: 60px; } [dir=rtl] .nut-elevator-bars { right: auto; left: 10px; } .nut-rtl .nut-elevator-bars { right: auto; left: 10px; }