luna-one 3.1.549 → 3.1.550
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.
|
@@ -59,12 +59,24 @@ var NavEntry = function NavEntry(_ref2) {
|
|
|
59
59
|
mouse = _useMouse.mouse;
|
|
60
60
|
|
|
61
61
|
var tabsNumberForAria = displayThumbnails && numberOfTabs > 4 ? "4" : numberOfTabs;
|
|
62
|
+
var tabsWidth = '';
|
|
63
|
+
|
|
64
|
+
if (numberOfTabs >= 4) {
|
|
65
|
+
tabsWidth = "quarter";
|
|
66
|
+
} else if (numberOfTabs === 3) {
|
|
67
|
+
tabsWidth = "one-third";
|
|
68
|
+
} else if (numberOfTabs === 2) {
|
|
69
|
+
tabsWidth = "half";
|
|
70
|
+
} else if (numberOfTabs === 1) {
|
|
71
|
+
tabsWidth = "full";
|
|
72
|
+
}
|
|
73
|
+
|
|
62
74
|
return /*#__PURE__*/_react["default"].createElement("button", {
|
|
63
75
|
onClick: function onClick() {
|
|
64
76
|
setIndex(index);
|
|
65
77
|
jumpToContent(contentID);
|
|
66
78
|
},
|
|
67
|
-
className: "nav-entry ".concat(isActive && "active", " ").concat(mouse ? "" : "focus"),
|
|
79
|
+
className: "nav-entry ".concat("nav-entry--".concat(tabsWidth), " ", isActive && "active", " ").concat(mouse ? "" : "focus"),
|
|
68
80
|
"aria-selected": isActive,
|
|
69
81
|
"aria-label": isActive ? "Selected Tab ".concat(index + 1, " of ").concat(tabsNumberForAria) : "Unselected Tab ".concat(index + 1, " of ").concat(tabsNumberForAria),
|
|
70
82
|
"aria-controls": "Selected tab ".concat(index + 1, " of ").concat(tabsNumberForAria, ": ").concat(header),
|
|
@@ -155,6 +155,19 @@
|
|
|
155
155
|
|
|
156
156
|
.nav-entry {
|
|
157
157
|
width: calc(25% - 2px);
|
|
158
|
+
|
|
159
|
+
&--full {
|
|
160
|
+
width: 100%;
|
|
161
|
+
}
|
|
162
|
+
&--half {
|
|
163
|
+
width: 50%;
|
|
164
|
+
}
|
|
165
|
+
&--one-third {
|
|
166
|
+
width: 33.3%;
|
|
167
|
+
}
|
|
168
|
+
&--quarter {
|
|
169
|
+
width: 25%;
|
|
170
|
+
}
|
|
158
171
|
}
|
|
159
172
|
}
|
|
160
173
|
|
|
@@ -184,6 +197,19 @@
|
|
|
184
197
|
border-bottom-width: 6px;
|
|
185
198
|
border-bottom-style: solid;
|
|
186
199
|
|
|
200
|
+
&--full {
|
|
201
|
+
width: 100%;
|
|
202
|
+
}
|
|
203
|
+
&--half {
|
|
204
|
+
width: 50%;
|
|
205
|
+
}
|
|
206
|
+
&--one-third {
|
|
207
|
+
width: 33.3%;
|
|
208
|
+
}
|
|
209
|
+
&--quarter {
|
|
210
|
+
width: 25%;
|
|
211
|
+
}
|
|
212
|
+
|
|
187
213
|
&.active:before {
|
|
188
214
|
bottom: -22px;
|
|
189
215
|
border-left: 20px solid transparent;
|
|
@@ -200,6 +226,19 @@
|
|
|
200
226
|
border-top-width: 6px;
|
|
201
227
|
border-top-style: solid;
|
|
202
228
|
|
|
229
|
+
&--full {
|
|
230
|
+
width: 100%;
|
|
231
|
+
}
|
|
232
|
+
&--half {
|
|
233
|
+
width: 50%;
|
|
234
|
+
}
|
|
235
|
+
&--one-third {
|
|
236
|
+
width: 33.3%;
|
|
237
|
+
}
|
|
238
|
+
&--quarter {
|
|
239
|
+
width: 25%;
|
|
240
|
+
}
|
|
241
|
+
|
|
203
242
|
&.active:before {
|
|
204
243
|
top: -22px;
|
|
205
244
|
border-left: 20px solid transparent;
|