1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
@mixin reindeer-tabsheet-minimal-style($primaryStyleName : v-tabsheet) {
/**
* Tabsheet "minimal" style --------------
*/
/* Minimal tabsheet on blue background */
.blue .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-spacertd div,
.blue .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem,
.blue .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem-selected {
border-color: #7c8a91;
}
.blue .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close {
color: #7c8a91;
}
.blue .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:hover {
color: #BCD3DE;
background: #778d98;
}
.blue .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:active {
background: #4f6874;
}
/* Default & white styles */
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-spacertd div,
.white .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-spacertd div {
border-bottom: 1px solid #bfbfbf;
height: auto;
background: transparent;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitemcell,
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-spacertd {
height: auto;
background: transparent;
padding-left: 0;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem,
.white .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem {
border: none;
border-bottom: 1px solid #bfbfbf;
color: #4d748f;
padding: 0;
height: auto;
background: transparent;
text-shadow: none;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem .v-caption {
padding: 5px 16px;
height: auto;
background: transparent;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitemcell-selected {
background: transparent;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem-selected,
.white .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem-selected {
background: transparent;
border: 1px solid #bfbfbf;
border-bottom: none;
color: #222;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem-selected .v-caption {
background: transparent;
padding: 4px 15px 6px 15px;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem .v-caption-closable,
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem-selected .v-caption-closable {
padding-right: 6px;
}
.#{$primaryStyleName}-content-minimal,
.white .#{$primaryStyleName}-content-minimal {
border: none;
}
.#{$primaryStyleName}-content-minimal .#{$primaryStyleName}-tabsheetpanel {
background: transparent;
}
.#{$primaryStyleName}-deco-minimal,
.white .#{$primaryStyleName}-deco-minimal {
height: 0;
border: none;
}
.#{$primaryStyleName}-tabcontainer-minimal .#{$primaryStyleName}-scroller {
margin-top: -20px;
height: 17px;
padding: 0;
border: none;
background: transparent;
}
.#{$primaryStyleName}-tabcontainer-minimal .#{$primaryStyleName}-scroller button {
margin-top: 0;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close,
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:hover,
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:active {
text-indent: 0;
background: transparent;
margin-left: 3px;
margin-right: -3px;
padding: 0;
color: #999;
width: 14px;
height: 14px;
line-height: 14px;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
}
.v-ie9 & .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:only-child,
.v-ie9 & .#{$primaryStyleName}-tabs-minimal .v-captiontext:first-child + .#{$primaryStyleName}-caption-close {
margin-top: -14px;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:hover,
.white .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:hover {
color: #fff;
background: #aaa;
}
.#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:active,
.white .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:active {
background: #777;
}
/* Minimal tabsheet on black background */
.black .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-spacertd div,
.black .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem,
.black .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem-selected {
border-color: #3e4044;
color: #6a7f89;
}
.black .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-tabitem-selected {
color: #c9ccce;
}
.black .#{$primaryStyleName}-content-minimal,
.black .#{$primaryStyleName}-content-bar {
color: #c9ccce;
text-shadow: #000 0 0 1px;
}
.black .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close {
color: #72787c;
}
.black .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:hover {
color: #1d2021;
background: #4d5154;
}
.black .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:active {
background: #626669;
}
}
|
