@ctsy/layui-vue
Version:
a component library for Vue 3 base on layui-vue
2 lines (1 loc) • 5.02 kB
CSS
.layui-nav .layui-show.layui-anim-upbit .layui-show.layui-anim-upbit{top:0px;left:calc(100% + 5px)}.layui-nav .layui-show.layui-anim-upbit .left-nav.layui-show.layui-anim-upbit,.layui-nav .layui-show.layui-anim-upbit .left-nav .layui-show.layui-anim-upbit{top:0px;left:calc(-100% - 20px)}.layui-nav .layui-show.layui-anim-upbit .layui-nav-item{height:40px;display:block;line-height:40px}.layui-nav .layui-show.layui-anim-upbit .layui-nav-item.layui-this{background-color:#f5f5f5}.layui-nav .layui-show.layui-anim-upbit .layui-nav-item.layui-this:after{display:none}.layui-nav{position:relative;padding:0 20px;background-color:#393d49;color:#fff;border-radius:2px;font-size:0}.layui-nav *{font-size:14px}.layui-nav .layui-nav-item{position:relative;display:inline-block;*display: inline;*zoom: 1;vertical-align:middle;line-height:60px}.layui-nav .layui-nav-item>a{display:block;padding:0 30px;color:#ffffffb3}.layui-nav .layui-this:after,.layui-nav-bar{content:"";position:absolute;left:0;top:0;width:0;height:3px;background-color:var(--global-checked-color);transition:all .2s;-webkit-transition:all .2s;pointer-events:none}.layui-nav-bar{z-index:1000}.layui-nav[lay-bar=disabled] .layui-nav-bar{display:none}.layui-nav .layui-nav-item a:hover,.layui-nav .layui-this a{color:#fff}.layui-nav .layui-this:after{top:auto;bottom:0;width:100%}.layui-nav-img{width:30px;height:30px;margin-right:5px;border-radius:50%}.layui-nav .layui-nav-more{position:absolute;top:0;right:8px;left:auto;margin-top:0;font-size:12.5px;cursor:pointer;transition:all .2s;-webkit-transition:all .2s}.layui-nav .layui-nav-mored,.layui-nav-itemed>a .layui-nav-more{transform:rotate(180deg)}.layui-nav-child{display:none;position:absolute;left:0;top:65px;min-width:100%;line-height:36px;padding:5px 0;box-shadow:0 2px 4px #0000001f;border:1px solid #eee;background-color:#fff;z-index:100;border-radius:2px;white-space:nowrap}.layui-nav .layui-nav-child a{color:#666;color:#000c}.layui-nav .layui-nav-child a:hover{background-color:#f6f6f6;color:#000c}.layui-nav-child dd{margin:1px 0;position:relative}.layui-nav-child dd.layui-this{background-color:#f6f6f6;color:#000}.layui-nav-child dd.layui-this:after{display:none}.layui-nav-child-r{left:auto;right:0}.layui-nav-child-c{text-align:center}.layui-nav.layui-nav-collapse{width:60px}.layui-nav.layui-nav-collapse span,.layui-nav.layui-nav-collapse .layui-nav-more{display:none}.layui-nav-tree{padding:0;width:200px;transition:all .3s}.layui-nav-tree .layui-nav-item{width:100%;display:block;line-height:42px}.layui-nav-tree .layui-nav-item>a{height:40px;line-height:40px;position:relative;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:5px 23px}.layui-nav-tree .layui-nav-item *{color:#ffffffb3}.layui-nav-tree .layui-nav-more{right:15px}.layui-nav-tree .layui-nav-item>a .layui-nav-more{padding:5px 0}.layui-nav-tree .layui-nav-item span{margin-left:3px}.layui-nav-tree .layui-nav-bar{width:5px;height:0;background-color:var(--global-primary-color)}.layui-nav-tree .layui-this,.layui-nav-tree .layui-nav-child dd.layui-this,.layui-nav-tree .layui-this>a:hover{background-color:var(--global-primary-color);color:#fff}.layui-nav-tree .layui-this:after{display:none}.layui-nav-itemed>a,.layui-nav-tree .layui-nav-title a,.layui-nav-tree .layui-nav-title a:hover{color:#fff}.layui-nav-tree .layui-nav-child{top:0;z-index:0;border:none;box-shadow:none;position:relative}.layui-nav-tree .layui-nav-child dd{margin:0}.layui-nav-tree .layui-nav-child a{color:#fff;color:#ffffffb3}.layui-nav-tree .layui-nav-child,.layui-nav-tree .layui-nav-child a:hover{background:0 0;color:#fff}.layui-nav-tree .layui-nav-child{display:block;background-color:#0003}.layui-nav-itemed>.layui-nav-child>.layui-this>.layui-nav-child{display:block}.layui-nav-tree.layui-bg-gray a,.layui-nav.layui-bg-gray .layui-nav-item a{color:#666;color:#000c}.layui-nav-tree.layui-bg-gray .layui-nav-itemed>.layui-nav-child{background:0 0}.layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this,.layui-nav-tree.layui-bg-gray .layui-nav-child dd.layui-this a{background:0 0;color:var(--global-checked-color);font-weight:700}.layui-nav.layui-bg-gray .layui-nav-bar{background-color:var(--global-checked-color)}.layui-nav-side{position:fixed;top:0;bottom:0;left:0;overflow-x:hidden;z-index:999}.layui-nav-light{background-color:#fff}.layui-nav-light *{color:gray}.layui-nav-light .layui-nav-child{background-color:#00000005}.layui-nav-tree{padding-top:5px;padding-bottom:5px}.layui-nav-tree .layui-this *{color:#fff}.layui-nav-tree.inverted .layui-this,.layui-nav-tree.inverted .layui-this:hover{border-radius:var(--global-border-radius);margin:0 6px;width:auto}.layui-nav-tree.inverted .layui-this>a,.layui-nav-tree.inverted .layui-this:hover>a{border-radius:var(--global-border-radius)}.layui-nav-tree.inverted .layui-this>a{padding:5px 17px}.layui-nav-tree.not-level .layui-nav-child{background-color:transparent}