UNPKG

@reasy-team/reasy-ui

Version:

Tenda基于Vue2.x的PC组件库。[在线示例](https://reasyteam.github.io/Reasy-UI/)

3 lines (1 loc) 3.73 kB
.v-tabs{width:100%}.v-tabs .tab-nav{position:relative;display:inline-block;margin:0 0 12px;width:100%}.v-tabs .tab-nav-actions{display:inline-block}.v-tabs .tab-nav-item{display:inline-block;cursor:pointer}.v-tabs .tab-nav-item.tab-nav--S{line-height:20px;font-size:12px;padding:0 12px}.v-tabs .tab-nav-item.tab-nav--M{line-height:22px;font-size:14px;padding:0 16px}.v-tabs .tab-nav-item.tab-nav--L{line-height:24px;font-size:16px;padding:0 20px}.v-tabs .tab-nav-item:hover{color:rgba(215,0,15,0.9)}.v-tabs .tab-nav-item.tab-nav--active{font-weight:600;color:#d7000f;font-weight:500}.v-tabs .tab-nav-item.tab-nav-item--disabled{color:silver;cursor:not-allowed}.v-tabs .tab-nav-item.tab-nav-item--disabled.tab-nav--active{color:rgba(215,0,15,0.73)}.v-tabs .tab-nav.tab-nav--disabled .tab-nav-item{color:silver;cursor:not-allowed;border-color:#d8d8d8}.v-tabs .tab-nav.tab-nav--disabled .tab-nav-item.tab-nav--active{color:rgba(215,0,15,0.73)}.v-tabs .tab-nav.tab-nav--disabled.tab-nav--button .tab-nav--active{border-color:rgba(215,0,15,0.6)}.v-tabs .tab-nav.tab-nav--disabled.tab-nav--link .tab-active-border{background-color:rgba(215,0,15,0.73)}.v-tabs .tab-nav .tab-active-border{position:absolute;left:0;bottom:-1px;height:2px;background-color:#d7000f}.v-tabs .tab-nav .tab-active-border.tab-active-border--transition{-webkit-transition:all 0.2s ease-out 0.1s;-o-transition:all 0.2s ease-out 0.1s;transition:all 0.2s ease-out 0.1s}.v-tabs .tab-nav--link{border-bottom:1px solid #f5f5f5}.v-tabs .tab-nav--link .tab-nav-item.tab-nav--S{margin:0 0 1px}.v-tabs .tab-nav--link .tab-nav-item.tab-nav--M{margin:0 0 8px}.v-tabs .tab-nav--link .tab-nav-item.tab-nav--L{margin:0 0 10px}.v-tabs .tab-nav--link .tab-nav-item:first-child{margin-left:0}.v-tabs .tab-nav--link .tab-nav-item:last-child{margin-right:0}.v-tabs .tab-nav--card{border-bottom:1px solid #d8d8d8}.v-tabs .tab-nav--card .tab-nav-actions{margin-bottom:-1px;border:1px solid #d8d8d8;border-bottom:none;border-radius:4px 4px 0 0}.v-tabs .tab-nav--card .tab-nav-item{border-left:1px solid #d8d8d8}.v-tabs .tab-nav--card .tab-nav-item.tab-nav--S{padding:6px 24px}.v-tabs .tab-nav--card .tab-nav-item.tab-nav--M{padding:8px 24px}.v-tabs .tab-nav--card .tab-nav-item.tab-nav--L{padding:10px 24px}.v-tabs .tab-nav--card .tab-nav-item:first-child{border-left:none}.v-tabs .tab-nav--card .tab-nav-item.tab-nav--active{border-bottom:1px solid #fff}.v-tabs .tab-nav--tag{border-bottom:1px solid #d8d8d8}.v-tabs .tab-nav--tag .tab-nav-actions{margin-bottom:-1px}.v-tabs .tab-nav--tag .tab-nav-item{border:1px solid transparent;border-bottom:1px solid #d8d8d8;margin-right:4px;border-radius:4px 4px 0 0;background-color:#f5f5f5;color:#8d8d8d}.v-tabs .tab-nav--tag .tab-nav-item.tab-nav--S{padding:6px 24px}.v-tabs .tab-nav--tag .tab-nav-item.tab-nav--M{padding:8px 24px}.v-tabs .tab-nav--tag .tab-nav-item.tab-nav--L{padding:10px 24px}.v-tabs .tab-nav--tag .tab-nav-item.tab-nav--active{border-color:#d8d8d8;border-bottom-color:#fff;background-color:#fff;color:#262626}.v-tabs .tab-nav--button .tab-nav-item--disabled.tab-nav--active{border-color:rgba(215,0,15,0.6)}.v-tabs .tab-nav--button .tab-nav-item{position:relative;padding:8px 24px;border:1px solid #d8d8d8}.v-tabs .tab-nav--button .tab-nav-item.tab-nav--S{padding:6px 24px}.v-tabs .tab-nav--button .tab-nav-item.tab-nav--M{padding:8px 24px}.v-tabs .tab-nav--button .tab-nav-item.tab-nav--L{padding:10px 24px}.v-tabs .tab-nav--button .tab-nav-item:first-child{border-radius:4px 0 0 4px}.v-tabs .tab-nav--button .tab-nav-item:last-child{border-radius:0 4px 4px 0}.v-tabs .tab-nav--button .tab-nav-item:nth-of-type(n+2){margin-left:-1px}.v-tabs .tab-nav--button .tab-nav--active{border-color:rgba(215,0,15,0.9);z-index:2}