UNPKG

2.45 kBtext/lessView Raw
1@import '../../style/themes/index';
2@import '../../style/mixins/index';
3@import './index';
4
5.@{tab-prefix-cls}-card {
6 > .@{tab-prefix-cls}-nav,
7 > div > .@{tab-prefix-cls}-nav {
8 .@{tab-prefix-cls}-tab {
9 margin: 0;
10 padding: @tabs-card-horizontal-padding;
11 background: @tabs-card-head-background;
12 border: @border-width-base @border-style-base @border-color-split;
13 transition: all @animation-duration-slow @ease-in-out;
14
15 &-active {
16 color: @tabs-card-active-color;
17 background: @component-background;
18 }
19 }
20
21 .@{tab-prefix-cls}-ink-bar {
22 visibility: hidden;
23 }
24 }
25
26 // ========================== Top & Bottom ==========================
27 &.@{tab-prefix-cls}-top,
28 &.@{tab-prefix-cls}-bottom {
29 > .@{tab-prefix-cls}-nav,
30 > div > .@{tab-prefix-cls}-nav {
31 .@{tab-prefix-cls}-tab + .@{tab-prefix-cls}-tab {
32 margin-left: @tabs-card-gutter;
33 }
34 }
35 }
36
37 &.@{tab-prefix-cls}-top {
38 > .@{tab-prefix-cls}-nav,
39 > div > .@{tab-prefix-cls}-nav {
40 .@{tab-prefix-cls}-tab {
41 border-radius: @border-radius-base @border-radius-base 0 0;
42
43 &-active {
44 border-bottom-color: @component-background;
45 }
46 }
47 }
48 }
49 &.@{tab-prefix-cls}-bottom {
50 > .@{tab-prefix-cls}-nav,
51 > div > .@{tab-prefix-cls}-nav {
52 .@{tab-prefix-cls}-tab {
53 border-radius: 0 0 @border-radius-base @border-radius-base;
54
55 &-active {
56 border-top-color: @component-background;
57 }
58 }
59 }
60 }
61
62 // ========================== Left & Right ==========================
63 &.@{tab-prefix-cls}-left,
64 &.@{tab-prefix-cls}-right {
65 > .@{tab-prefix-cls}-nav,
66 > div > .@{tab-prefix-cls}-nav {
67 .@{tab-prefix-cls}-tab + .@{tab-prefix-cls}-tab {
68 margin-top: @tabs-card-gutter;
69 }
70 }
71 }
72
73 &.@{tab-prefix-cls}-left {
74 > .@{tab-prefix-cls}-nav,
75 > div > .@{tab-prefix-cls}-nav {
76 .@{tab-prefix-cls}-tab {
77 border-radius: @border-radius-base 0 0 @border-radius-base;
78
79 &-active {
80 border-right-color: @component-background;
81 }
82 }
83 }
84 }
85 &.@{tab-prefix-cls}-right {
86 > .@{tab-prefix-cls}-nav,
87 > div > .@{tab-prefix-cls}-nav {
88 .@{tab-prefix-cls}-tab {
89 border-radius: 0 @border-radius-base @border-radius-base 0;
90
91 &-active {
92 border-left-color: @component-background;
93 }
94 }
95 }
96 }
97}