layui-vue/es/tab/index.css

2 lines
6.3 KiB
CSS
Raw Normal View History

2022-11-14 03:59:26 +00:00
.layui-tab{display:flex;margin:10px 0;text-align:left!important}.layui-tab[overflow]>.layui-tab-head>.layui-tab-title{overflow:hidden}.layui-tab.is-left{flex-direction:row}.layui-tab.is-right{flex-direction:row-reverse;justify-content:space-between}.layui-tab.is-top{flex-direction:column}.layui-tab.is-bottom{flex-direction:column-reverse}.layui-tab-head{display:inline-block;overflow:hidden}.layui-tab-card .layui-tab-head{background-color:var(--global-neutral-color-1)}.layui-tab-title{position:relative;left:0;height:40px;white-space:nowrap;font-size:0;border-bottom-width:1px;border-bottom-style:solid;transition:all .2s;-webkit-transition:all .2s}.layui-tab-title li{display:inline-block;vertical-align:middle;font-size:14px;transition:all .2s;-webkit-transition:all .2s;position:relative;line-height:40px;min-width:65px;padding:0 15px;text-align:center;cursor:pointer;user-select:none}.layui-tab-title li a{display:block;padding:0 15px;margin:0 -15px}.layui-tab-head.is-top,.layui-tab-head.is-bottom,.layui-tab-title.is-top,.layui-tab-title.is-bottom{width:100%;position:relative}.layui-tab-title.is-right,.layui-tab-title.is-left{height:100%;min-width:60px;border-bottom-width:0px;border-bottom-style:none}.layui-tab-title.is-left li{display:list-item;margin-right:-1px}.layui-tab-title.is-right li{display:list-item;margin-left:-1px}.layui-tab-title.is-top li,.layui-tab-title.is-bottom li{border-bottom:1px solid #eeeeee}.layui-tab-title.is-right{border-left:1px solid var(--global-neutral-color-3)}.layui-tab-title.is-left{border-right:1px solid var(--global-neutral-color-3)}.layui-tab-title .layui-this{color:#000;background-color:#fff}.layui-tab-title .layui-this:after{position:absolute;left:0;top:0;content:"";width:100%;height:41px;border-width:1px;border-style:solid;border-bottom-color:#fff;border-radius:2px 2px 0 0;box-sizing:border-box;pointer-events:none}.layui-tab-title.is-left .layui-this:after{border:1px solid var(--global-neutral-color-3);border-right-color:#fff}.layui-tab-title.is-right .layui-this:after{border:1px solid var(--global-neutral-color-3);border-left-color:#fff}.layui-tab-brief>.layui-tab-head{background-color:transparent}.layui-tab-brief>.layui-tab-head>.layui-tab-title .layui-this{color:var(--global-primary-color)}.layui-tab-brief>.layui-tab-head>.layui-tab-more li.layui-this:after,.layui-tab-brief>.layui-tab-head>.layui-tab-title .layui-this:after{border:none;border-radius:0}.layui-tab-brief>.layui-tab-head.is-right>.layui-tab-title{border-left:1px solid var(--global-neutral-color-3)}.layui-tab-brief>.layui-tab-head.is-left>.layui-tab-title{border-right:1px solid var(--global-neutral-color-3)}.layui-tab-brief[overflow]>.layui-tab-head>.layui-tab-title .layui-this:after{top:-1px}.layui-tab-brief>.layui-tab-head.is-right>.layui-tab-title li,.layui-tab-brief>.layui-tab-head.is-left>.layui-tab-title li{margin-right:0}.layui-tab-brief>.layui-tab-head.is-top>.layui-tab-title li,.layui-tab-brief>.layui-tab-head.is-top>.layui-tab-title li{margin-top:0;margin-bottom:0}.layui-tab-card{border-width:1px;border-style:solid;border-radius:2px;box-shadow:0 2px 5px #0000001a}.layui-tab-card>.layui-tab-head>.layui-tab-title.is-top{margin-top:-1px;margin-left:-1px}.layui-tab-card>.layui-tab-head>.layui-tab-title.is-right,.layui-tab-card>.layui-tab-head>.layui-tab-title.is-left{margin-right:-1px;margin-left:-1px}.layui-tab-card>.layui-tab-head>.layui-tab-title.is-bottom li{margin-top:-1px}.layui-tab-card>.layui-tab-head>.layui-tab-title .layui-this:after{border-radius:0}.layui-tab-card>.layui-tab-head>.layui-tab-title.is-bottom{border-top:1px solid var(--global-neutral-color-3);margin-bottom:-2px;margin-left:-1px}.layui-tab-card>.layui-tab-head>.layui-tab-title.is-left li,.layui-tab-card>.layui-tab-head>.layui-tab-title.is-right li{margin-top:-1px;margin-bottom:-1px}.layui-tab-card>.layui-tab-head>.layui-tab-title.is-top .layui-this:after{border:1px solid var(--global-neutral-color-3);border-bottom-color:#fff}.layui-tab-card>.layui-tab-head>.layui-tab-title.is-bottom .layui-this:after{border:1px solid var(--global-neutral-color-