@trilogy-ds/styles 4.5.0-beta-2 → 4.5.1-beta-1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/default/trilogy-mangled.css +1 -1
- package/dist/default/trilogy-partials.css +1 -1
- package/dist/default/trilogy.css +1 -1
- package/framework/src/base/_reset.scss +1 -1
- package/framework/src/components/_autocomplete.scss +27 -23
- package/framework/src/components/_tabs.scss +9 -12
- package/framework/src/utilities/mixins/_spinner.scss +1 -1
- package/package.json +1 -1
|
@@ -1,32 +1,36 @@
|
|
|
1
|
-
.is-autocomplete {
|
|
1
|
+
.is-autocomplete-container {
|
|
2
|
+
position: relative;
|
|
3
|
+
|
|
4
|
+
.is-autocomplete {
|
|
2
5
|
.autocomplete-menu {
|
|
3
|
-
|
|
6
|
+
display: none;
|
|
4
7
|
}
|
|
5
8
|
|
|
6
9
|
&.is-active {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
10
|
+
.autocomplete-menu {
|
|
11
|
+
display: block;
|
|
12
|
+
border: var(--border);
|
|
13
|
+
padding: calc($spacing-1 + 1px) calc($spacing-2 + 2px);
|
|
14
|
+
border-radius: 4px;
|
|
15
|
+
max-height: 220px;
|
|
16
|
+
overflow-y: auto;
|
|
17
|
+
background-color: getColor('background');
|
|
18
|
+
z-index: 10000;
|
|
19
|
+
}
|
|
17
20
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
+
.autocomplete-item {
|
|
22
|
+
cursor: pointer;
|
|
23
|
+
padding: calc($spacing-1 - 0.25px) calc($spacing-1 + 1px);
|
|
21
24
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
}
|
|
25
|
+
&.is-active, &[data-autocomplete-item-hover] {
|
|
26
|
+
@include hoverRules();
|
|
27
|
+
margin-left: calc(2px - $spacing-3);
|
|
28
|
+
margin-right: calc(2px - $spacing-3);
|
|
29
|
+
border-top: 1px solid getColor('neutral-fade');
|
|
30
|
+
border-bottom: 1px solid getColor('neutral-fade');
|
|
31
|
+
padding: calc($spacing-1 - 1.25px) calc($spacing-4 - 1px);
|
|
30
32
|
}
|
|
33
|
+
}
|
|
31
34
|
}
|
|
35
|
+
}
|
|
32
36
|
}
|
|
@@ -18,7 +18,7 @@ $height-arrow-small:30px;
|
|
|
18
18
|
.arrow-prev, .arrow-next {
|
|
19
19
|
position: absolute;
|
|
20
20
|
top: calc(($height-tab-default / 2) - calc($height-arrow-default / 2) ) !important ;
|
|
21
|
-
transition: opacity 0.3s ease;
|
|
21
|
+
transition: opacity 0.3s ease;
|
|
22
22
|
opacity: 1;
|
|
23
23
|
&.hidden {
|
|
24
24
|
opacity: 0;
|
|
@@ -77,7 +77,7 @@ $height-arrow-small:30px;
|
|
|
77
77
|
white-space: nowrap;
|
|
78
78
|
overflow-y: hidden;
|
|
79
79
|
max-width: 100%;
|
|
80
|
-
|
|
80
|
+
|
|
81
81
|
&.is-arrows{
|
|
82
82
|
margin-left: $spacing-7;
|
|
83
83
|
margin-right: $spacing-7;
|
|
@@ -114,6 +114,9 @@ $height-arrow-small:30px;
|
|
|
114
114
|
}
|
|
115
115
|
|
|
116
116
|
> .tab {
|
|
117
|
+
display: inline-block;
|
|
118
|
+
line-height: normal;
|
|
119
|
+
font-family: $body-family;
|
|
117
120
|
height: calc(100% - 4px);
|
|
118
121
|
background-color: transparent;
|
|
119
122
|
color: getColor('font');
|
|
@@ -128,12 +131,6 @@ $height-arrow-small:30px;
|
|
|
128
131
|
margin-top: 2px;
|
|
129
132
|
}
|
|
130
133
|
|
|
131
|
-
&:not(button) {
|
|
132
|
-
.tab-icon {
|
|
133
|
-
margin-top: 4px;
|
|
134
|
-
}
|
|
135
|
-
}
|
|
136
|
-
|
|
137
134
|
&.is-active {
|
|
138
135
|
color: getColor('main');
|
|
139
136
|
position: relative;
|
|
@@ -176,13 +173,13 @@ $height-arrow-small:30px;
|
|
|
176
173
|
}
|
|
177
174
|
}
|
|
178
175
|
}
|
|
179
|
-
|
|
176
|
+
|
|
180
177
|
|
|
181
178
|
&.is-small{
|
|
182
179
|
.arrow-prev, .arrow-next {
|
|
183
180
|
top: calc(($height-tab-default / 2) - calc($height-arrow-small / 2) ) !important;
|
|
184
181
|
}
|
|
185
|
-
|
|
182
|
+
|
|
186
183
|
.tab-list {
|
|
187
184
|
& > .tab {
|
|
188
185
|
font-size: $text-14 ;
|
|
@@ -193,8 +190,8 @@ $height-arrow-small:30px;
|
|
|
193
190
|
margin-left: $spacing-6;
|
|
194
191
|
margin-right: $spacing-6;
|
|
195
192
|
}
|
|
196
|
-
}
|
|
197
|
-
}
|
|
193
|
+
}
|
|
194
|
+
}
|
|
198
195
|
|
|
199
196
|
|
|
200
197
|
.tab-panels {
|