Skip to content
This repository was archived by the owner on Jan 16, 2022. It is now read-only.

Commit cbc9374

Browse files
Sergio MorenoSergio Moreno
authored andcommitted
fix: package detail sidebar overflow
1 parent a25caae commit cbc9374

File tree

4 files changed

+27
-56
lines changed

4 files changed

+27
-56
lines changed

src/pages/Version/DetailSidebar/Dist/Dist.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ const Dist: FC = () => {
3434

3535
return (
3636
<List subheader={<StyledText variant="subtitle1">{t('sidebar.distribution.title')}</StyledText>}>
37-
<DistListItem button={true}>
37+
<DistListItem button={false}>
3838
<DistChip name={t('sidebar.distribution.file-count')}>{dist.fileCount}</DistChip>
3939
<DistChip name={t('sidebar.distribution.size')}>{dist.unpackedSize && fileSizeSI(dist.unpackedSize)}</DistChip>
4040
<DistChip name={t('sidebar.distribution.license')}>{formatLicense(license)}</DistChip>

src/pages/Version/DetailSidebar/Dist/__snapshots__/Dist.test.tsx.snap

Lines changed: 24 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ Object {
1010
1111
.emotion-2 {
1212
padding-left: 0;
13+
overflow-x: auto;
1314
padding-right: 0;
1415
}
1516
@@ -28,11 +29,8 @@ Object {
2829
>
2930
Latest Distribution
3031
</span>
31-
<div
32-
aria-disabled="false"
33-
class="MuiButtonBase-root MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters MuiListItem-button"
34-
role="button"
35-
tabindex="0"
32+
<li
33+
class="MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters"
3634
>
3735
<div
3836
class="MuiChip-root emotion-4 emotion-5"
@@ -60,10 +58,7 @@ Object {
6058
10.00 Bytes
6159
</span>
6260
</div>
63-
<span
64-
class="MuiTouchRipple-root"
65-
/>
66-
</div>
61+
</li>
6762
</ul>
6863
</div>
6964
</body>,
@@ -74,6 +69,7 @@ Object {
7469
7570
.emotion-2 {
7671
padding-left: 0;
72+
overflow-x: auto;
7773
padding-right: 0;
7874
}
7975
@@ -91,11 +87,8 @@ Object {
9187
>
9288
Latest Distribution
9389
</span>
94-
<div
95-
aria-disabled="false"
96-
class="MuiButtonBase-root MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters MuiListItem-button"
97-
role="button"
98-
tabindex="0"
90+
<li
91+
class="MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters"
9992
>
10093
<div
10194
class="MuiChip-root emotion-4 emotion-5"
@@ -123,10 +116,7 @@ Object {
123116
10.00 Bytes
124117
</span>
125118
</div>
126-
<span
127-
class="MuiTouchRipple-root"
128-
/>
129-
</div>
119+
</li>
130120
</ul>
131121
</div>,
132122
"debug": [Function],
@@ -193,6 +183,7 @@ Object {
193183
194184
.emotion-2 {
195185
padding-left: 0;
186+
overflow-x: auto;
196187
padding-right: 0;
197188
}
198189
@@ -211,11 +202,8 @@ Object {
211202
>
212203
Latest Distribution
213204
</span>
214-
<div
215-
aria-disabled="false"
216-
class="MuiButtonBase-root MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters MuiListItem-button"
217-
role="button"
218-
tabindex="0"
205+
<li
206+
class="MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters"
219207
>
220208
<div
221209
class="MuiChip-root emotion-4 emotion-5"
@@ -256,10 +244,7 @@ Object {
256244
MIT
257245
</span>
258246
</div>
259-
<span
260-
class="MuiTouchRipple-root"
261-
/>
262-
</div>
247+
</li>
263248
</ul>
264249
</div>
265250
</body>,
@@ -270,6 +255,7 @@ Object {
270255
271256
.emotion-2 {
272257
padding-left: 0;
258+
overflow-x: auto;
273259
padding-right: 0;
274260
}
275261
@@ -287,11 +273,8 @@ Object {
287273
>
288274
Latest Distribution
289275
</span>
290-
<div
291-
aria-disabled="false"
292-
class="MuiButtonBase-root MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters MuiListItem-button"
293-
role="button"
294-
tabindex="0"
276+
<li
277+
class="MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters"
295278
>
296279
<div
297280
class="MuiChip-root emotion-4 emotion-5"
@@ -332,10 +315,7 @@ Object {
332315
MIT
333316
</span>
334317
</div>
335-
<span
336-
class="MuiTouchRipple-root"
337-
/>
338-
</div>
318+
</li>
339319
</ul>
340320
</div>,
341321
"debug": [Function],
@@ -402,6 +382,7 @@ Object {
402382
403383
.emotion-2 {
404384
padding-left: 0;
385+
overflow-x: auto;
405386
padding-right: 0;
406387
}
407388
@@ -420,11 +401,8 @@ Object {
420401
>
421402
Latest Distribution
422403
</span>
423-
<div
424-
aria-disabled="false"
425-
class="MuiButtonBase-root MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters MuiListItem-button"
426-
role="button"
427-
tabindex="0"
404+
<li
405+
class="MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters"
428406
>
429407
<div
430408
class="MuiChip-root emotion-4 emotion-5"
@@ -465,10 +443,7 @@ Object {
465443
MIT
466444
</span>
467445
</div>
468-
<span
469-
class="MuiTouchRipple-root"
470-
/>
471-
</div>
446+
</li>
472447
</ul>
473448
</div>
474449
</body>,
@@ -479,6 +454,7 @@ Object {
479454
480455
.emotion-2 {
481456
padding-left: 0;
457+
overflow-x: auto;
482458
padding-right: 0;
483459
}
484460
@@ -496,11 +472,8 @@ Object {
496472
>
497473
Latest Distribution
498474
</span>
499-
<div
500-
aria-disabled="false"
501-
class="MuiButtonBase-root MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters MuiListItem-button"
502-
role="button"
503-
tabindex="0"
475+
<li
476+
class="MuiListItem-root emotion-2 emotion-3 MuiListItem-gutters"
504477
>
505478
<div
506479
class="MuiChip-root emotion-4 emotion-5"
@@ -541,10 +514,7 @@ Object {
541514
MIT
542515
</span>
543516
</div>
544-
<span
545-
class="MuiTouchRipple-root"
546-
/>
547-
</div>
517+
</li>
548518
</ul>
549519
</div>,
550520
"debug": [Function],

src/pages/Version/DetailSidebar/Dist/styles.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ export const StyledText = styled(Text)<{ theme?: Theme }>(props => ({
1313

1414
export const DistListItem = styled(ListItem)({
1515
paddingLeft: 0,
16+
overflowX: 'auto',
1617
paddingRight: 0,
1718
});
1819

tools/webpack.dev.config.babel.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export default {
3939
scope: '',
4040
filename: 'index.html',
4141
verdaccioURL: '//localhost:4873/',
42-
base: 'https://localhost:4872/',
42+
base: 'http://localhost:4872/',
4343
}),
4444
template: `${env.SRC_ROOT}/template/index.html`,
4545
debug: true,

0 commit comments

Comments
 (0)