@aws-amplify/ui 6.10.3 → 6.12.0

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.
Files changed (28) hide show
  1. package/dist/esm/i18n/dictionaries/authenticator/de.mjs +1 -0
  2. package/dist/esm/i18n/dictionaries/authenticator/es.mjs +5 -4
  3. package/dist/esm/i18n/dictionaries/authenticator/fr.mjs +6 -5
  4. package/dist/esm/i18n/dictionaries/authenticator/hu.mjs +143 -0
  5. package/dist/esm/i18n/dictionaries/authenticator/it.mjs +1 -0
  6. package/dist/esm/i18n/dictionaries/authenticator/ja.mjs +1 -0
  7. package/dist/esm/i18n/dictionaries/authenticator/nb.mjs +1 -0
  8. package/dist/esm/i18n/dictionaries/authenticator/sv.mjs +1 -0
  9. package/dist/esm/i18n/dictionaries/authenticator/th.mjs +1 -0
  10. package/dist/esm/i18n/dictionaries/authenticator/tr.mjs +1 -0
  11. package/dist/esm/i18n/dictionaries/authenticator/zh.mjs +1 -0
  12. package/dist/esm/i18n/dictionaries/index.mjs +3 -1
  13. package/dist/esm/i18n/translations.mjs +2 -1
  14. package/dist/index.js +163 -9
  15. package/dist/styles/StorageBrowser.css +248 -0
  16. package/dist/styles/StorageBrowser.layer.css +248 -0
  17. package/dist/styles/liveness.css +17 -2
  18. package/dist/styles/liveness.layer.css +17 -2
  19. package/dist/styles/table.css +3 -0
  20. package/dist/styles/table.layer.css +3 -0
  21. package/dist/styles.css +267 -2
  22. package/dist/styles.layer.css +267 -2
  23. package/dist/types/i18n/dictionaries/authenticator/hu.d.ts +2 -0
  24. package/dist/types/i18n/dictionaries/authenticator/index.d.ts +1 -0
  25. package/dist/types/i18n/dictionaries/index.d.ts +52 -0
  26. package/dist/types/theme/components/storageBrowser.d.ts +14 -0
  27. package/dist/types/utils/setUserAgent/setUserAgent.d.ts +1 -1
  28. package/package.json +2 -2
package/dist/styles/StorageBrowser.css CHANGED
@@ -66,6 +66,9 @@
66
66
  box-shadow: var(--amplify-shadows-small);
67
67
  z-index: 2;
68
68
  }
69
+ .amplify-storage-browser__table-row_active {
70
+ background-color: var(--amplify-colors-background-info);
71
+ }
69
72
  .amplify-storage-browser__table-header {
70
73
  border: none;
71
74
  padding: var(--amplify-space-xxxs);
@@ -147,4 +150,249 @@
147
150
  height: var(--amplify-border-widths-large);
148
151
  top: 0;
149
152
  z-index: 3;
153
+ }
154
+ .amplify-storage-browser__content-with-preview {
155
+ display: flex;
156
+ height: 100%;
157
+ }
158
+ .amplify-storage-browser__file-preview {
159
+ overflow: auto;
160
+ flex: 1;
161
+ width: 50%;
162
+ position: sticky;
163
+ top: 10px;
164
+ bottom: 10px;
165
+ height: -moz-fit-content;
166
+ height: fit-content;
167
+ max-height: calc(100svh - 20px);
168
+ padding: var(--amplify-space-medium);
169
+ border: var(--amplify-border-widths-small) solid var(--amplify-colors-border-primary);
170
+ border-radius: var(--amplify-radii-small);
171
+ margin-inline-start: var(--amplify-space-large);
172
+ padding-block-end: var(--amplify-space-large);
173
+ }
174
+ .amplify-storage-browser__file-preview-header {
175
+ margin-block-end: var(--amplify-space-medium);
176
+ display: flex;
177
+ justify-content: flex-end;
178
+ }
179
+ .amplify-storage-browser__file-preview-container {
180
+ display: flex;
181
+ flex-direction: column;
182
+ gap: var(--amplify-space-large);
183
+ }
184
+ .amplify-storage-browser__file-preview-content {
185
+ display: flex;
186
+ flex-direction: column;
187
+ gap: var(--amplify-space-large);
188
+ align-items: center;
189
+ }
190
+ .amplify-storage-browser__file-preview-section {
191
+ display: flex;
192
+ flex-direction: column;
193
+ min-height: 400px;
194
+ flex: 1;
195
+ }
196
+ .amplify-storage-browser__file-preview-title {
197
+ margin-block-end: var(--amplify-space-medium);
198
+ color: var(--amplify-colors-font-primary);
199
+ font-size: var(--amplify-font-sizes-large);
200
+ font-weight: var(--amplify-font-weights-semibold);
201
+ flex-shrink: 0;
202
+ }
203
+ .amplify-storage-browser__file-metadata {
204
+ display: grid;
205
+ gap: var(--amplify-space-small);
206
+ background-color: var(--amplify-colors-background-secondary);
207
+ padding: var(--amplify-space-medium);
208
+ border-radius: var(--amplify-radii-small);
209
+ border: var(--amplify-border-widths-small) solid var(--amplify-colors-border-secondary);
210
+ }
211
+ .amplify-storage-browser__file-metadata-item {
212
+ display: flex;
213
+ justify-content: space-between;
214
+ align-items: center;
215
+ padding-block: var(--amplify-space-xs);
216
+ border-block-end: var(--amplify-border-widths-small) solid var(--amplify-colors-border-secondary);
217
+ }
218
+ .amplify-storage-browser__file-metadata-item:last-child {
219
+ border-block-end: none;
220
+ }
221
+ .amplify-storage-browser__file-metadata-label {
222
+ font-weight: var(--amplify-font-weights-medium);
223
+ color: var(--amplify-colors-font-primary);
224
+ margin: 0;
225
+ }
226
+ .amplify-storage-browser__file-metadata-value {
227
+ color: var(--amplify-colors-font-secondary);
228
+ margin: 0;
229
+ word-break: break-all;
230
+ text-align: end;
231
+ max-width: 60%;
232
+ }
233
+ .amplify-storage-browser__preview-fallback {
234
+ width: 100%;
235
+ height: 400px;
236
+ display: flex;
237
+ flex-direction: column;
238
+ align-items: center;
239
+ justify-content: center;
240
+ gap: var(--amplify-space-medium);
241
+ background-color: var(--amplify-colors-background-secondary);
242
+ border: var(--amplify-border-widths-small) dashed var(--amplify-colors-border-secondary);
243
+ border-radius: var(--amplify-radii-small);
244
+ padding: var(--amplify-space-large);
245
+ text-align: center;
246
+ }
247
+ .amplify-storage-browser__preview-fallback--error {
248
+ color: var(--amplify-colors-font-error);
249
+ background-color: var(--amplify-colors-background-error);
250
+ border-color: var(--amplify-colors-border-error);
251
+ }
252
+ .amplify-storage-browser__preview-fallback--default {
253
+ color: var(--amplify-colors-font-secondary);
254
+ background-color: var(--amplify-colors-background-secondary);
255
+ border-color: var(--amplify-colors-border-secondary);
256
+ }
257
+ .amplify-storage-browser__preview-fallback-icon {
258
+ font-size: var(--amplify-font-sizes-xxxxl);
259
+ margin-block-end: var(--amplify-space-xs);
260
+ }
261
+ .amplify-storage-browser__preview-fallback-title {
262
+ font-weight: var(--amplify-font-weights-bold);
263
+ font-size: var(--amplify-font-sizes-large);
264
+ margin-block-end: var(--amplify-space-xs);
265
+ }
266
+ .amplify-storage-browser__preview-fallback-description {
267
+ font-size: var(--amplify-font-sizes-small);
268
+ margin-block-end: var(--amplify-space-xs);
269
+ }
270
+ .amplify-storage-browser__preview-fallback-filename {
271
+ font-size: var(--amplify-font-sizes-xs);
272
+ font-family: var(--amplify-fonts-monospace), monospace;
273
+ }
274
+ .amplify-storage-browser__preview-fallback-actions {
275
+ display: flex;
276
+ gap: var(--amplify-space-small);
277
+ flex-wrap: wrap;
278
+ justify-content: center;
279
+ }
280
+ .amplify-storage-browser__preview-placeholder {
281
+ display: flex;
282
+ flex-direction: column;
283
+ align-items: center;
284
+ justify-content: center;
285
+ gap: var(--amplify-space-medium);
286
+ height: 400px;
287
+ width: 100%;
288
+ }
289
+ .amplify-storage-browser__preview-placeholder-content {
290
+ display: flex;
291
+ flex-direction: column;
292
+ align-items: center;
293
+ gap: var(--amplify-space-small);
294
+ width: 100%;
295
+ }
296
+ .amplify-storage-browser__preview-placeholder-info {
297
+ color: var(--amplify-colors-font-secondary);
298
+ font-size: var(--amplify-font-sizes-small);
299
+ text-align: center;
300
+ }
301
+ .amplify-storage-browser__text-container {
302
+ display: flex;
303
+ flex-flow: column nowrap;
304
+ gap: 8px;
305
+ align-items: center;
306
+ }
307
+ .amplify-storage-browser__text-preview {
308
+ height: 400px;
309
+ width: 100%;
310
+ display: block;
311
+ background-color: var(--amplify-colors-background-secondary);
312
+ border: var(--amplify-border-widths-small) solid var(--amplify-colors-border-secondary);
313
+ border-radius: var(--amplify-radii-small);
314
+ padding: var(--amplify-space-medium);
315
+ font-family: var(--amplify-fonts-monospace), monospace;
316
+ font-size: var(--amplify-font-sizes-small);
317
+ line-height: 1.5;
318
+ overflow-y: auto;
319
+ word-wrap: break-word;
320
+ white-space: pre-wrap;
321
+ word-break: break-word;
322
+ }
323
+ .amplify-storage-browser__video-container {
324
+ display: flex;
325
+ flex-flow: column nowrap;
326
+ gap: 8px;
327
+ align-items: center;
328
+ }
329
+ .amplify-storage-browser__video-preview {
330
+ display: flex;
331
+ align-items: center;
332
+ justify-content: center;
333
+ width: 100%;
334
+ height: 400px;
335
+ border-radius: var(--amplify-radii-small);
336
+ background-color: var(--amplify-colors-background-secondary);
337
+ flex-shrink: 0;
338
+ }
339
+ .amplify-storage-browser__video-preview video {
340
+ max-width: 100%;
341
+ max-height: 100%;
342
+ width: auto;
343
+ height: auto;
344
+ -o-object-fit: contain;
345
+ object-fit: contain;
346
+ }
347
+ .amplify-storage-browser__image-container {
348
+ display: flex;
349
+ flex-flow: column nowrap;
350
+ gap: 8px;
351
+ align-items: center;
352
+ }
353
+ .amplify-storage-browser__image-preview {
354
+ display: flex;
355
+ align-items: center;
356
+ justify-content: center;
357
+ height: 400px;
358
+ width: 100%;
359
+ background-color: var(--amplify-colors-background-secondary);
360
+ border-radius: var(--amplify-radii-small);
361
+ flex-shrink: 0;
362
+ flex-flow: column nowrap;
363
+ gap: 8px;
364
+ }
365
+ .amplify-storage-browser__image-preview img {
366
+ max-width: 100%;
367
+ max-height: 100%;
368
+ width: auto;
369
+ height: auto;
370
+ -o-object-fit: contain;
371
+ object-fit: contain;
372
+ border-radius: var(--amplify-radii-small);
373
+ }
374
+ .amplify-storage-browser__download-button {
375
+ display: flex;
376
+ flex-flow: row nowrap;
377
+ gap: 8px;
378
+ }
379
+ .amplify-storage-browser__download-button_icon {
380
+ animation-delay: 0s;
381
+ animation-direction: normal;
382
+ animation-duration: 1s;
383
+ animation-iteration-count: infinite;
384
+ animation-timing-function: linear;
385
+ animation-name: spin;
386
+ }
387
+
388
+ @keyframes spin {
389
+ 0% {
390
+ transform: rotate(0deg);
391
+ }
392
+ 50% {
393
+ transform: rotate(180deg);
394
+ }
395
+ 100% {
396
+ transform: rotate(360deg);
397
+ }
150
398
  }
package/dist/styles/StorageBrowser.layer.css CHANGED
@@ -67,6 +67,9 @@
67
67
  box-shadow: var(--amplify-shadows-small);
68
68
  z-index: 2;
69
69
  }
70
+ .amplify-storage-browser__table-row_active {
71
+ background-color: var(--amplify-colors-background-info);
72
+ }
70
73
  .amplify-storage-browser__table-header {
71
74
  border: none;
72
75
  padding: var(--amplify-space-xxxs);
@@ -149,4 +152,249 @@
149
152
  top: 0;
150
153
  z-index: 3;
151
154
  }
155
+ .amplify-storage-browser__content-with-preview {
156
+ display: flex;
157
+ height: 100%;
158
+ }
159
+ .amplify-storage-browser__file-preview {
160
+ overflow: auto;
161
+ flex: 1;
162
+ width: 50%;
163
+ position: sticky;
164
+ top: 10px;
165
+ bottom: 10px;
166
+ height: -moz-fit-content;
167
+ height: fit-content;
168
+ max-height: calc(100svh - 20px);
169
+ padding: var(--amplify-space-medium);
170
+ border: var(--amplify-border-widths-small) solid var(--amplify-colors-border-primary);
171
+ border-radius: var(--amplify-radii-small);
172
+ margin-inline-start: var(--amplify-space-large);
173
+ padding-block-end: var(--amplify-space-large);
174
+ }
175
+ .amplify-storage-browser__file-preview-header {
176
+ margin-block-end: var(--amplify-space-medium);
177
+ display: flex;
178
+ justify-content: flex-end;
179
+ }
180
+ .amplify-storage-browser__file-preview-container {
181
+ display: flex;
182
+ flex-direction: column;
183
+ gap: var(--amplify-space-large);
184
+ }
185
+ .amplify-storage-browser__file-preview-content {
186
+ display: flex;
187
+ flex-direction: column;
188
+ gap: var(--amplify-space-large);
189
+ align-items: center;
190
+ }
191
+ .amplify-storage-browser__file-preview-section {
192
+ display: flex;
193
+ flex-direction: column;
194
+ min-height: 400px;
195
+ flex: 1;
196
+ }
197
+ .amplify-storage-browser__file-preview-title {
198
+ margin-block-end: var(--amplify-space-medium);
199
+ color: var(--amplify-colors-font-primary);
200
+ font-size: var(--amplify-font-sizes-large);
201
+ font-weight: var(--amplify-font-weights-semibold);
202
+ flex-shrink: 0;
203
+ }
204
+ .amplify-storage-browser__file-metadata {
205
+ display: grid;
206
+ gap: var(--amplify-space-small);
207
+ background-color: var(--amplify-colors-background-secondary);
208
+ padding: var(--amplify-space-medium);
209
+ border-radius: var(--amplify-radii-small);
210
+ border: var(--amplify-border-widths-small) solid var(--amplify-colors-border-secondary);
211
+ }
212
+ .amplify-storage-browser__file-metadata-item {
213
+ display: flex;
214
+ justify-content: space-between;
215
+ align-items: center;
216
+ padding-block: var(--amplify-space-xs);
217
+ border-block-end: var(--amplify-border-widths-small) solid var(--amplify-colors-border-secondary);
218
+ }
219
+ .amplify-storage-browser__file-metadata-item:last-child {
220
+ border-block-end: none;
221
+ }
222
+ .amplify-storage-browser__file-metadata-label {
223
+ font-weight: var(--amplify-font-weights-medium);
224
+ color: var(--amplify-colors-font-primary);
225
+ margin: 0;
226
+ }
227
+ .amplify-storage-browser__file-metadata-value {
228
+ color: var(--amplify-colors-font-secondary);
229
+ margin: 0;
230
+ word-break: break-all;
231
+ text-align: end;
232
+ max-width: 60%;
233
+ }
234
+ .amplify-storage-browser__preview-fallback {
235
+ width: 100%;
236
+ height: 400px;
237
+ display: flex;
238
+ flex-direction: column;
239
+ align-items: center;
240
+ justify-content: center;
241
+ gap: var(--amplify-space-medium);
242
+ background-color: var(--amplify-colors-background-secondary);
243
+ border: var(--amplify-border-widths-small) dashed var(--amplify-colors-border-secondary);
244
+ border-radius: var(--amplify-radii-small);
245
+ padding: var(--amplify-space-large);
246
+ text-align: center;
247
+ }
248
+ .amplify-storage-browser__preview-fallback--error {
249
+ color: var(--amplify-colors-font-error);
250
+ background-color: var(--amplify-colors-background-error);
251
+ border-color: var(--amplify-colors-border-error);
252
+ }
253
+ .amplify-storage-browser__preview-fallback--default {
254
+ color: var(--amplify-colors-font-secondary);
255
+ background-color: var(--amplify-colors-background-secondary);
256
+ border-color: var(--amplify-colors-border-secondary);
257
+ }
258
+ .amplify-storage-browser__preview-fallback-icon {
259
+ font-size: var(--amplify-font-sizes-xxxxl);
260
+ margin-block-end: var(--amplify-space-xs);
261
+ }
262
+ .amplify-storage-browser__preview-fallback-title {
263
+ font-weight: var(--amplify-font-weights-bold);
264
+ font-size: var(--amplify-font-sizes-large);
265
+ margin-block-end: var(--amplify-space-xs);
266
+ }
267
+ .amplify-storage-browser__preview-fallback-description {
268
+ font-size: var(--amplify-font-sizes-small);
269
+ margin-block-end: var(--amplify-space-xs);
270
+ }
271
+ .amplify-storage-browser__preview-fallback-filename {
272
+ font-size: var(--amplify-font-sizes-xs);
273
+ font-family: var(--amplify-fonts-monospace), monospace;
274
+ }
275
+ .amplify-storage-browser__preview-fallback-actions {
276
+ display: flex;
277
+ gap: var(--amplify-space-small);
278
+ flex-wrap: wrap;
279
+ justify-content: center;
280
+ }
281
+ .amplify-storage-browser__preview-placeholder {
282
+ display: flex;
283
+ flex-direction: column;
284
+ align-items: center;
285
+ justify-content: center;
286
+ gap: var(--amplify-space-medium);
287
+ height: 400px;
288
+ width: 100%;
289
+ }
290
+ .amplify-storage-browser__preview-placeholder-content {
291
+ display: flex;
292
+ flex-direction: column;
293
+ align-items: center;
294
+ gap: var(--amplify-space-small);
295
+ width: 100%;
296
+ }
297
+ .amplify-storage-browser__preview-placeholder-info {
298
+ color: var(--amplify-colors-font-secondary);
299
+ font-size: var(--amplify-font-sizes-small);
300
+ text-align: center;
301
+ }
302
+ .amplify-storage-browser__text-container {
303
+ display: flex;
304
+ flex-flow: column nowrap;
305
+ gap: 8px;
306
+ align-items: center;
307
+ }
308
+ .amplify-storage-browser__text-preview {
309
+ height: 400px;
310
+ width: 100%;
311
+ display: block;
312
+ background-color: var(--amplify-colors-background-secondary);
313
+ border: var(--amplify-border-widths-small) solid var(--amplify-colors-border-secondary);
314
+ border-radius: var(--amplify-radii-small);
315
+ padding: var(--amplify-space-medium);
316
+ font-family: var(--amplify-fonts-monospace), monospace;
317
+ font-size: var(--amplify-font-sizes-small);
318
+ line-height: 1.5;
319
+ overflow-y: auto;
320
+ word-wrap: break-word;
321
+ white-space: pre-wrap;
322
+ word-break: break-word;
323
+ }
324
+ .amplify-storage-browser__video-container {
325
+ display: flex;
326
+ flex-flow: column nowrap;
327
+ gap: 8px;
328
+ align-items: center;
329
+ }
330
+ .amplify-storage-browser__video-preview {
331
+ display: flex;
332
+ align-items: center;
333
+ justify-content: center;
334
+ width: 100%;
335
+ height: 400px;
336
+ border-radius: var(--amplify-radii-small);
337
+ background-color: var(--amplify-colors-background-secondary);
338
+ flex-shrink: 0;
339
+ }
340
+ .amplify-storage-browser__video-preview video {
341
+ max-width: 100%;
342
+ max-height: 100%;
343
+ width: auto;
344
+ height: auto;
345
+ -o-object-fit: contain;
346
+ object-fit: contain;
347
+ }
348
+ .amplify-storage-browser__image-container {
349
+ display: flex;
350
+ flex-flow: column nowrap;
351
+ gap: 8px;
352
+ align-items: center;
353
+ }
354
+ .amplify-storage-browser__image-preview {
355
+ display: flex;
356
+ align-items: center;
357
+ justify-content: center;
358
+ height: 400px;
359
+ width: 100%;
360
+ background-color: var(--amplify-colors-background-secondary);
361
+ border-radius: var(--amplify-radii-small);
362
+ flex-shrink: 0;
363
+ flex-flow: column nowrap;
364
+ gap: 8px;
365
+ }
366
+ .amplify-storage-browser__image-preview img {
367
+ max-width: 100%;
368
+ max-height: 100%;
369
+ width: auto;
370
+ height: auto;
371
+ -o-object-fit: contain;
372
+ object-fit: contain;
373
+ border-radius: var(--amplify-radii-small);
374
+ }
375
+ .amplify-storage-browser__download-button {
376
+ display: flex;
377
+ flex-flow: row nowrap;
378
+ gap: 8px;
379
+ }
380
+ .amplify-storage-browser__download-button_icon {
381
+ animation-delay: 0s;
382
+ animation-direction: normal;
383
+ animation-duration: 1s;
384
+ animation-iteration-count: infinite;
385
+ animation-timing-function: linear;
386
+ animation-name: spin;
387
+ }
388
+
389
+ @keyframes spin {
390
+ 0% {
391
+ transform: rotate(0deg);
392
+ }
393
+ 50% {
394
+ transform: rotate(180deg);
395
+ }
396
+ 100% {
397
+ transform: rotate(360deg);
398
+ }
399
+ }
152
400
  }
package/dist/styles/liveness.css CHANGED
@@ -67,11 +67,26 @@
67
67
  z-index: 1;
68
68
  }
69
69
 
70
- .amplify-liveness-loader {
70
+ .amplify-liveness-loader .amplify-liveness-centered-loader {
71
+ transform: translate(-50%, -50%);
72
+ }
73
+
74
+ .amplify-liveness-centered-loader {
71
75
  position: absolute;
72
76
  left: 50%;
73
77
  top: 50%;
74
- transform: translate(-50%, -50%);
78
+ }
79
+
80
+ .amplify-liveness-connecting-loader {
81
+ display: flex;
82
+ position: absolute;
83
+ flex-direction: column;
84
+ justify-content: center;
85
+ align-items: center;
86
+ z-index: 3;
87
+ width: 100%;
88
+ height: 100%;
89
+ background-color: var(--amplify-colors-background-primary);
75
90
  }
76
91
 
77
92
  .amplify-liveness-oval-canvas {
package/dist/styles/liveness.layer.css CHANGED
@@ -68,11 +68,26 @@
68
68
  z-index: 1;
69
69
  }
70
70
 
71
- .amplify-liveness-loader {
71
+ .amplify-liveness-loader .amplify-liveness-centered-loader {
72
+ transform: translate(-50%, -50%);
73
+ }
74
+
75
+ .amplify-liveness-centered-loader {
72
76
  position: absolute;
73
77
  left: 50%;
74
78
  top: 50%;
75
- transform: translate(-50%, -50%);
79
+ }
80
+
81
+ .amplify-liveness-connecting-loader {
82
+ display: flex;
83
+ position: absolute;
84
+ flex-direction: column;
85
+ justify-content: center;
86
+ align-items: center;
87
+ z-index: 3;
88
+ width: 100%;
89
+ height: 100%;
90
+ background-color: var(--amplify-colors-background-primary);
76
91
  }
77
92
 
78
93
  .amplify-liveness-oval-canvas {
package/dist/styles/table.css CHANGED
@@ -83,6 +83,9 @@
83
83
  .amplify-table--striped .amplify-table__row:not(.amplify-table__head *):nth-child(odd) {
84
84
  background-color: var(--amplify-components-table-row-striped-background-color);
85
85
  }
86
+ .amplify-table--striped .amplify-table__row.amplify-storage-browser__table-row_active:nth-child(odd) {
87
+ background-color: var(--amplify-colors-background-info);
88
+ }
86
89
  .amplify-table__caption {
87
90
  caption-side: var(--amplify-components-table-caption-caption-side);
88
91
  color: var(--amplify-components-table-caption-color);
package/dist/styles/table.layer.css CHANGED
@@ -84,6 +84,9 @@
84
84
  .amplify-table--striped .amplify-table__row:not(.amplify-table__head *):nth-child(odd) {
85
85
  background-color: var(--amplify-components-table-row-striped-background-color);
86
86
  }
87
+ .amplify-table--striped .amplify-table__row.amplify-storage-browser__table-row_active:nth-child(odd) {
88
+ background-color: var(--amplify-colors-background-info);
89
+ }
87
90
  .amplify-table__caption {
88
91
  caption-side: var(--amplify-components-table-caption-caption-side);
89
92
  color: var(--amplify-components-table-caption-color);