UNPKG

@beeapi/nutui

Version:

一套轻量级移动端Vue组件库

5 lines 5.03 kB
/*! * @beeapi/nutui v2.2.10 - menu.css, 451ed2404bee284b891e, Sat Dec 19 2020 12:06:10 GMT+0800 (中国标准时间) * (c) 2017-2020 JDC * Released under the MIT License. */.nut-menu .nut-menu-mask{position:fixed;z-index:9998;top:0;right:0;left:0;bottom:0;background-color:rgba(0,0,0,.5)}.nut-menu .nut-menu-panel{display:block;width:100%;position:absolute;left:0;color:#2d2d2d;overflow:hidden;background-color:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-overflow-scrolling:touch;z-index:9998}.nut-menu .nut-menu-panel .menu-multiple-style1 ul,.nut-menu .nut-menu-panel .menu-multiple-style2 ul,.nut-menu .nut-menu-panel .menu-multiple-style3 ul,.nut-menu .nut-menu-panel .menu-simple ul{position:relative;padding:0;margin:0;min-height:200px;max-height:300px;list-style:none;overflow-y:auto}.nut-menu .nut-menu-panel .menu-multiple-style1 ul li,.nut-menu .nut-menu-panel .menu-multiple-style2 ul li,.nut-menu .nut-menu-panel .menu-multiple-style3 ul li,.nut-menu .nut-menu-panel .menu-simple ul li{position:relative;width:100%;height:45px;line-height:45px;padding:0 0 0 10px;font-size:14px;-webkit-box-sizing:border-box;box-sizing:border-box;white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis}.nut-menu .nut-menu-panel .menu-multiple-style1 ul li.selected,.nut-menu .nut-menu-panel .menu-multiple-style2 ul li.selected,.nut-menu .nut-menu-panel .menu-multiple-style3 ul li.selected,.nut-menu .nut-menu-panel .menu-simple ul li.selected{color:#f0250f}.nut-menu .nut-menu-panel .menu-multiple-style1 ul li:before,.nut-menu .nut-menu-panel .menu-multiple-style2 ul li:before,.nut-menu .nut-menu-panel .menu-multiple-style3 ul li:before,.nut-menu .nut-menu-panel .menu-simple ul li:before{content:" ";height:1px;position:absolute;left:0;right:0;bottom:0;z-index:1;pointer-events:none;background-color:#e5e5e5;-webkit-transform:scaleY(.5);-ms-transform:scaleY(.5);transform:scaleY(.5);-webkit-transform-origin:50% 100%;-ms-transform-origin:50% 100%;transform-origin:50% 100%}.nut-menu .nut-menu-panel .menu-multiple-style1 ul li.col2,.nut-menu .nut-menu-panel .menu-multiple-style2 ul li.col2,.nut-menu .nut-menu-panel .menu-multiple-style3 ul li.col2,.nut-menu .nut-menu-panel .menu-simple ul li.col2{float:left;width:50%}.nut-menu .nut-menu-panel .menu-multiple-style1 ul li.col2:nth-child(2n):after,.nut-menu .nut-menu-panel .menu-multiple-style2 ul li.col2:nth-child(2n):after,.nut-menu .nut-menu-panel .menu-multiple-style3 ul li.col2:nth-child(2n):after,.nut-menu .nut-menu-panel .menu-simple ul li.col2:nth-child(2n):after{content:" ";position:absolute;z-index:1;pointer-events:none;background-color:#e5e5e5;width:1px;left:0;top:13px;bottom:13px;-webkit-transform:scaleX(.5);-ms-transform:scaleX(.5);transform:scaleX(.5);-webkit-transform-origin:0 50%;-ms-transform-origin:0 50%;transform-origin:0 50%}.nut-menu .nut-menu-panel .menu-multiple-style1 ul li.col3,.nut-menu .nut-menu-panel .menu-multiple-style2 ul li.col3,.nut-menu .nut-menu-panel .menu-multiple-style3 ul li.col3,.nut-menu .nut-menu-panel .menu-simple ul li.col3{float:left;width:33.33%}.nut-menu .nut-menu-panel .menu-multiple-style1 ul li.col3:not(:nth-child(3n+1)):after,.nut-menu .nut-menu-panel .menu-multiple-style2 ul li.col3:not(:nth-child(3n+1)):after,.nut-menu .nut-menu-panel .menu-multiple-style3 ul li.col3:not(:nth-child(3n+1)):after,.nut-menu .nut-menu-panel .menu-simple ul li.col3:not(:nth-child(3n+1)):after{content:" ";position:absolute;z-index:1;pointer-events:none;background-color:#e5e5e5;width:1px;left:0;top:13px;bottom:13px;-webkit-transform:scaleX(.5);-ms-transform:scaleX(.5);transform:scaleX(.5);-webkit-transform-origin:0 50%;-ms-transform-origin:0 50%;transform-origin:0 50%}.nut-menu .nut-menu-panel .menu-multiple-style1 .nut-buttongroup .nut-button,.nut-menu .nut-menu-panel .menu-multiple-style2 .nut-buttongroup .nut-button,.nut-menu .nut-menu-panel .menu-multiple-style3 .nut-buttongroup .nut-button,.nut-menu .nut-menu-panel .menu-simple .nut-buttongroup .nut-button{-webkit-appearance:none}.nut-menu .nut-menu-panel .menu-simple li.selected span{position:absolute;top:10px;right:10px}.nut-menu .nut-menu-panel .menu-multiple-style1 li .nut-checkbox{margin-right:10px;vertical-align:middle}.nut-menu .nut-menu-panel .menu-multiple-style1 li label{vertical-align:middle}.nut-menu .nut-menu-panel .menu-multiple-style2 ul li{padding:0 10px;margin-bottom:10px;text-align:center;-webkit-border-radius:4px;border-radius:4px}.nut-menu .nut-menu-panel .menu-multiple-style2 ul li:before{height:0!important}.nut-menu .nut-menu-panel .menu-multiple-style2 ul li.selected a{background-color:#fdf0f0;color:#f0250f}.nut-menu .nut-menu-panel .menu-multiple-style2 ul li a{display:inline-block;width:100%;height:100%;color:#2d2d2d;text-decoration:none;background-color:#f6f6f6}.nut-menu .nut-menu-panel .menu-multiple-style3 li label{padding-left:5px;border-left:3px solid transparent}.nut-menu .nut-menu-panel .menu-multiple-style3 li.selected label{border-left:3px solid #f0250f}