@cloudscape-design/components 3.0.1121 → 3.0.1122
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/alert/styles.css.js +27 -27
- package/alert/styles.scoped.css +50 -50
- package/alert/styles.selectors.js +27 -27
- package/annotation-context/annotation/styles.css.js +24 -24
- package/annotation-context/annotation/styles.scoped.css +32 -32
- package/annotation-context/annotation/styles.selectors.js +24 -24
- package/app-layout/notifications/styles.css.js +3 -3
- package/app-layout/notifications/styles.scoped.css +7 -7
- package/app-layout/notifications/styles.selectors.js +3 -3
- package/app-layout/visual-refresh/styles.css.js +86 -86
- package/app-layout/visual-refresh/styles.scoped.css +258 -258
- package/app-layout/visual-refresh/styles.selectors.js +86 -86
- package/app-layout/visual-refresh-toolbar/drawer/styles.css.js +27 -27
- package/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +84 -84
- package/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +27 -27
- package/app-layout/visual-refresh-toolbar/navigation/styles.css.js +4 -4
- package/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +7 -7
- package/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +4 -4
- package/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +27 -27
- package/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +54 -54
- package/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +27 -27
- package/attribute-editor/styles.css.js +15 -15
- package/attribute-editor/styles.scoped.css +28 -28
- package/attribute-editor/styles.selectors.js +15 -15
- package/breadcrumb-group/item/styles.css.js +7 -7
- package/breadcrumb-group/item/styles.scoped.css +28 -28
- package/breadcrumb-group/item/styles.selectors.js +7 -7
- package/button/styles.css.js +22 -22
- package/button/styles.scoped.css +256 -256
- package/button/styles.selectors.js +22 -22
- package/button-dropdown/item-element/styles.css.js +16 -16
- package/button-dropdown/item-element/styles.scoped.css +27 -27
- package/button-dropdown/item-element/styles.selectors.js +16 -16
- package/checkbox/styles.css.js +3 -3
- package/checkbox/styles.scoped.css +11 -11
- package/checkbox/styles.selectors.js +3 -3
- package/content-layout/styles.css.js +14 -14
- package/content-layout/styles.scoped.css +27 -27
- package/content-layout/styles.selectors.js +14 -14
- package/flashbar/styles.css.js +50 -50
- package/flashbar/styles.scoped.css +187 -187
- package/flashbar/styles.selectors.js +50 -50
- package/help-panel/styles.css.js +6 -6
- package/help-panel/styles.scoped.css +73 -73
- package/help-panel/styles.selectors.js +6 -6
- package/input/index.d.ts.map +1 -1
- package/input/index.js +1 -1
- package/input/interfaces.d.ts +47 -0
- package/input/interfaces.d.ts.map +1 -1
- package/input/interfaces.js.map +1 -1
- package/input/internal-do-not-use-core.js +3 -2
- package/input/internal-do-not-use-core.js.map +1 -1
- package/input/internal.d.ts.map +1 -1
- package/input/internal.js +3 -2
- package/input/internal.js.map +1 -1
- package/input/styles.css.js +13 -13
- package/input/styles.d.ts +2 -0
- package/input/styles.d.ts.map +1 -0
- package/input/styles.js +42 -0
- package/input/styles.js.map +1 -0
- package/input/styles.scoped.css +66 -49
- package/input/styles.selectors.js +13 -13
- package/internal/base-component/styles.scoped.css +1 -1
- package/internal/components/drag-handle-wrapper/styles.css.js +20 -20
- package/internal/components/drag-handle-wrapper/styles.scoped.css +48 -48
- package/internal/components/drag-handle-wrapper/styles.selectors.js +20 -20
- package/internal/components/dropdown/styles.css.js +20 -20
- package/internal/components/dropdown/styles.scoped.css +38 -38
- package/internal/components/dropdown/styles.selectors.js +20 -20
- package/internal/components/token-list/styles.css.js +10 -10
- package/internal/components/token-list/styles.scoped.css +25 -25
- package/internal/components/token-list/styles.selectors.js +10 -10
- package/internal/environment.js +2 -2
- package/internal/environment.json +2 -2
- package/internal/generated/custom-css-properties/index.d.ts +12 -0
- package/internal/generated/custom-css-properties/index.d.ts.map +1 -1
- package/internal/generated/custom-css-properties/index.js +98 -86
- package/internal/generated/custom-css-properties/index.js.map +1 -1
- package/internal/manifest.json +1 -1
- package/link/styles.css.js +20 -20
- package/link/styles.scoped.css +103 -103
- package/link/styles.selectors.js +20 -20
- package/package.json +1 -1
- package/radio-group/styles.css.js +10 -10
- package/radio-group/styles.scoped.css +22 -22
- package/radio-group/styles.selectors.js +10 -10
- package/select/parts/filter.d.ts +1 -1
- package/select/parts/filter.d.ts.map +1 -1
- package/slider/styles.css.js +26 -26
- package/slider/styles.scoped.css +86 -86
- package/slider/styles.selectors.js +26 -26
- package/spinner/styles.css.js +13 -13
- package/spinner/styles.scoped.css +39 -39
- package/spinner/styles.selectors.js +13 -13
- package/tag-editor/styles.css.js +3 -3
- package/tag-editor/styles.scoped.css +13 -13
- package/tag-editor/styles.selectors.js +3 -3
- package/text-content/styles.css.js +1 -1
- package/text-content/styles.scoped.css +66 -66
- package/text-content/styles.selectors.js +1 -1
- package/toggle/styles.css.js +10 -10
- package/toggle/styles.scoped.css +23 -23
- package/toggle/styles.selectors.js +10 -10
|
@@ -146,10 +146,10 @@
|
|
|
146
146
|
*/
|
|
147
147
|
/* Style used for links in slots/components that are text heavy, to help links stand out among
|
|
148
148
|
surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
|
|
149
|
-
div.
|
|
149
|
+
div.awsui_background_hyvsj_1yok5_149:not(#\9) {
|
|
150
150
|
display: contents;
|
|
151
151
|
}
|
|
152
|
-
div.
|
|
152
|
+
div.awsui_background_hyvsj_1yok5_149 > .awsui_scrolling-background_hyvsj_1yok5_152:not(#\9) {
|
|
153
153
|
background-color: var(--color-background-layout-main-5ilwcb, #ffffff);
|
|
154
154
|
color: var(--color-text-body-default-vvtq8u, #0f141a);
|
|
155
155
|
grid-column: 1/span 5;
|
|
@@ -160,7 +160,7 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
160
160
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
161
161
|
SPDX-License-Identifier: Apache-2.0
|
|
162
162
|
*/
|
|
163
|
-
.
|
|
163
|
+
.awsui_breadcrumbs_hyvsj_1yok5_163:not(#\9) {
|
|
164
164
|
background-color: var(--color-background-layout-main-5ilwcb, #ffffff);
|
|
165
165
|
grid-area: breadcrumbs;
|
|
166
166
|
}
|
|
@@ -173,27 +173,27 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
173
173
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
174
174
|
SPDX-License-Identifier: Apache-2.0
|
|
175
175
|
*/
|
|
176
|
-
.awsui_drawers-
|
|
176
|
+
.awsui_drawers-container_hyvsj_1yok5_176:not(#\9) {
|
|
177
177
|
background-color: transparent;
|
|
178
178
|
display: flex;
|
|
179
179
|
grid-column: 5;
|
|
180
180
|
grid-row: 1/span 9;
|
|
181
|
-
block-size: var(--awsui-content-height-
|
|
181
|
+
block-size: var(--awsui-content-height-b75yp7);
|
|
182
182
|
pointer-events: none;
|
|
183
183
|
position: sticky;
|
|
184
|
-
inset-block-start: var(--awsui-offset-top-
|
|
184
|
+
inset-block-start: var(--awsui-offset-top-b75yp7);
|
|
185
185
|
z-index: 830;
|
|
186
186
|
}
|
|
187
|
-
.awsui_drawers-
|
|
187
|
+
.awsui_drawers-container_hyvsj_1yok5_176.awsui_has-open-drawer_hyvsj_1yok5_187:not(#\9) {
|
|
188
188
|
background-color: var(--color-background-container-content-6u8rvp, #ffffff);
|
|
189
189
|
}
|
|
190
190
|
@media (min-width: 689px) {
|
|
191
|
-
.awsui_drawers-
|
|
192
|
-
max-inline-size: calc(var(--awsui-layout-width-
|
|
191
|
+
.awsui_drawers-container_hyvsj_1yok5_176:not(#\9) {
|
|
192
|
+
max-inline-size: calc(var(--awsui-layout-width-b75yp7) - var(--awsui-main-offset-left-b75yp7) - var(--awsui-default-min-content-width-b75yp7) - var(--awsui-content-gap-right-b75yp7));
|
|
193
193
|
}
|
|
194
194
|
}
|
|
195
195
|
@media (max-width: 688px) {
|
|
196
|
-
.awsui_drawers-
|
|
196
|
+
.awsui_drawers-container_hyvsj_1yok5_176:not(#\9) {
|
|
197
197
|
position: fixed;
|
|
198
198
|
inset-inline-end: 0;
|
|
199
199
|
z-index: 1001;
|
|
@@ -205,12 +205,12 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
205
205
|
relative to the body.
|
|
206
206
|
*/
|
|
207
207
|
}
|
|
208
|
-
.awsui_drawers-
|
|
209
|
-
inset-block-start: var(--awsui-header-height-
|
|
208
|
+
.awsui_drawers-container_hyvsj_1yok5_176.awsui_disable-body-scroll_hyvsj_1yok5_208:not(#\9) {
|
|
209
|
+
inset-block-start: var(--awsui-header-height-b75yp7);
|
|
210
210
|
}
|
|
211
211
|
}
|
|
212
212
|
|
|
213
|
-
.awsui_drawers-desktop-triggers-
|
|
213
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1yok5_213:not(#\9) {
|
|
214
214
|
border-collapse: separate;
|
|
215
215
|
border-spacing: 0;
|
|
216
216
|
box-sizing: border-box;
|
|
@@ -248,22 +248,22 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
248
248
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
249
249
|
overscroll-behavior-y: contain;
|
|
250
250
|
}
|
|
251
|
-
.awsui_drawers-desktop-triggers-
|
|
251
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1yok5_213:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1yok5_251).awsui_has-open-drawer_hyvsj_1yok5_187 {
|
|
252
252
|
inline-size: 0;
|
|
253
253
|
}
|
|
254
|
-
.awsui_drawers-desktop-triggers-
|
|
254
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1yok5_213.awsui_has-multiple-triggers_hyvsj_1yok5_251.awsui_has-open-drawer_hyvsj_1yok5_187:not(#\9) {
|
|
255
255
|
background-color: var(--color-background-container-content-6u8rvp, #ffffff);
|
|
256
256
|
}
|
|
257
|
-
.awsui_drawers-desktop-triggers-
|
|
257
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1yok5_213:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1yok5_251):not(.awsui_has-open-drawer_hyvsj_1yok5_187) {
|
|
258
258
|
inline-size: calc(var(--space-layout-toggle-padding-chwlhz, 12px) * 2 + var(--space-layout-toggle-diameter-j2qffw, 36px));
|
|
259
259
|
}
|
|
260
260
|
|
|
261
|
-
.awsui_drawers-mobile-triggers-
|
|
261
|
+
.awsui_drawers-mobile-triggers-container_hyvsj_1yok5_261:not(#\9) {
|
|
262
262
|
display: flex;
|
|
263
263
|
justify-content: flex-end;
|
|
264
264
|
}
|
|
265
265
|
|
|
266
|
-
.awsui_drawers-trigger-
|
|
266
|
+
.awsui_drawers-trigger-content_hyvsj_1yok5_266:not(#\9) {
|
|
267
267
|
align-items: center;
|
|
268
268
|
display: flex;
|
|
269
269
|
flex-direction: column;
|
|
@@ -271,13 +271,13 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
271
271
|
padding-block-start: var(--space-scaled-s-8ozaad, 12px);
|
|
272
272
|
inline-size: calc(var(--space-layout-toggle-padding-chwlhz, 12px) * 2 + var(--space-layout-toggle-diameter-j2qffw, 36px));
|
|
273
273
|
}
|
|
274
|
-
.awsui_drawers-trigger-
|
|
274
|
+
.awsui_drawers-trigger-content_hyvsj_1yok5_266:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1yok5_251).awsui_has-open-drawer_hyvsj_1yok5_187 {
|
|
275
275
|
opacity: 0;
|
|
276
276
|
}
|
|
277
|
-
.awsui_drawers-trigger-
|
|
277
|
+
.awsui_drawers-trigger-content_hyvsj_1yok5_266:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1yok5_251):not(.awsui_has-open-drawer_hyvsj_1yok5_187) {
|
|
278
278
|
opacity: 1;
|
|
279
279
|
}
|
|
280
|
-
.awsui_drawers-trigger-
|
|
280
|
+
.awsui_drawers-trigger-content_hyvsj_1yok5_266 > .awsui_drawers-trigger-overflow_hyvsj_1yok5_280:not(#\9) {
|
|
281
281
|
padding-block: 0;
|
|
282
282
|
padding-inline: 1px;
|
|
283
283
|
display: flex;
|
|
@@ -286,15 +286,15 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
286
286
|
}
|
|
287
287
|
|
|
288
288
|
@media (max-width: 688px) {
|
|
289
|
-
.awsui_drawers-
|
|
289
|
+
.awsui_drawers-trigger_hyvsj_1yok5_266:not(#\9) {
|
|
290
290
|
inline-size: 40px;
|
|
291
291
|
display: flex;
|
|
292
292
|
justify-content: center;
|
|
293
293
|
}
|
|
294
294
|
}
|
|
295
295
|
|
|
296
|
-
.
|
|
297
|
-
--awsui-drawer-size-
|
|
296
|
+
.awsui_drawer_hyvsj_1yok5_176:not(#\9) {
|
|
297
|
+
--awsui-drawer-size-b75yp7: 290px;
|
|
298
298
|
background-color: var(--color-background-container-content-6u8rvp, #ffffff);
|
|
299
299
|
border-color: transparent;
|
|
300
300
|
display: grid;
|
|
@@ -308,52 +308,52 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
308
308
|
pointer-events: auto;
|
|
309
309
|
word-wrap: break-word;
|
|
310
310
|
}
|
|
311
|
-
.
|
|
311
|
+
.awsui_drawer_hyvsj_1yok5_176 > .awsui_drawer-content-container_hyvsj_1yok5_311:not(#\9) {
|
|
312
312
|
grid-column: 1/span 2;
|
|
313
313
|
grid-row: 1;
|
|
314
|
-
inline-size: var(--awsui-drawer-size-
|
|
314
|
+
inline-size: var(--awsui-drawer-size-b75yp7);
|
|
315
315
|
display: grid;
|
|
316
316
|
grid-template-columns: var(--space-m-dsumyt, 16px) 1fr auto var(--space-m-dsumyt, 16px);
|
|
317
317
|
grid-template-rows: var(--size-vertical-panel-icon-offset-z959cw, 15px) auto 1fr;
|
|
318
318
|
overflow-y: auto;
|
|
319
319
|
}
|
|
320
|
-
.
|
|
320
|
+
.awsui_drawer_hyvsj_1yok5_176 > .awsui_drawer-content-container_hyvsj_1yok5_311 > .awsui_drawer-close-button_hyvsj_1yok5_320:not(#\9) {
|
|
321
321
|
grid-column: 3;
|
|
322
322
|
grid-row: 2;
|
|
323
323
|
z-index: 1;
|
|
324
324
|
}
|
|
325
|
-
.
|
|
325
|
+
.awsui_drawer_hyvsj_1yok5_176 > .awsui_drawer-content-container_hyvsj_1yok5_311 > .awsui_drawer-content_hyvsj_1yok5_311:not(#\9) {
|
|
326
326
|
grid-column: 1/span 4;
|
|
327
|
-
block-size: var(--awsui-content-height-
|
|
327
|
+
block-size: var(--awsui-content-height-b75yp7);
|
|
328
328
|
}
|
|
329
|
-
.
|
|
329
|
+
.awsui_drawer_hyvsj_1yok5_176 > .awsui_drawer-content-container_hyvsj_1yok5_311 > .awsui_drawer-content_hyvsj_1yok5_311.awsui_drawer-content-hidden_hyvsj_1yok5_329:not(#\9) {
|
|
330
330
|
display: none;
|
|
331
331
|
}
|
|
332
|
-
.
|
|
332
|
+
.awsui_drawer_hyvsj_1yok5_176 > .awsui_drawer-slider_hyvsj_1yok5_332:not(#\9) {
|
|
333
333
|
grid-column: 1;
|
|
334
334
|
grid-row: 1;
|
|
335
335
|
block-size: 100%;
|
|
336
336
|
display: flex;
|
|
337
337
|
align-items: center;
|
|
338
338
|
}
|
|
339
|
-
.
|
|
339
|
+
.awsui_drawer_hyvsj_1yok5_176:not(#\9):not(.awsui_is-drawer-open_hyvsj_1yok5_339) {
|
|
340
340
|
opacity: 0;
|
|
341
341
|
inline-size: 0;
|
|
342
342
|
}
|
|
343
|
-
.
|
|
343
|
+
.awsui_drawer_hyvsj_1yok5_176.awsui_is-drawer-open_hyvsj_1yok5_339:not(#\9) {
|
|
344
344
|
border-inline-end: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-divider-default-nr68jt, #c6c6cd);
|
|
345
345
|
border-inline-start: solid var(--border-divider-section-width-uwo8my, 1px) var(--color-border-divider-default-nr68jt, #c6c6cd);
|
|
346
346
|
opacity: 1;
|
|
347
|
-
inline-size: var(--awsui-drawer-size-
|
|
347
|
+
inline-size: var(--awsui-drawer-size-b75yp7);
|
|
348
348
|
}
|
|
349
349
|
@media (min-width: 2541px) {
|
|
350
|
-
.
|
|
351
|
-
--awsui-drawer-size-
|
|
350
|
+
.awsui_drawer_hyvsj_1yok5_176.awsui_is-drawer-open_hyvsj_1yok5_339:not(#\9) {
|
|
351
|
+
--awsui-drawer-size-b75yp7: 320px;
|
|
352
352
|
}
|
|
353
353
|
}
|
|
354
354
|
@media (max-width: 688px) {
|
|
355
|
-
.
|
|
356
|
-
--awsui-drawer-size-
|
|
355
|
+
.awsui_drawer_hyvsj_1yok5_176.awsui_is-drawer-open_hyvsj_1yok5_339:not(#\9) {
|
|
356
|
+
--awsui-drawer-size-b75yp7: 100vw;
|
|
357
357
|
inline-size: 100vw;
|
|
358
358
|
}
|
|
359
359
|
}
|
|
@@ -362,7 +362,7 @@ div.awsui_background_hyvsj_ux8ph_149 > .awsui_scrolling-background_hyvsj_ux8ph_1
|
|
|
362
362
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
363
363
|
SPDX-License-Identifier: Apache-2.0
|
|
364
364
|
*/
|
|
365
|
-
header.
|
|
365
|
+
header.awsui_content_hyvsj_1yok5_365:not(#\9) {
|
|
366
366
|
grid-area: header;
|
|
367
367
|
}
|
|
368
368
|
|
|
@@ -387,35 +387,35 @@ The minimum content width property is set to zero and applied under all
|
|
|
387
387
|
circumstances regardless of whether the minContentWidth property is
|
|
388
388
|
explicitly set in script.
|
|
389
389
|
*/
|
|
390
|
-
.
|
|
391
|
-
--awsui-breadcrumbs-gap-
|
|
392
|
-
--awsui-content-gap-left-
|
|
393
|
-
--awsui-content-gap-right-
|
|
394
|
-
--awsui-content-height-
|
|
395
|
-
--awsui-default-max-content-width-
|
|
396
|
-
--awsui-default-min-content-width-
|
|
397
|
-
--awsui-footer-height-
|
|
398
|
-
--awsui-header-gap-
|
|
399
|
-
--awsui-header-height-
|
|
400
|
-
--awsui-layout-width-
|
|
401
|
-
--awsui-main-gap-
|
|
402
|
-
--awsui-main-offset-left-
|
|
403
|
-
--awsui-main-template-rows-
|
|
404
|
-
--awsui-max-content-width-
|
|
405
|
-
--awsui-min-content-width-
|
|
406
|
-
--awsui-mobile-bar-height-
|
|
407
|
-
--awsui-notifications-height-
|
|
408
|
-
--awsui-offset-top-
|
|
409
|
-
--awsui-overlap-height-
|
|
410
|
-
--awsui-toggles-left-width-
|
|
411
|
-
--awsui-toggles-right-width-
|
|
390
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9) {
|
|
391
|
+
--awsui-breadcrumbs-gap-b75yp7: 0px;
|
|
392
|
+
--awsui-content-gap-left-b75yp7: 0px;
|
|
393
|
+
--awsui-content-gap-right-b75yp7: 0px;
|
|
394
|
+
--awsui-content-height-b75yp7: calc(100vh - var(--awsui-header-height-b75yp7) - var(--awsui-footer-height-b75yp7));
|
|
395
|
+
--awsui-default-max-content-width-b75yp7: 1280px;
|
|
396
|
+
--awsui-default-min-content-width-b75yp7: 0px;
|
|
397
|
+
--awsui-footer-height-b75yp7: 0px;
|
|
398
|
+
--awsui-header-gap-b75yp7: 0px;
|
|
399
|
+
--awsui-header-height-b75yp7: 0px;
|
|
400
|
+
--awsui-layout-width-b75yp7: 0px;
|
|
401
|
+
--awsui-main-gap-b75yp7: 0px;
|
|
402
|
+
--awsui-main-offset-left-b75yp7: 0px;
|
|
403
|
+
--awsui-main-template-rows-b75yp7: 1fr;
|
|
404
|
+
--awsui-max-content-width-b75yp7: 0px;
|
|
405
|
+
--awsui-min-content-width-b75yp7: 280px;
|
|
406
|
+
--awsui-mobile-bar-height-b75yp7: calc(2 * var(--space-m-dsumyt, 16px) + var(--space-scaled-xs-xwoogq, 8px));
|
|
407
|
+
--awsui-notifications-height-b75yp7: 0px;
|
|
408
|
+
--awsui-offset-top-b75yp7: var(--awsui-header-height-b75yp7);
|
|
409
|
+
--awsui-overlap-height-b75yp7: var(--space-dark-header-overlap-distance-ld45ap, 36px);
|
|
410
|
+
--awsui-toggles-left-width-b75yp7: 0px;
|
|
411
|
+
--awsui-toggles-right-width-b75yp7: 0px;
|
|
412
412
|
background-color: var(--color-background-layout-main-5ilwcb, #ffffff);
|
|
413
413
|
color: var(--color-text-body-default-vvtq8u, #0f141a);
|
|
414
414
|
display: grid;
|
|
415
415
|
grid-template-areas: ". . mobileToolbar . ." ". . notifications . ." ". . breadcrumbsGap . ." ". . breadcrumbs . ." ". . headerGap . ." ". . header . ." ". . mainGap . ." ". . main . ." ". . main . .";
|
|
416
|
-
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-
|
|
417
|
-
grid-template-rows: auto auto var(--awsui-breadcrumbs-gap-
|
|
418
|
-
min-block-size: var(--awsui-content-height-
|
|
416
|
+
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-b75yp7), 1fr) minmax(var(--awsui-default-min-content-width-b75yp7), var(--awsui-default-max-content-width-b75yp7)) minmax(var(--awsui-content-gap-right-b75yp7), 1fr) min-content;
|
|
417
|
+
grid-template-rows: auto auto var(--awsui-breadcrumbs-gap-b75yp7) auto var(--awsui-header-gap-b75yp7) auto var(--awsui-main-gap-b75yp7) var(--awsui-overlap-height-b75yp7) var(--awsui-main-template-rows-b75yp7);
|
|
418
|
+
min-block-size: var(--awsui-content-height-b75yp7);
|
|
419
419
|
position: relative;
|
|
420
420
|
/*
|
|
421
421
|
Add unified max-width for AppLayout content based on breakpoints. Only use the max content
|
|
@@ -459,114 +459,114 @@ explicitly set in script.
|
|
|
459
459
|
*/
|
|
460
460
|
}
|
|
461
461
|
@media (min-width: 1401px) {
|
|
462
|
-
.
|
|
463
|
-
--awsui-default-max-content-width-
|
|
462
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462) {
|
|
463
|
+
--awsui-default-max-content-width-b75yp7: 1280px;
|
|
464
464
|
}
|
|
465
465
|
}
|
|
466
466
|
@media (min-width: 1921px) {
|
|
467
|
-
.
|
|
468
|
-
--awsui-default-max-content-width-
|
|
467
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462) {
|
|
468
|
+
--awsui-default-max-content-width-b75yp7: 1440px;
|
|
469
469
|
}
|
|
470
470
|
}
|
|
471
471
|
@media (min-width: 2541px) {
|
|
472
|
-
.
|
|
473
|
-
--awsui-default-max-content-width-
|
|
472
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462) {
|
|
473
|
+
--awsui-default-max-content-width-b75yp7: 1620px;
|
|
474
474
|
}
|
|
475
475
|
}
|
|
476
476
|
@media (min-width: 1401px) {
|
|
477
|
-
.
|
|
478
|
-
--awsui-default-max-content-width-
|
|
477
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462).awsui_content-type-dashboard_hyvsj_1yok5_477 {
|
|
478
|
+
--awsui-default-max-content-width-b75yp7: 1280px;
|
|
479
479
|
}
|
|
480
480
|
}
|
|
481
481
|
@media (min-width: 1921px) {
|
|
482
|
-
.
|
|
483
|
-
--awsui-default-max-content-width-
|
|
482
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462).awsui_content-type-dashboard_hyvsj_1yok5_477 {
|
|
483
|
+
--awsui-default-max-content-width-b75yp7: 1620px;
|
|
484
484
|
}
|
|
485
485
|
}
|
|
486
486
|
@media (min-width: 2541px) {
|
|
487
|
-
.
|
|
488
|
-
--awsui-default-max-content-width-
|
|
487
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462).awsui_content-type-dashboard_hyvsj_1yok5_477 {
|
|
488
|
+
--awsui-default-max-content-width-b75yp7: 2160px;
|
|
489
489
|
}
|
|
490
490
|
}
|
|
491
|
-
.
|
|
492
|
-
--awsui-default-max-content-width-
|
|
491
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462).awsui_content-type-table_hyvsj_1yok5_491, .awsui_layout_hyvsj_1yok5_390:not(#\9):not(.awsui_has-max-content-width_hyvsj_1yok5_462).awsui_content-type-cards_hyvsj_1yok5_491 {
|
|
492
|
+
--awsui-default-max-content-width-b75yp7: 100%;
|
|
493
493
|
}
|
|
494
|
-
.
|
|
495
|
-
--awsui-default-max-content-width-
|
|
494
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-max-content-width_hyvsj_1yok5_462:not(#\9) {
|
|
495
|
+
--awsui-default-max-content-width-b75yp7: var(--awsui-max-content-width-b75yp7);
|
|
496
496
|
}
|
|
497
|
-
.
|
|
498
|
-
--awsui-overlap-height-
|
|
497
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_is-overlap-disabled_hyvsj_1yok5_497:not(#\9) {
|
|
498
|
+
--awsui-overlap-height-b75yp7: 0;
|
|
499
499
|
}
|
|
500
|
-
.
|
|
501
|
-
--awsui-mobile-bar-height-
|
|
500
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_is-hide-mobile-toolbar_hyvsj_1yok5_500:not(#\9) {
|
|
501
|
+
--awsui-mobile-bar-height-b75yp7: 0px;
|
|
502
502
|
}
|
|
503
503
|
@media (min-width: 993px) {
|
|
504
|
-
.
|
|
505
|
-
--awsui-default-min-content-width-
|
|
504
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9) {
|
|
505
|
+
--awsui-default-min-content-width-b75yp7: var(--awsui-min-content-width-b75yp7, 280px);
|
|
506
506
|
}
|
|
507
507
|
}
|
|
508
508
|
@media (max-width: 992px) {
|
|
509
|
-
.
|
|
510
|
-
--awsui-default-min-content-width-
|
|
509
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9) {
|
|
510
|
+
--awsui-default-min-content-width-b75yp7: 0px;
|
|
511
511
|
}
|
|
512
512
|
}
|
|
513
513
|
@media (min-width: 689px) {
|
|
514
|
-
.
|
|
515
|
-
--awsui-content-gap-left-
|
|
514
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-content-gap-left_hyvsj_1yok5_514:not(#\9) {
|
|
515
|
+
--awsui-content-gap-left-b75yp7: var(--space-layout-content-horizontal-buc0zz, 24px);
|
|
516
516
|
}
|
|
517
|
-
.
|
|
518
|
-
--awsui-content-gap-right-
|
|
517
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-content-gap-right_hyvsj_1yok5_517:not(#\9) {
|
|
518
|
+
--awsui-content-gap-right-b75yp7: var(--space-layout-content-horizontal-buc0zz, 24px);
|
|
519
519
|
}
|
|
520
520
|
}
|
|
521
521
|
@media (max-width: 688px) {
|
|
522
|
-
.
|
|
523
|
-
--awsui-content-gap-left-
|
|
524
|
-
--awsui-content-gap-right-
|
|
522
|
+
.awsui_layout_hyvsj_1yok5_390:not(#\9) {
|
|
523
|
+
--awsui-content-gap-left-b75yp7: var(--space-l-2ud1p3, 20px);
|
|
524
|
+
--awsui-content-gap-right-b75yp7: var(--space-l-2ud1p3, 20px);
|
|
525
525
|
}
|
|
526
526
|
}
|
|
527
|
-
.
|
|
528
|
-
--awsui-breadcrumbs-gap-
|
|
527
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-breadcrumbs_hyvsj_1yok5_527:not(#\9) {
|
|
528
|
+
--awsui-breadcrumbs-gap-b75yp7: var(--space-scaled-m-m892r9, 16px);
|
|
529
529
|
}
|
|
530
|
-
.
|
|
531
|
-
--awsui-header-gap-
|
|
530
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-header_hyvsj_1yok5_530:not(#\9), .awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-notifications_hyvsj_1yok5_530:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1yok5_527).awsui_has-header_hyvsj_1yok5_530 {
|
|
531
|
+
--awsui-header-gap-b75yp7: var(--space-scaled-xs-xwoogq, 8px);
|
|
532
532
|
}
|
|
533
|
-
.
|
|
534
|
-
--awsui-header-gap-
|
|
533
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-breadcrumbs_hyvsj_1yok5_527.awsui_has-header_hyvsj_1yok5_530:not(#\9) {
|
|
534
|
+
--awsui-header-gap-b75yp7: var(--space-scaled-xs-xwoogq, 8px);
|
|
535
535
|
}
|
|
536
|
-
.
|
|
537
|
-
--awsui-main-gap-
|
|
536
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-notifications_hyvsj_1yok5_530:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1yok5_527):not(.awsui_has-header_hyvsj_1yok5_530) {
|
|
537
|
+
--awsui-main-gap-b75yp7: var(--space-xs-ymlm0b, 8px);
|
|
538
538
|
}
|
|
539
|
-
.
|
|
540
|
-
--awsui-main-gap-
|
|
539
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-breadcrumbs_hyvsj_1yok5_527:not(#\9):not(.awsui_has-header_hyvsj_1yok5_530) {
|
|
540
|
+
--awsui-main-gap-b75yp7: var(--space-scaled-xxs-pfm1nx, 4px);
|
|
541
541
|
}
|
|
542
|
-
.
|
|
543
|
-
--awsui-main-gap-
|
|
542
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-header_hyvsj_1yok5_530:not(#\9) {
|
|
543
|
+
--awsui-main-gap-b75yp7: var(--space-content-header-padding-bottom-rvy5xz, 16px);
|
|
544
544
|
}
|
|
545
|
-
.
|
|
546
|
-
--awsui-main-gap-
|
|
545
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-main_hyvsj_1yok5_545:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1yok5_545) {
|
|
546
|
+
--awsui-main-gap-b75yp7: var(--space-scaled-s-8ozaad, 12px);
|
|
547
547
|
}
|
|
548
|
-
.
|
|
549
|
-
--awsui-main-gap-
|
|
548
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-main_hyvsj_1yok5_545.awsui_disable-content-paddings_hyvsj_1yok5_545:not(#\9) {
|
|
549
|
+
--awsui-main-gap-b75yp7: 0px;
|
|
550
550
|
}
|
|
551
551
|
@media (max-width: 688px) {
|
|
552
|
-
.
|
|
553
|
-
--awsui-header-gap-
|
|
552
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-header_hyvsj_1yok5_530:not(#\9) {
|
|
553
|
+
--awsui-header-gap-b75yp7: var(--space-scaled-s-8ozaad, 12px);
|
|
554
554
|
}
|
|
555
|
-
.
|
|
556
|
-
--awsui-header-gap-
|
|
555
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-notifications_hyvsj_1yok5_530:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1yok5_527).awsui_has-header_hyvsj_1yok5_530 {
|
|
556
|
+
--awsui-header-gap-b75yp7: var(--space-scaled-s-8ozaad, 12px);
|
|
557
557
|
}
|
|
558
|
-
.
|
|
559
|
-
--awsui-main-gap-
|
|
558
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-notifications_hyvsj_1yok5_530:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1yok5_527):not(.awsui_has-header_hyvsj_1yok5_530), .awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-main_hyvsj_1yok5_545:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1yok5_545) {
|
|
559
|
+
--awsui-main-gap-b75yp7: var(--space-scaled-s-8ozaad, 12px);
|
|
560
560
|
}
|
|
561
|
-
.
|
|
562
|
-
--awsui-main-gap-
|
|
561
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_content-first-child-main_hyvsj_1yok5_545.awsui_disable-content-paddings_hyvsj_1yok5_545:not(#\9) {
|
|
562
|
+
--awsui-main-gap-b75yp7: 0px;
|
|
563
563
|
}
|
|
564
564
|
}
|
|
565
|
-
.
|
|
566
|
-
--awsui-toggles-left-width-
|
|
565
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-left-toggles-gutter_hyvsj_1yok5_565:not(#\9) {
|
|
566
|
+
--awsui-toggles-left-width-b75yp7: calc(var(--space-layout-toggle-padding-chwlhz, 12px) + 36px);
|
|
567
567
|
}
|
|
568
|
-
.
|
|
569
|
-
--awsui-toggles-right-width-
|
|
568
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_has-right-toggles-gutter_hyvsj_1yok5_568:not(#\9) {
|
|
569
|
+
--awsui-toggles-right-width-b75yp7: calc(var(--space-layout-toggle-padding-chwlhz, 12px) + 36px);
|
|
570
570
|
}
|
|
571
571
|
|
|
572
572
|
/*
|
|
@@ -579,27 +579,27 @@ not matter. The offset top value for AppLayout contentMain children with
|
|
|
579
579
|
position: sticky will be the value of the notifications height in addition to the
|
|
580
580
|
notifications top margin and some additional vertical space for aesthetics.
|
|
581
581
|
*/
|
|
582
|
-
.
|
|
583
|
-
--awsui-main-template-rows-
|
|
584
|
-
--awsui-offset-top-
|
|
585
|
-
block-size: var(--awsui-content-height-
|
|
582
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_disable-body-scroll_hyvsj_1yok5_208:not(#\9) {
|
|
583
|
+
--awsui-main-template-rows-b75yp7: 1fr auto;
|
|
584
|
+
--awsui-offset-top-b75yp7: 0px;
|
|
585
|
+
block-size: var(--awsui-content-height-b75yp7);
|
|
586
586
|
overflow-y: scroll;
|
|
587
587
|
}
|
|
588
|
-
.
|
|
589
|
-
--awsui-main-template-rows-
|
|
588
|
+
.awsui_layout_hyvsj_1yok5_390.awsui_disable-body-scroll_hyvsj_1yok5_208.awsui_has-split-panel_hyvsj_1yok5_588.awsui_split-panel-position-bottom_hyvsj_1yok5_588:not(#\9) {
|
|
589
|
+
--awsui-main-template-rows-b75yp7: repeat(2, auto);
|
|
590
590
|
}
|
|
591
591
|
|
|
592
592
|
/*
|
|
593
593
|
This CSS class is applied to the document body to prevent overflow scrolling
|
|
594
594
|
when the navigation or tools drawers are open in responsive viewports.
|
|
595
595
|
*/
|
|
596
|
-
.awsui_block-body-
|
|
596
|
+
.awsui_block-body-scroll_hyvsj_1yok5_596:not(#\9) {
|
|
597
597
|
overflow: hidden;
|
|
598
598
|
}
|
|
599
599
|
|
|
600
600
|
/* stylelint-disable selector-max-universal, selector-combinator-disallowed-list */
|
|
601
|
-
.
|
|
602
|
-
.
|
|
601
|
+
.awsui_unfocusable_hyvsj_1yok5_601:not(#\9),
|
|
602
|
+
.awsui_unfocusable_hyvsj_1yok5_601 *:not(#\9) {
|
|
603
603
|
visibility: hidden !important;
|
|
604
604
|
}
|
|
605
605
|
|
|
@@ -608,7 +608,7 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
608
608
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
609
609
|
SPDX-License-Identifier: Apache-2.0
|
|
610
610
|
*/
|
|
611
|
-
.
|
|
611
|
+
.awsui_container_hyvsj_1yok5_611:not(#\9) {
|
|
612
612
|
grid-area: main;
|
|
613
613
|
padding-block-end: var(--space-layout-content-bottom-zeb1g9, 40px);
|
|
614
614
|
/*
|
|
@@ -625,19 +625,19 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
625
625
|
on the right, we decrement the column end by one.
|
|
626
626
|
*/
|
|
627
627
|
}
|
|
628
|
-
.
|
|
629
|
-
padding-block-end: calc(var(--awsui-split-panel-height-
|
|
628
|
+
.awsui_container_hyvsj_1yok5_611.awsui_has-split-panel_hyvsj_1yok5_588.awsui_split-panel-position-bottom_hyvsj_1yok5_588:not(#\9) {
|
|
629
|
+
padding-block-end: calc(var(--awsui-split-panel-height-b75yp7) + var(--space-layout-content-bottom-zeb1g9, 40px));
|
|
630
630
|
}
|
|
631
|
-
.
|
|
631
|
+
.awsui_container_hyvsj_1yok5_611.awsui_disable-content-paddings_hyvsj_1yok5_545:not(#\9) {
|
|
632
632
|
grid-column: 1/6;
|
|
633
633
|
padding-block: 0;
|
|
634
634
|
padding-inline: 0;
|
|
635
635
|
}
|
|
636
636
|
@media (min-width: 689px) {
|
|
637
|
-
.
|
|
637
|
+
.awsui_container_hyvsj_1yok5_611.awsui_disable-content-paddings_hyvsj_1yok5_545.awsui_is-navigation-open_hyvsj_1yok5_637:not(#\9) {
|
|
638
638
|
grid-column-start: 2;
|
|
639
639
|
}
|
|
640
|
-
.
|
|
640
|
+
.awsui_container_hyvsj_1yok5_611.awsui_disable-content-paddings_hyvsj_1yok5_545.awsui_is-tools-open_hyvsj_1yok5_640:not(#\9), .awsui_container_hyvsj_1yok5_611.awsui_disable-content-paddings_hyvsj_1yok5_545.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_split-panel-position-side_hyvsj_1yok5_640:not(#\9), .awsui_container_hyvsj_1yok5_611.awsui_disable-content-paddings_hyvsj_1yok5_545.awsui_has-active-drawer_hyvsj_1yok5_640:not(#\9) {
|
|
641
641
|
grid-column-end: 5;
|
|
642
642
|
}
|
|
643
643
|
}
|
|
@@ -650,13 +650,13 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
650
650
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
651
651
|
SPDX-License-Identifier: Apache-2.0
|
|
652
652
|
*/
|
|
653
|
-
section.awsui_mobile-
|
|
653
|
+
section.awsui_mobile-toolbar_hyvsj_1yok5_653:not(#\9) {
|
|
654
654
|
align-items: center;
|
|
655
655
|
background-color: var(--color-background-layout-main-5ilwcb, #ffffff);
|
|
656
656
|
border-block-end: 1px solid var(--color-border-divider-default-nr68jt, #c6c6cd);
|
|
657
657
|
box-shadow: var(--shadow-sticky-lolw8j, 0px 4px 8px 1px rgba(0, 7, 22, 0.1));
|
|
658
658
|
box-sizing: border-box;
|
|
659
|
-
block-size: var(--awsui-mobile-bar-height-
|
|
659
|
+
block-size: var(--awsui-mobile-bar-height-b75yp7);
|
|
660
660
|
display: grid;
|
|
661
661
|
grid-area: mobileToolbar;
|
|
662
662
|
grid-column: 1/span 5;
|
|
@@ -664,22 +664,22 @@ section.awsui_mobile-toolbar_hyvsj_ux8ph_653:not(#\9) {
|
|
|
664
664
|
padding-block: 0;
|
|
665
665
|
padding-inline: var(--space-m-dsumyt, 16px);
|
|
666
666
|
position: sticky;
|
|
667
|
-
inset-block-start: var(--awsui-offset-top-
|
|
667
|
+
inset-block-start: var(--awsui-offset-top-b75yp7);
|
|
668
668
|
z-index: 1000;
|
|
669
669
|
}
|
|
670
|
-
section.awsui_mobile-
|
|
670
|
+
section.awsui_mobile-toolbar_hyvsj_1yok5_653:not(#\9):not(.awsui_remove-high-contrast-header_hyvsj_1yok5_670) {
|
|
671
671
|
background-color: var(--color-background-layout-main-5ilwcb, #ffffff);
|
|
672
672
|
box-shadow: var(--shadow-panel-toggle-qddz27, 0px 6px 12px 1px rgba(0, 7, 22, 0.12));
|
|
673
673
|
}
|
|
674
|
-
section.awsui_mobile-
|
|
674
|
+
section.awsui_mobile-toolbar_hyvsj_1yok5_653 > .awsui_mobile-toolbar-nav_hyvsj_1yok5_674:not(#\9) {
|
|
675
675
|
grid-column: 1;
|
|
676
676
|
margin-inline-end: var(--space-m-dsumyt, 16px);
|
|
677
677
|
}
|
|
678
|
-
section.awsui_mobile-
|
|
678
|
+
section.awsui_mobile-toolbar_hyvsj_1yok5_653 > .awsui_mobile-toolbar-breadcrumbs_hyvsj_1yok5_678:not(#\9) {
|
|
679
679
|
grid-column: 2;
|
|
680
680
|
background-color: var(--color-background-layout-main-5ilwcb, #ffffff);
|
|
681
681
|
}
|
|
682
|
-
section.awsui_mobile-
|
|
682
|
+
section.awsui_mobile-toolbar_hyvsj_1yok5_653 > .awsui_mobile-toolbar-tools_hyvsj_1yok5_682:not(#\9) {
|
|
683
683
|
grid-column: 3;
|
|
684
684
|
margin-inline-start: var(--space-m-dsumyt, 16px);
|
|
685
685
|
}
|
|
@@ -688,13 +688,13 @@ section.awsui_mobile-toolbar_hyvsj_ux8ph_653 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
688
688
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
689
689
|
SPDX-License-Identifier: Apache-2.0
|
|
690
690
|
*/
|
|
691
|
-
.awsui_navigation-
|
|
691
|
+
.awsui_navigation-container_hyvsj_1yok5_691:not(#\9) {
|
|
692
692
|
display: flex;
|
|
693
693
|
grid-column: 1;
|
|
694
694
|
grid-row: 1/span 9;
|
|
695
|
-
block-size: var(--awsui-content-height-
|
|
695
|
+
block-size: var(--awsui-content-height-b75yp7);
|
|
696
696
|
position: sticky;
|
|
697
|
-
inset-block-start: var(--awsui-offset-top-
|
|
697
|
+
inset-block-start: var(--awsui-offset-top-b75yp7);
|
|
698
698
|
z-index: 830;
|
|
699
699
|
/*
|
|
700
700
|
The navigation and tools containers (that contain the toggle buttons)
|
|
@@ -709,7 +709,7 @@ section.awsui_mobile-toolbar_hyvsj_ux8ph_653 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
709
709
|
pointer-events: none;
|
|
710
710
|
}
|
|
711
711
|
@media (max-width: 688px) {
|
|
712
|
-
.awsui_navigation-
|
|
712
|
+
.awsui_navigation-container_hyvsj_1yok5_691:not(#\9) {
|
|
713
713
|
inset-inline-start: 0;
|
|
714
714
|
position: fixed;
|
|
715
715
|
z-index: 1001;
|
|
@@ -721,12 +721,12 @@ section.awsui_mobile-toolbar_hyvsj_ux8ph_653 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
721
721
|
relative to the body.
|
|
722
722
|
*/
|
|
723
723
|
}
|
|
724
|
-
.awsui_navigation-
|
|
725
|
-
inset-block-start: var(--awsui-header-height-
|
|
724
|
+
.awsui_navigation-container_hyvsj_1yok5_691.awsui_disable-body-scroll_hyvsj_1yok5_208:not(#\9) {
|
|
725
|
+
inset-block-start: var(--awsui-header-height-b75yp7);
|
|
726
726
|
}
|
|
727
727
|
}
|
|
728
728
|
|
|
729
|
-
nav.awsui_show-
|
|
729
|
+
nav.awsui_show-navigation_hyvsj_1yok5_729:not(#\9) {
|
|
730
730
|
padding-block: var(--space-scaled-s-8ozaad, 12px);
|
|
731
731
|
padding-inline: var(--space-layout-toggle-padding-chwlhz, 12px);
|
|
732
732
|
/*
|
|
@@ -734,7 +734,7 @@ nav.awsui_show-navigation_hyvsj_ux8ph_729:not(#\9) {
|
|
|
734
734
|
take control in responsive viewports.
|
|
735
735
|
*/
|
|
736
736
|
}
|
|
737
|
-
@keyframes
|
|
737
|
+
@keyframes awsui_showButtons_hyvsj_1yok5_1 {
|
|
738
738
|
0% {
|
|
739
739
|
opacity: 0;
|
|
740
740
|
}
|
|
@@ -742,31 +742,31 @@ nav.awsui_show-navigation_hyvsj_ux8ph_729:not(#\9) {
|
|
|
742
742
|
opacity: 1;
|
|
743
743
|
}
|
|
744
744
|
}
|
|
745
|
-
nav.awsui_show-
|
|
745
|
+
nav.awsui_show-navigation_hyvsj_1yok5_729.awsui_is-navigation-open_hyvsj_1yok5_637:not(#\9) {
|
|
746
746
|
display: none;
|
|
747
747
|
}
|
|
748
748
|
@media (min-width: 689px) {
|
|
749
|
-
nav.awsui_show-
|
|
749
|
+
nav.awsui_show-navigation_hyvsj_1yok5_729:not(#\9):not(.awsui_is-navigation-open_hyvsj_1yok5_637) {
|
|
750
750
|
display: block;
|
|
751
751
|
}
|
|
752
|
-
nav.awsui_show-
|
|
753
|
-
animation:
|
|
752
|
+
nav.awsui_show-navigation_hyvsj_1yok5_729:not(#\9):not(.awsui_is-navigation-open_hyvsj_1yok5_637).awsui_animating_hyvsj_1yok5_752 {
|
|
753
|
+
animation: awsui_showButtons_hyvsj_1yok5_1 var(--motion-duration-refresh-only-fast-zfibh6, 115ms);
|
|
754
754
|
}
|
|
755
755
|
}
|
|
756
756
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
757
|
-
nav.awsui_show-
|
|
757
|
+
nav.awsui_show-navigation_hyvsj_1yok5_729:not(#\9):not(.awsui_is-navigation-open_hyvsj_1yok5_637).awsui_animating_hyvsj_1yok5_752 {
|
|
758
758
|
animation: none;
|
|
759
759
|
transition: none;
|
|
760
760
|
}
|
|
761
761
|
}
|
|
762
762
|
@media (min-width: 689px) {
|
|
763
|
-
.awsui-motion-disabled nav.awsui_show-
|
|
763
|
+
.awsui-motion-disabled nav.awsui_show-navigation_hyvsj_1yok5_729:not(#\9):not(.awsui_is-navigation-open_hyvsj_1yok5_637).awsui_animating_hyvsj_1yok5_752, .awsui-mode-entering nav.awsui_show-navigation_hyvsj_1yok5_729:not(#\9):not(.awsui_is-navigation-open_hyvsj_1yok5_637).awsui_animating_hyvsj_1yok5_752 {
|
|
764
764
|
animation: none;
|
|
765
765
|
transition: none;
|
|
766
766
|
}
|
|
767
767
|
}
|
|
768
768
|
|
|
769
|
-
nav.
|
|
769
|
+
nav.awsui_navigation_hyvsj_1yok5_691:not(#\9) {
|
|
770
770
|
background-color: var(--color-background-container-content-6u8rvp, #ffffff);
|
|
771
771
|
inset-block-end: 0;
|
|
772
772
|
block-size: 100%;
|
|
@@ -786,46 +786,46 @@ nav.awsui_navigation_hyvsj_ux8ph_691:not(#\9) {
|
|
|
786
786
|
prevent unwanted text wrapping.
|
|
787
787
|
*/
|
|
788
788
|
}
|
|
789
|
-
@keyframes
|
|
789
|
+
@keyframes awsui_openNavigation_hyvsj_1yok5_1 {
|
|
790
790
|
from {
|
|
791
791
|
opacity: 0;
|
|
792
792
|
inline-size: calc(var(--space-layout-toggle-padding-chwlhz, 12px) * 2 + var(--space-layout-toggle-diameter-j2qffw, 36px));
|
|
793
793
|
}
|
|
794
794
|
to {
|
|
795
795
|
opacity: 1;
|
|
796
|
-
inline-size: var(--awsui-navigation-width-
|
|
796
|
+
inline-size: var(--awsui-navigation-width-b75yp7);
|
|
797
797
|
}
|
|
798
798
|
}
|
|
799
|
-
nav.
|
|
799
|
+
nav.awsui_navigation_hyvsj_1yok5_691:not(#\9):not(.awsui_is-navigation-open_hyvsj_1yok5_637) {
|
|
800
800
|
inline-size: 0;
|
|
801
801
|
display: none;
|
|
802
802
|
}
|
|
803
|
-
nav.
|
|
804
|
-
animation:
|
|
803
|
+
nav.awsui_navigation_hyvsj_1yok5_691.awsui_is-navigation-open_hyvsj_1yok5_637.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
804
|
+
animation: awsui_openNavigation_hyvsj_1yok5_1 var(--motion-duration-refresh-only-fast-zfibh6, 115ms);
|
|
805
805
|
}
|
|
806
806
|
@media (prefers-reduced-motion: reduce) {
|
|
807
|
-
nav.
|
|
807
|
+
nav.awsui_navigation_hyvsj_1yok5_691.awsui_is-navigation-open_hyvsj_1yok5_637.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
808
808
|
animation: none;
|
|
809
809
|
transition: none;
|
|
810
810
|
}
|
|
811
811
|
}
|
|
812
|
-
.awsui-motion-disabled nav.
|
|
812
|
+
.awsui-motion-disabled nav.awsui_navigation_hyvsj_1yok5_691.awsui_is-navigation-open_hyvsj_1yok5_637.awsui_animating_hyvsj_1yok5_752:not(#\9), .awsui-mode-entering nav.awsui_navigation_hyvsj_1yok5_691.awsui_is-navigation-open_hyvsj_1yok5_637.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
813
813
|
animation: none;
|
|
814
814
|
transition: none;
|
|
815
815
|
}
|
|
816
|
-
nav.
|
|
817
|
-
inline-size: var(--awsui-navigation-width-
|
|
816
|
+
nav.awsui_navigation_hyvsj_1yok5_691 > .awsui_animated-content_hyvsj_1yok5_816:not(#\9) {
|
|
817
|
+
inline-size: var(--awsui-navigation-width-b75yp7);
|
|
818
818
|
}
|
|
819
|
-
nav.
|
|
819
|
+
nav.awsui_navigation_hyvsj_1yok5_691 > .awsui_content-container_hyvsj_1yok5_819:not(#\9) {
|
|
820
820
|
flex-grow: 1;
|
|
821
821
|
}
|
|
822
822
|
@media (max-width: 688px) {
|
|
823
|
-
nav.
|
|
824
|
-
--awsui-navigation-width-
|
|
823
|
+
nav.awsui_navigation_hyvsj_1yok5_691:not(#\9) {
|
|
824
|
+
--awsui-navigation-width-b75yp7: 100vw;
|
|
825
825
|
}
|
|
826
826
|
}
|
|
827
827
|
|
|
828
|
-
.awsui_hide-
|
|
828
|
+
.awsui_hide-navigation_hyvsj_1yok5_828:not(#\9) {
|
|
829
829
|
position: absolute;
|
|
830
830
|
inset-inline-end: var(--space-m-dsumyt, 16px);
|
|
831
831
|
inset-block-start: var(--size-vertical-panel-icon-offset-z959cw, 15px);
|
|
@@ -835,24 +835,24 @@ nav.awsui_navigation_hyvsj_ux8ph_691 > .awsui_content-container_hyvsj_ux8ph_819:
|
|
|
835
835
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
836
836
|
SPDX-License-Identifier: Apache-2.0
|
|
837
837
|
*/
|
|
838
|
-
.
|
|
838
|
+
.awsui_notifications_hyvsj_1yok5_838:not(#\9) {
|
|
839
839
|
color: var(--color-text-body-default-vvtq8u, #0f141a);
|
|
840
840
|
grid-area: notifications;
|
|
841
841
|
z-index: 850;
|
|
842
842
|
}
|
|
843
|
-
.
|
|
843
|
+
.awsui_notifications_hyvsj_1yok5_838.awsui_has-notification-content_hyvsj_1yok5_843:not(#\9) {
|
|
844
844
|
padding-block-start: var(--space-scaled-s-8ozaad, 12px);
|
|
845
845
|
}
|
|
846
846
|
@media (min-width: 689px) {
|
|
847
|
-
.
|
|
848
|
-
--awsui-flashbar-sticky-bottom-margin-
|
|
847
|
+
.awsui_notifications_hyvsj_1yok5_838.awsui_sticky-notifications_hyvsj_1yok5_847:not(#\9) {
|
|
848
|
+
--awsui-flashbar-sticky-bottom-margin-b75yp7: var(--space-xxl-32srm4, 32px);
|
|
849
849
|
position: sticky;
|
|
850
|
-
inset-block-start: var(--awsui-offset-top-
|
|
850
|
+
inset-block-start: var(--awsui-offset-top-b75yp7);
|
|
851
851
|
}
|
|
852
|
-
.
|
|
852
|
+
.awsui_notifications_hyvsj_1yok5_838.awsui_sticky-notifications_hyvsj_1yok5_847:not(#\9):not(.awsui_high-contrast_hyvsj_1yok5_852) {
|
|
853
853
|
background-color: var(--color-background-layout-main-5ilwcb, #ffffff);
|
|
854
854
|
}
|
|
855
|
-
.
|
|
855
|
+
.awsui_notifications_hyvsj_1yok5_838.awsui_has-notification-content_hyvsj_1yok5_843:not(#\9) {
|
|
856
856
|
padding-block-start: var(--space-xs-ymlm0b, 8px);
|
|
857
857
|
}
|
|
858
858
|
}
|
|
@@ -867,13 +867,13 @@ as the content area. This row is defined as 1 fractional unit which will
|
|
|
867
867
|
consume the remaining vertical space in the grid after the notifications
|
|
868
868
|
and breadcrumbs.
|
|
869
869
|
*/
|
|
870
|
-
section.awsui_split-panel-
|
|
870
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870:not(#\9) {
|
|
871
871
|
/*
|
|
872
872
|
The align self property will position the split panel at the bottom of the grid row.
|
|
873
873
|
This could be off the viewport if the content area has enough content to be scrollable.
|
|
874
874
|
*/
|
|
875
875
|
align-self: end;
|
|
876
|
-
inset-block-end: var(--awsui-footer-height-
|
|
876
|
+
inset-block-end: var(--awsui-footer-height-b75yp7);
|
|
877
877
|
display: none;
|
|
878
878
|
grid-column: 1/6;
|
|
879
879
|
grid-row: 9;
|
|
@@ -903,47 +903,47 @@ section.awsui_split-panel-bottom_hyvsj_ux8ph_870:not(#\9) {
|
|
|
903
903
|
apply the animation to the height property.
|
|
904
904
|
*/
|
|
905
905
|
}
|
|
906
|
-
@keyframes
|
|
906
|
+
@keyframes awsui_openSplitPanelBottom_hyvsj_1yok5_1 {
|
|
907
907
|
from {
|
|
908
|
-
block-size: var(--awsui-split-panel-reported-header-size-
|
|
908
|
+
block-size: var(--awsui-split-panel-reported-header-size-b75yp7, 0);
|
|
909
909
|
}
|
|
910
910
|
to {
|
|
911
|
-
block-size: var(--awsui-split-panel-reported-size-
|
|
911
|
+
block-size: var(--awsui-split-panel-reported-size-b75yp7);
|
|
912
912
|
}
|
|
913
913
|
}
|
|
914
|
-
section.awsui_split-panel-
|
|
914
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_disable-body-scroll_hyvsj_1yok5_208:not(#\9) {
|
|
915
915
|
inset-block-end: 0;
|
|
916
916
|
}
|
|
917
|
-
section.awsui_split-panel-
|
|
917
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_is-navigation-open_hyvsj_1yok5_637.awsui_position-bottom_hyvsj_1yok5_917:not(#\9) {
|
|
918
918
|
grid-column-start: 2;
|
|
919
919
|
}
|
|
920
|
-
section.awsui_split-panel-
|
|
920
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_has-open-drawer_hyvsj_1yok5_187.awsui_position-bottom_hyvsj_1yok5_917:not(#\9) {
|
|
921
921
|
grid-column-end: 5;
|
|
922
922
|
}
|
|
923
|
-
section.awsui_split-panel-
|
|
923
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_position-bottom_hyvsj_1yok5_917:not(#\9) {
|
|
924
924
|
display: block;
|
|
925
925
|
}
|
|
926
|
-
section.awsui_split-panel-
|
|
926
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1yok5_640).awsui_position-bottom_hyvsj_1yok5_917 {
|
|
927
927
|
box-shadow: rgba(0, 7, 22, 0.1) 0px -32px 32px -24px;
|
|
928
928
|
}
|
|
929
|
-
section.awsui_split-panel-
|
|
929
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_position-bottom_hyvsj_1yok5_917:not(#\9) {
|
|
930
930
|
box-shadow: var(--shadow-split-bottom-vlyulf, 0px -36px 36px -36px rgba(0, 7, 22, 0.1));
|
|
931
931
|
}
|
|
932
|
-
section.awsui_split-panel-
|
|
933
|
-
animation:
|
|
932
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_position-bottom_hyvsj_1yok5_917.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
933
|
+
animation: awsui_openSplitPanelBottom_hyvsj_1yok5_1 var(--motion-duration-refresh-only-fast-zfibh6, 115ms);
|
|
934
934
|
}
|
|
935
935
|
@media (prefers-reduced-motion: reduce) {
|
|
936
|
-
section.awsui_split-panel-
|
|
936
|
+
section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_position-bottom_hyvsj_1yok5_917.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
937
937
|
animation: none;
|
|
938
938
|
transition: none;
|
|
939
939
|
}
|
|
940
940
|
}
|
|
941
|
-
.awsui-motion-disabled section.awsui_split-panel-
|
|
941
|
+
.awsui-motion-disabled section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_position-bottom_hyvsj_1yok5_917.awsui_animating_hyvsj_1yok5_752:not(#\9), .awsui-mode-entering section.awsui_split-panel-bottom_hyvsj_1yok5_870.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_position-bottom_hyvsj_1yok5_917.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
942
942
|
animation: none;
|
|
943
943
|
transition: none;
|
|
944
944
|
}
|
|
945
945
|
|
|
946
|
-
section.awsui_split-panel-
|
|
946
|
+
section.awsui_split-panel-side_hyvsj_1yok5_946:not(#\9) {
|
|
947
947
|
block-size: 100%;
|
|
948
948
|
overflow-x: hidden;
|
|
949
949
|
pointer-events: auto;
|
|
@@ -953,15 +953,15 @@ section.awsui_split-panel-side_hyvsj_ux8ph_946:not(#\9) {
|
|
|
953
953
|
be persistent in the DOM when closed.
|
|
954
954
|
*/
|
|
955
955
|
}
|
|
956
|
-
section.awsui_split-panel-
|
|
956
|
+
section.awsui_split-panel-side_hyvsj_1yok5_946:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1yok5_640), section.awsui_split-panel-side_hyvsj_1yok5_946.awsui_position-bottom_hyvsj_1yok5_917:not(#\9) {
|
|
957
957
|
inline-size: 0;
|
|
958
958
|
}
|
|
959
|
-
section.awsui_split-panel-
|
|
960
|
-
max-inline-size: var(--awsui-split-panel-max-width-
|
|
961
|
-
min-inline-size: var(--awsui-split-panel-min-width-
|
|
959
|
+
section.awsui_split-panel-side_hyvsj_1yok5_946.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_position-side_hyvsj_1yok5_959:not(#\9) {
|
|
960
|
+
max-inline-size: var(--awsui-split-panel-max-width-b75yp7, 280px);
|
|
961
|
+
min-inline-size: var(--awsui-split-panel-min-width-b75yp7, 280px);
|
|
962
962
|
border-inline-start: solid var(--border-divider-section-width-uwo8my, 1px) var(--color-border-divider-default-nr68jt, #c6c6cd);
|
|
963
963
|
}
|
|
964
|
-
section.awsui_split-panel-
|
|
964
|
+
section.awsui_split-panel-side_hyvsj_1yok5_946.awsui_is-split-panel-open_hyvsj_1yok5_640.awsui_position-side_hyvsj_1yok5_959:not(#\9):not(.awsui_has-open-drawer_hyvsj_1yok5_187) {
|
|
965
965
|
border-inline-end: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-divider-panel-side-an0w07, #c6c6cd);
|
|
966
966
|
}
|
|
967
967
|
|
|
@@ -978,22 +978,22 @@ content width has a default value that can be set directly with the minContentWi
|
|
|
978
978
|
property. The content gap right is computed in the Layout styles based on the
|
|
979
979
|
viewport size and state of the Tools drawer.
|
|
980
980
|
*/
|
|
981
|
-
.awsui_tools-
|
|
982
|
-
--awsui-tools-max-width-
|
|
981
|
+
.awsui_tools-container_hyvsj_1yok5_981:not(#\9) {
|
|
982
|
+
--awsui-tools-max-width-b75yp7: calc(var(--awsui-layout-width-b75yp7) - var(--awsui-main-offset-left-b75yp7) - var(--awsui-default-min-content-width-b75yp7) - var(--awsui-content-gap-right-b75yp7));
|
|
983
983
|
display: flex;
|
|
984
984
|
grid-column: 5;
|
|
985
985
|
grid-row: 1/span 9;
|
|
986
|
-
block-size: var(--awsui-content-height-
|
|
987
|
-
max-inline-size: var(--awsui-tools-max-width-
|
|
986
|
+
block-size: var(--awsui-content-height-b75yp7);
|
|
987
|
+
max-inline-size: var(--awsui-tools-max-width-b75yp7);
|
|
988
988
|
position: sticky;
|
|
989
|
-
inset-block-start: var(--awsui-offset-top-
|
|
989
|
+
inset-block-start: var(--awsui-offset-top-b75yp7);
|
|
990
990
|
z-index: 830;
|
|
991
991
|
pointer-events: none;
|
|
992
992
|
}
|
|
993
993
|
@media (max-width: 688px) {
|
|
994
|
-
.awsui_tools-
|
|
995
|
-
--awsui-tools-max-width-
|
|
996
|
-
--awsui-tools-width-
|
|
994
|
+
.awsui_tools-container_hyvsj_1yok5_981:not(#\9) {
|
|
995
|
+
--awsui-tools-max-width-b75yp7: none;
|
|
996
|
+
--awsui-tools-width-b75yp7: auto;
|
|
997
997
|
position: fixed;
|
|
998
998
|
inset-inline-end: 0;
|
|
999
999
|
z-index: 1001;
|
|
@@ -1005,12 +1005,12 @@ viewport size and state of the Tools drawer.
|
|
|
1005
1005
|
relative to the body.
|
|
1006
1006
|
*/
|
|
1007
1007
|
}
|
|
1008
|
-
.awsui_tools-
|
|
1009
|
-
inset-block-start: var(--awsui-header-height-
|
|
1008
|
+
.awsui_tools-container_hyvsj_1yok5_981.awsui_disable-body-scroll_hyvsj_1yok5_208:not(#\9) {
|
|
1009
|
+
inset-block-start: var(--awsui-header-height-b75yp7);
|
|
1010
1010
|
}
|
|
1011
1011
|
}
|
|
1012
1012
|
|
|
1013
|
-
.
|
|
1013
|
+
.awsui_tools_hyvsj_1yok5_981:not(#\9) {
|
|
1014
1014
|
background-color: var(--color-background-container-content-6u8rvp, #ffffff);
|
|
1015
1015
|
flex-shrink: 0;
|
|
1016
1016
|
block-size: 100%;
|
|
@@ -1033,51 +1033,51 @@ viewport size and state of the Tools drawer.
|
|
|
1033
1033
|
in the side position.
|
|
1034
1034
|
*/
|
|
1035
1035
|
}
|
|
1036
|
-
@keyframes
|
|
1036
|
+
@keyframes awsui_openTools_hyvsj_1yok5_1 {
|
|
1037
1037
|
from {
|
|
1038
|
-
opacity: var(--awsui-tools-animation-starting-opacity-
|
|
1038
|
+
opacity: var(--awsui-tools-animation-starting-opacity-b75yp7, 0);
|
|
1039
1039
|
inline-size: calc(var(--space-layout-toggle-padding-chwlhz, 12px) * 2 + var(--space-layout-toggle-diameter-j2qffw, 36px));
|
|
1040
1040
|
}
|
|
1041
1041
|
to {
|
|
1042
1042
|
opacity: 1;
|
|
1043
|
-
inline-size: var(--awsui-tools-width-
|
|
1043
|
+
inline-size: var(--awsui-tools-width-b75yp7);
|
|
1044
1044
|
}
|
|
1045
1045
|
}
|
|
1046
|
-
.
|
|
1046
|
+
.awsui_tools_hyvsj_1yok5_981:not(#\9):not(.awsui_is-tools-open_hyvsj_1yok5_640) {
|
|
1047
1047
|
inline-size: 0;
|
|
1048
1048
|
display: none;
|
|
1049
1049
|
}
|
|
1050
|
-
.
|
|
1050
|
+
.awsui_tools_hyvsj_1yok5_981.awsui_is-tools-open_hyvsj_1yok5_640:not(#\9) {
|
|
1051
1051
|
border-inline-start: solid var(--border-divider-section-width-uwo8my, 1px) var(--color-border-divider-default-nr68jt, #c6c6cd);
|
|
1052
1052
|
}
|
|
1053
|
-
.
|
|
1054
|
-
animation:
|
|
1053
|
+
.awsui_tools_hyvsj_1yok5_981.awsui_is-tools-open_hyvsj_1yok5_640.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
1054
|
+
animation: awsui_openTools_hyvsj_1yok5_1 var(--motion-duration-refresh-only-fast-zfibh6, 115ms);
|
|
1055
1055
|
}
|
|
1056
1056
|
@media (prefers-reduced-motion: reduce) {
|
|
1057
|
-
.
|
|
1057
|
+
.awsui_tools_hyvsj_1yok5_981.awsui_is-tools-open_hyvsj_1yok5_640.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
1058
1058
|
animation: none;
|
|
1059
1059
|
transition: none;
|
|
1060
1060
|
}
|
|
1061
1061
|
}
|
|
1062
|
-
.awsui-motion-disabled .
|
|
1062
|
+
.awsui-motion-disabled .awsui_tools_hyvsj_1yok5_981.awsui_is-tools-open_hyvsj_1yok5_640.awsui_animating_hyvsj_1yok5_752:not(#\9), .awsui-mode-entering .awsui_tools_hyvsj_1yok5_981.awsui_is-tools-open_hyvsj_1yok5_640.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
1063
1063
|
animation: none;
|
|
1064
1064
|
transition: none;
|
|
1065
1065
|
}
|
|
1066
|
-
.
|
|
1067
|
-
inline-size: var(--awsui-tools-width-
|
|
1066
|
+
.awsui_tools_hyvsj_1yok5_981 > .awsui_animated-content_hyvsj_1yok5_816:not(#\9) {
|
|
1067
|
+
inline-size: var(--awsui-tools-width-b75yp7);
|
|
1068
1068
|
}
|
|
1069
1069
|
@media (min-width: 689px) {
|
|
1070
|
-
.
|
|
1070
|
+
.awsui_tools_hyvsj_1yok5_981.awsui_is-tools-open_hyvsj_1yok5_640.awsui_has-tools-form-persistence_hyvsj_1yok5_1070:not(#\9) {
|
|
1071
1071
|
border-inline-end: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-divider-default-nr68jt, #c6c6cd);
|
|
1072
1072
|
}
|
|
1073
1073
|
}
|
|
1074
1074
|
@media (max-width: 688px) {
|
|
1075
|
-
.
|
|
1076
|
-
--awsui-tools-width-
|
|
1075
|
+
.awsui_tools_hyvsj_1yok5_981:not(#\9) {
|
|
1076
|
+
--awsui-tools-width-b75yp7: 100vw;
|
|
1077
1077
|
}
|
|
1078
1078
|
}
|
|
1079
1079
|
|
|
1080
|
-
.awsui_hide-
|
|
1080
|
+
.awsui_hide-tools_hyvsj_1yok5_1080:not(#\9) {
|
|
1081
1081
|
position: absolute;
|
|
1082
1082
|
inset-inline-end: var(--space-m-dsumyt, 16px);
|
|
1083
1083
|
inset-block-start: var(--size-vertical-panel-icon-offset-z959cw, 15px);
|
|
@@ -1089,7 +1089,7 @@ Warning! If these design tokens for padding change it will adversely impact
|
|
|
1089
1089
|
the calculation used to determine the Split Panel maximum width in the
|
|
1090
1090
|
handleSplitPanelMaxWidth function in the context.
|
|
1091
1091
|
*/
|
|
1092
|
-
.awsui_show-
|
|
1092
|
+
.awsui_show-tools_hyvsj_1yok5_1092:not(#\9) {
|
|
1093
1093
|
border-collapse: separate;
|
|
1094
1094
|
border-spacing: 0;
|
|
1095
1095
|
box-sizing: border-box;
|
|
@@ -1127,7 +1127,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1127
1127
|
take control in responsive viewports.
|
|
1128
1128
|
*/
|
|
1129
1129
|
}
|
|
1130
|
-
@keyframes
|
|
1130
|
+
@keyframes awsui_showButtons_hyvsj_1yok5_1 {
|
|
1131
1131
|
0% {
|
|
1132
1132
|
opacity: 0;
|
|
1133
1133
|
}
|
|
@@ -1135,31 +1135,31 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1135
1135
|
opacity: 1;
|
|
1136
1136
|
}
|
|
1137
1137
|
}
|
|
1138
|
-
.awsui_show-
|
|
1138
|
+
.awsui_show-tools_hyvsj_1yok5_1092:not(#\9):not(.awsui_has-tools-form_hyvsj_1yok5_1070) {
|
|
1139
1139
|
display: none;
|
|
1140
1140
|
}
|
|
1141
1141
|
@media (min-width: 689px) {
|
|
1142
|
-
.awsui_show-
|
|
1142
|
+
.awsui_show-tools_hyvsj_1yok5_1092.awsui_has-tools-form_hyvsj_1yok5_1070:not(#\9) {
|
|
1143
1143
|
display: flex;
|
|
1144
1144
|
flex-direction: column;
|
|
1145
1145
|
gap: var(--space-xs-ymlm0b, 8px);
|
|
1146
1146
|
}
|
|
1147
|
-
.awsui_show-
|
|
1148
|
-
animation:
|
|
1147
|
+
.awsui_show-tools_hyvsj_1yok5_1092.awsui_has-tools-form_hyvsj_1yok5_1070.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
1148
|
+
animation: awsui_showButtons_hyvsj_1yok5_1 var(--motion-duration-refresh-only-fast-zfibh6, 115ms);
|
|
1149
1149
|
}
|
|
1150
1150
|
}
|
|
1151
1151
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
1152
|
-
.awsui_show-
|
|
1152
|
+
.awsui_show-tools_hyvsj_1yok5_1092.awsui_has-tools-form_hyvsj_1yok5_1070.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
1153
1153
|
animation: none;
|
|
1154
1154
|
transition: none;
|
|
1155
1155
|
}
|
|
1156
1156
|
}
|
|
1157
1157
|
@media (min-width: 689px) {
|
|
1158
|
-
.awsui-motion-disabled .awsui_show-
|
|
1158
|
+
.awsui-motion-disabled .awsui_show-tools_hyvsj_1yok5_1092.awsui_has-tools-form_hyvsj_1yok5_1070.awsui_animating_hyvsj_1yok5_752:not(#\9), .awsui-mode-entering .awsui_show-tools_hyvsj_1yok5_1092.awsui_has-tools-form_hyvsj_1yok5_1070.awsui_animating_hyvsj_1yok5_752:not(#\9) {
|
|
1159
1159
|
animation: none;
|
|
1160
1160
|
transition: none;
|
|
1161
1161
|
}
|
|
1162
|
-
.awsui_show-
|
|
1162
|
+
.awsui_show-tools_hyvsj_1yok5_1092.awsui_has-tools-form-persistence_hyvsj_1yok5_1070:not(#\9) {
|
|
1163
1163
|
background-color: var(--color-background-container-content-6u8rvp, #ffffff);
|
|
1164
1164
|
z-index: 1;
|
|
1165
1165
|
}
|
|
@@ -1169,7 +1169,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1169
1169
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
1170
1170
|
SPDX-License-Identifier: Apache-2.0
|
|
1171
1171
|
*/
|
|
1172
|
-
.awsui_trigger-button-
|
|
1172
|
+
.awsui_trigger-button-styles_hyvsj_1yok5_1172:not(#\9) {
|
|
1173
1173
|
background: var(--color-background-layout-toggle-default-2hgjdu, #424650);
|
|
1174
1174
|
border-start-start-radius: 50%;
|
|
1175
1175
|
border-start-end-radius: 50%;
|
|
@@ -1178,14 +1178,14 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1178
1178
|
block-size: var(--space-layout-toggle-diameter-j2qffw, 36px);
|
|
1179
1179
|
inline-size: var(--space-layout-toggle-diameter-j2qffw, 36px);
|
|
1180
1180
|
}
|
|
1181
|
-
.awsui_trigger-button-
|
|
1181
|
+
.awsui_trigger-button-styles_hyvsj_1yok5_1172:not(#\9):hover {
|
|
1182
1182
|
background: var(--color-background-layout-toggle-hover-0cpm7g, #656871);
|
|
1183
1183
|
}
|
|
1184
|
-
.awsui_trigger-button-
|
|
1184
|
+
.awsui_trigger-button-styles_hyvsj_1yok5_1172:not(#\9):active {
|
|
1185
1185
|
background: var(--color-background-layout-toggle-active-ap91vm, #424650);
|
|
1186
1186
|
}
|
|
1187
1187
|
|
|
1188
|
-
.awsui_trigger-badge-
|
|
1188
|
+
.awsui_trigger-badge-wrapper_hyvsj_1yok5_1188:not(#\9) {
|
|
1189
1189
|
position: absolute;
|
|
1190
1190
|
inset-block-start: 0;
|
|
1191
1191
|
inset-inline-start: 0;
|
|
@@ -1195,7 +1195,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1195
1195
|
clip-path: path("M34.2193 10.1845C33.3961 10.579 32.4739 10.8 31.5 10.8C28.0206 10.8 25.2 7.97939 25.2 4.5C25.2 3.52614 25.421 2.6039 25.8155 1.78066C23.4518 0.639587 20.8006 0 18 0C8.05887 0 0 8.05887 0 18C0 27.9411 8.05887 36 18 36C27.9411 36 36 27.9411 36 18C36 15.1994 35.3604 12.5482 34.2193 10.1845Z");
|
|
1196
1196
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
1197
1197
|
}
|
|
1198
|
-
.awsui_trigger-badge-
|
|
1198
|
+
.awsui_trigger-badge-wrapper_hyvsj_1yok5_1188:not(#\9):dir(rtl) {
|
|
1199
1199
|
clip-path: path("M1.78066 10.1845C2.6039 10.579 3.52615 10.8 4.5 10.8C7.97939 10.8 10.8 7.97939 10.8 4.5C10.8 3.52614 10.579 2.6039 10.1845 1.78066C12.5482 0.639587 15.1994 0 18 0C27.9411 0 36 8.05887 36 18C36 27.9411 27.9411 36 18 36C8.05887 36 0 27.9411 0 18C0 15.1994 0.639587 12.5482 1.78066 10.1845Z");
|
|
1200
1200
|
}
|
|
1201
1201
|
|
|
@@ -1204,7 +1204,7 @@ Warning! If these design tokens for width change it will adversely impact
|
|
|
1204
1204
|
the calculation used to determine the Split Panel maximum width in the
|
|
1205
1205
|
handleSplitPanelMaxWidth function in the context.
|
|
1206
1206
|
*/
|
|
1207
|
-
.
|
|
1207
|
+
.awsui_trigger_hyvsj_1yok5_1172:not(#\9) {
|
|
1208
1208
|
border-block: none;
|
|
1209
1209
|
border-inline: none;
|
|
1210
1210
|
padding-inline: 0;
|
|
@@ -1213,14 +1213,14 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1213
1213
|
pointer-events: auto;
|
|
1214
1214
|
position: relative;
|
|
1215
1215
|
}
|
|
1216
|
-
body[data-awsui-focus-visible=true] .
|
|
1216
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1yok5_1172:not(#\9):focus {
|
|
1217
1217
|
position: relative;
|
|
1218
1218
|
}
|
|
1219
|
-
body[data-awsui-focus-visible=true] .
|
|
1219
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1yok5_1172:not(#\9):focus {
|
|
1220
1220
|
outline: 2px dotted transparent;
|
|
1221
1221
|
outline-offset: calc(3px - 1px);
|
|
1222
1222
|
}
|
|
1223
|
-
body[data-awsui-focus-visible=true] .
|
|
1223
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1yok5_1172:not(#\9):focus::before {
|
|
1224
1224
|
content: " ";
|
|
1225
1225
|
display: block;
|
|
1226
1226
|
position: absolute;
|
|
@@ -1234,49 +1234,49 @@ body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_ux8ph_1172:not(#\9):foc
|
|
|
1234
1234
|
border-end-end-radius: var(--border-radius-control-default-focus-ring-1uabki, 4px);
|
|
1235
1235
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-uk47pl, #006ce0);
|
|
1236
1236
|
}
|
|
1237
|
-
.
|
|
1237
|
+
.awsui_trigger_hyvsj_1yok5_1172:not(#\9):focus {
|
|
1238
1238
|
outline: none;
|
|
1239
1239
|
}
|
|
1240
|
-
.
|
|
1240
|
+
.awsui_trigger_hyvsj_1yok5_1172.awsui_selected_hyvsj_1yok5_1240:not(#\9) {
|
|
1241
1241
|
background: var(--color-background-layout-toggle-selected-default-izfana, #006ce0);
|
|
1242
1242
|
color: var(--color-text-layout-toggle-selected-xpximc, #ffffff);
|
|
1243
1243
|
}
|
|
1244
|
-
.
|
|
1244
|
+
.awsui_trigger_hyvsj_1yok5_1172.awsui_selected_hyvsj_1yok5_1240:not(#\9):hover {
|
|
1245
1245
|
background: var(--color-background-layout-toggle-selected-hover-7953u1, #004a9e);
|
|
1246
1246
|
}
|
|
1247
|
-
.
|
|
1247
|
+
.awsui_trigger_hyvsj_1yok5_1172.awsui_selected_hyvsj_1yok5_1240:not(#\9):active {
|
|
1248
1248
|
background: var(--color-background-layout-toggle-selected-active-zcl8w3, #006ce0);
|
|
1249
1249
|
}
|
|
1250
|
-
.
|
|
1250
|
+
.awsui_trigger_hyvsj_1yok5_1172.awsui_selected_hyvsj_1yok5_1240 > .awsui_trigger-badge-wrapper_hyvsj_1yok5_1188:not(#\9) {
|
|
1251
1251
|
background: var(--color-background-layout-toggle-selected-default-izfana, #006ce0);
|
|
1252
1252
|
color: var(--color-text-layout-toggle-selected-xpximc, #ffffff);
|
|
1253
1253
|
}
|
|
1254
|
-
.
|
|
1254
|
+
.awsui_trigger_hyvsj_1yok5_1172.awsui_selected_hyvsj_1yok5_1240 > .awsui_trigger-badge-wrapper_hyvsj_1yok5_1188:not(#\9):hover {
|
|
1255
1255
|
background: var(--color-background-layout-toggle-selected-hover-7953u1, #004a9e);
|
|
1256
1256
|
}
|
|
1257
|
-
.
|
|
1257
|
+
.awsui_trigger_hyvsj_1yok5_1172.awsui_selected_hyvsj_1yok5_1240 > .awsui_trigger-badge-wrapper_hyvsj_1yok5_1188:not(#\9):active {
|
|
1258
1258
|
background: var(--color-background-layout-toggle-selected-active-zcl8w3, #006ce0);
|
|
1259
1259
|
}
|
|
1260
|
-
.
|
|
1260
|
+
.awsui_trigger_hyvsj_1yok5_1172.awsui_badge_hyvsj_1yok5_1260:not(#\9), .awsui_trigger_hyvsj_1yok5_1172.awsui_badge_hyvsj_1yok5_1260:not(#\9):hover, .awsui_trigger_hyvsj_1yok5_1172.awsui_badge_hyvsj_1yok5_1260:not(#\9):active {
|
|
1261
1261
|
background: transparent;
|
|
1262
1262
|
}
|
|
1263
1263
|
|
|
1264
|
-
.awsui_trigger-
|
|
1264
|
+
.awsui_trigger-wrapper_hyvsj_1yok5_1264:not(#\9) {
|
|
1265
1265
|
position: relative;
|
|
1266
1266
|
border-start-start-radius: 50%;
|
|
1267
1267
|
border-start-end-radius: 50%;
|
|
1268
1268
|
border-end-start-radius: 50%;
|
|
1269
1269
|
border-end-end-radius: 50%;
|
|
1270
1270
|
}
|
|
1271
|
-
.awsui_trigger-
|
|
1271
|
+
.awsui_trigger-wrapper_hyvsj_1yok5_1264:not(#\9):not(.awsui_remove-high-contrast-header_hyvsj_1yok5_670) {
|
|
1272
1272
|
box-shadow: var(--shadow-panel-toggle-qddz27, 0px 6px 12px 1px rgba(0, 7, 22, 0.12));
|
|
1273
1273
|
}
|
|
1274
1274
|
|
|
1275
|
-
.awsui_trigger-wrapper-tooltip-
|
|
1275
|
+
.awsui_trigger-wrapper-tooltip-visible_hyvsj_1yok5_1275:not(#\9) {
|
|
1276
1276
|
/* used in test-utils*/
|
|
1277
1277
|
}
|
|
1278
1278
|
|
|
1279
|
-
.
|
|
1279
|
+
.awsui_dot_hyvsj_1yok5_1279:not(#\9) {
|
|
1280
1280
|
position: absolute;
|
|
1281
1281
|
inline-size: 9px;
|
|
1282
1282
|
block-size: 9px;
|
|
@@ -1289,6 +1289,6 @@ body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_ux8ph_1172:not(#\9):foc
|
|
|
1289
1289
|
inset-inline-end: 0;
|
|
1290
1290
|
}
|
|
1291
1291
|
|
|
1292
|
-
.awsui_trigger-
|
|
1292
|
+
.awsui_trigger-tooltip_hyvsj_1yok5_1292:not(#\9) {
|
|
1293
1293
|
/* used in test-utils */
|
|
1294
1294
|
}
|