@cloudscape-design/components 3.0.606 → 3.0.608
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/annotation-context/annotation/styles.css.js +24 -24
- package/annotation-context/annotation/styles.scoped.css +30 -30
- 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 +81 -81
- package/app-layout/visual-refresh/styles.scoped.css +275 -286
- package/app-layout/visual-refresh/styles.selectors.js +81 -81
- package/content-layout/styles.css.js +7 -7
- package/content-layout/styles.scoped.css +13 -15
- package/content-layout/styles.selectors.js +7 -7
- package/flashbar/styles.css.js +47 -47
- package/flashbar/styles.scoped.css +171 -171
- package/flashbar/styles.selectors.js +47 -47
- package/form-field/internal.d.ts.map +1 -1
- package/form-field/internal.js +10 -6
- package/form-field/internal.js.map +1 -1
- package/internal/components/dropdown/styles.css.js +20 -20
- package/internal/components/dropdown/styles.scoped.css +39 -39
- package/internal/components/dropdown/styles.selectors.js +20 -20
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/generated/custom-css-properties/index.d.ts.map +1 -1
- package/internal/generated/custom-css-properties/index.js +44 -46
- package/internal/generated/custom-css-properties/index.js.map +1 -1
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
- package/popover/internal.js +1 -1
- package/popover/internal.js.map +1 -1
- package/popover/styles.css.js +50 -50
- package/popover/styles.scoped.css +64 -64
- package/popover/styles.selectors.js +50 -50
- package/spinner/styles.css.js +13 -13
- package/spinner/styles.scoped.css +39 -39
- package/spinner/styles.selectors.js +13 -13
- package/wizard/styles.css.js +32 -32
- package/wizard/styles.scoped.css +68 -68
- package/wizard/styles.selectors.js +32 -32
|
@@ -96,29 +96,29 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
96
96
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
97
97
|
SPDX-License-Identifier: Apache-2.0
|
|
98
98
|
*/
|
|
99
|
-
div.
|
|
99
|
+
div.awsui_background_hyvsj_1t7qb_99:not(#\9) {
|
|
100
100
|
display: contents;
|
|
101
101
|
}
|
|
102
|
-
div.
|
|
102
|
+
div.awsui_background_hyvsj_1t7qb_99 > .awsui_scrolling-background_hyvsj_1t7qb_102:not(#\9) {
|
|
103
103
|
background-color: var(--color-background-layout-main-nx09lr, #ffffff);
|
|
104
104
|
color: var(--color-text-body-default-at06ol, #000716);
|
|
105
105
|
grid-column: 1/span 5;
|
|
106
106
|
grid-row: 1/10;
|
|
107
107
|
}
|
|
108
|
-
div.
|
|
108
|
+
div.awsui_background_hyvsj_1t7qb_99 > .awsui_sticky-background_hyvsj_1t7qb_108:not(#\9) {
|
|
109
109
|
background-color: var(--color-background-layout-main-nx09lr, #ffffff);
|
|
110
110
|
grid-column: 1/span 5;
|
|
111
111
|
grid-row: 1/10;
|
|
112
112
|
position: sticky;
|
|
113
|
-
inset-block-start: var(--awsui-header-height-
|
|
113
|
+
inset-block-start: var(--awsui-header-height-lgosor);
|
|
114
114
|
z-index: 799;
|
|
115
115
|
}
|
|
116
|
-
div.
|
|
117
|
-
block-size: calc(var(--space-scaled-s-aqzyko, 12px) + var(--awsui-overlap-height-
|
|
116
|
+
div.awsui_background_hyvsj_1t7qb_99 > .awsui_sticky-background_hyvsj_1t7qb_108:not(#\9):not(.awsui_has-sticky-notifications_hyvsj_1t7qb_116) {
|
|
117
|
+
block-size: calc(var(--space-scaled-s-aqzyko, 12px) + var(--awsui-overlap-height-lgosor));
|
|
118
118
|
}
|
|
119
|
-
div.
|
|
119
|
+
div.awsui_background_hyvsj_1t7qb_99 > .awsui_sticky-background_hyvsj_1t7qb_108.awsui_has-sticky-notifications_hyvsj_1t7qb_116:not(#\9) {
|
|
120
120
|
block-size: calc(
|
|
121
|
-
var(--awsui-notifications-gap-
|
|
121
|
+
var(--awsui-notifications-gap-lgosor) + var(--awsui-notifications-height-lgosor) + var(--space-scaled-s-aqzyko, 12px) + var(--awsui-overlap-height-lgosor)
|
|
122
122
|
);
|
|
123
123
|
}
|
|
124
124
|
|
|
@@ -126,7 +126,7 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
126
126
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
127
127
|
SPDX-License-Identifier: Apache-2.0
|
|
128
128
|
*/
|
|
129
|
-
.
|
|
129
|
+
.awsui_breadcrumbs_hyvsj_1t7qb_129:not(#\9) {
|
|
130
130
|
background-color: var(--color-background-layout-main-nx09lr, #ffffff);
|
|
131
131
|
grid-area: breadcrumbs;
|
|
132
132
|
/*
|
|
@@ -136,7 +136,7 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
136
136
|
be lifted so it doesn't render behind the background element.
|
|
137
137
|
*/
|
|
138
138
|
}
|
|
139
|
-
.
|
|
139
|
+
.awsui_breadcrumbs_hyvsj_1t7qb_129.awsui_has-sticky-background_hyvsj_1t7qb_139:not(#\9) {
|
|
140
140
|
z-index: 799;
|
|
141
141
|
}
|
|
142
142
|
|
|
@@ -148,29 +148,29 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
148
148
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
149
149
|
SPDX-License-Identifier: Apache-2.0
|
|
150
150
|
*/
|
|
151
|
-
.awsui_drawers-
|
|
151
|
+
.awsui_drawers-container_hyvsj_1t7qb_151:not(#\9) {
|
|
152
152
|
background-color: transparent;
|
|
153
153
|
display: flex;
|
|
154
154
|
grid-column: 5;
|
|
155
155
|
grid-row: 1/span 10;
|
|
156
|
-
block-size: var(--awsui-content-height-
|
|
156
|
+
block-size: var(--awsui-content-height-lgosor);
|
|
157
157
|
pointer-events: none;
|
|
158
158
|
position: sticky;
|
|
159
|
-
inset-block-start: var(--awsui-offset-top-
|
|
159
|
+
inset-block-start: var(--awsui-offset-top-lgosor);
|
|
160
160
|
z-index: 830;
|
|
161
161
|
}
|
|
162
|
-
.awsui_drawers-
|
|
162
|
+
.awsui_drawers-container_hyvsj_1t7qb_151.awsui_has-open-drawer_hyvsj_1t7qb_162:not(#\9) {
|
|
163
163
|
background-color: var(--color-background-container-content-4un1ap, #ffffff);
|
|
164
164
|
}
|
|
165
165
|
@media (min-width: 689px) {
|
|
166
|
-
.awsui_drawers-
|
|
166
|
+
.awsui_drawers-container_hyvsj_1t7qb_151:not(#\9) {
|
|
167
167
|
/* stylelint-disable scss/operator-no-newline-after */
|
|
168
|
-
max-inline-size: calc(var(--awsui-layout-width-
|
|
168
|
+
max-inline-size: calc(var(--awsui-layout-width-lgosor) - var(--awsui-main-offset-left-lgosor) - var(--awsui-default-min-content-width-lgosor) - var(--awsui-content-gap-right-lgosor));
|
|
169
169
|
/* stylelint-enable scss/operator-no-newline-after */
|
|
170
170
|
}
|
|
171
171
|
}
|
|
172
172
|
@media (max-width: 688px) {
|
|
173
|
-
.awsui_drawers-
|
|
173
|
+
.awsui_drawers-container_hyvsj_1t7qb_151:not(#\9) {
|
|
174
174
|
position: fixed;
|
|
175
175
|
inset-inline-end: 0;
|
|
176
176
|
z-index: 1001;
|
|
@@ -182,12 +182,12 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
182
182
|
relative to the body.
|
|
183
183
|
*/
|
|
184
184
|
}
|
|
185
|
-
.awsui_drawers-
|
|
186
|
-
inset-block-start: var(--awsui-header-height-
|
|
185
|
+
.awsui_drawers-container_hyvsj_1t7qb_151.awsui_disable-body-scroll_hyvsj_1t7qb_185:not(#\9) {
|
|
186
|
+
inset-block-start: var(--awsui-header-height-lgosor);
|
|
187
187
|
}
|
|
188
188
|
}
|
|
189
189
|
|
|
190
|
-
.awsui_drawers-desktop-triggers-
|
|
190
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1t7qb_190:not(#\9) {
|
|
191
191
|
border-collapse: separate;
|
|
192
192
|
border-spacing: 0;
|
|
193
193
|
box-sizing: border-box;
|
|
@@ -229,21 +229,21 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
229
229
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
230
230
|
overscroll-behavior-y: contain;
|
|
231
231
|
}
|
|
232
|
-
.awsui_drawers-desktop-triggers-
|
|
232
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1t7qb_190:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1t7qb_231).awsui_has-open-drawer_hyvsj_1t7qb_162 {
|
|
233
233
|
inline-size: 0;
|
|
234
234
|
}
|
|
235
|
-
.awsui_drawers-desktop-triggers-
|
|
235
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1t7qb_190.awsui_has-multiple-triggers_hyvsj_1t7qb_231.awsui_has-open-drawer_hyvsj_1t7qb_162:not(#\9) {
|
|
236
236
|
background-color: var(--color-background-container-content-4un1ap, #ffffff);
|
|
237
237
|
}
|
|
238
|
-
.awsui_drawers-desktop-triggers-
|
|
238
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1t7qb_190:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1t7qb_231):not(.awsui_has-open-drawer_hyvsj_1t7qb_162) {
|
|
239
239
|
inline-size: calc(var(--space-layout-toggle-padding-lcu6qi, 12px) * 2 + var(--space-layout-toggle-diameter-hb85rk, 36px));
|
|
240
240
|
}
|
|
241
241
|
|
|
242
|
-
.awsui_drawers-mobile-triggers-
|
|
242
|
+
.awsui_drawers-mobile-triggers-container_hyvsj_1t7qb_241:not(#\9) {
|
|
243
243
|
display: flex;
|
|
244
244
|
}
|
|
245
245
|
|
|
246
|
-
.awsui_drawers-trigger-
|
|
246
|
+
.awsui_drawers-trigger-content_hyvsj_1t7qb_245:not(#\9) {
|
|
247
247
|
align-items: center;
|
|
248
248
|
display: flex;
|
|
249
249
|
flex-direction: column;
|
|
@@ -251,13 +251,13 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
251
251
|
padding-block-start: var(--space-scaled-s-aqzyko, 12px);
|
|
252
252
|
inline-size: calc(var(--space-layout-toggle-padding-lcu6qi, 12px) * 2 + var(--space-layout-toggle-diameter-hb85rk, 36px));
|
|
253
253
|
}
|
|
254
|
-
.awsui_drawers-trigger-
|
|
254
|
+
.awsui_drawers-trigger-content_hyvsj_1t7qb_245:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1t7qb_231).awsui_has-open-drawer_hyvsj_1t7qb_162 {
|
|
255
255
|
opacity: 0;
|
|
256
256
|
}
|
|
257
|
-
.awsui_drawers-trigger-
|
|
257
|
+
.awsui_drawers-trigger-content_hyvsj_1t7qb_245:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1t7qb_231):not(.awsui_has-open-drawer_hyvsj_1t7qb_162) {
|
|
258
258
|
opacity: 1;
|
|
259
259
|
}
|
|
260
|
-
.awsui_drawers-trigger-
|
|
260
|
+
.awsui_drawers-trigger-content_hyvsj_1t7qb_245 > .awsui_drawers-trigger-overflow_hyvsj_1t7qb_259:not(#\9) {
|
|
261
261
|
padding-block: 0;
|
|
262
262
|
padding-inline: 1px;
|
|
263
263
|
display: flex;
|
|
@@ -266,15 +266,15 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
266
266
|
}
|
|
267
267
|
|
|
268
268
|
@media (max-width: 688px) {
|
|
269
|
-
.awsui_drawers-
|
|
269
|
+
.awsui_drawers-trigger_hyvsj_1t7qb_245:not(#\9) {
|
|
270
270
|
inline-size: 40px;
|
|
271
271
|
display: flex;
|
|
272
272
|
justify-content: center;
|
|
273
273
|
}
|
|
274
274
|
}
|
|
275
275
|
|
|
276
|
-
.
|
|
277
|
-
--awsui-drawer-size-
|
|
276
|
+
.awsui_drawer_hyvsj_1t7qb_151:not(#\9) {
|
|
277
|
+
--awsui-drawer-size-lgosor: 290px;
|
|
278
278
|
background-color: var(--color-background-container-content-4un1ap, #ffffff);
|
|
279
279
|
border-color: transparent;
|
|
280
280
|
display: grid;
|
|
@@ -288,51 +288,51 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
288
288
|
pointer-events: auto;
|
|
289
289
|
word-wrap: break-word;
|
|
290
290
|
}
|
|
291
|
-
.
|
|
291
|
+
.awsui_drawer_hyvsj_1t7qb_151 > .awsui_drawer-content-container_hyvsj_1t7qb_290:not(#\9) {
|
|
292
292
|
grid-column: 1/span 2;
|
|
293
293
|
grid-row: 1;
|
|
294
|
-
inline-size: var(--awsui-drawer-size-
|
|
294
|
+
inline-size: var(--awsui-drawer-size-lgosor);
|
|
295
295
|
display: grid;
|
|
296
296
|
grid-template-columns: var(--space-m-udix3p, 16px) 1fr auto var(--space-m-udix3p, 16px);
|
|
297
297
|
grid-template-rows: var(--size-vertical-panel-icon-offset-wy8j08, 15px) auto 1fr;
|
|
298
298
|
overflow-y: auto;
|
|
299
299
|
}
|
|
300
|
-
.
|
|
300
|
+
.awsui_drawer_hyvsj_1t7qb_151 > .awsui_drawer-content-container_hyvsj_1t7qb_290 > .awsui_drawer-close-button_hyvsj_1t7qb_299:not(#\9) {
|
|
301
301
|
grid-column: 3;
|
|
302
302
|
grid-row: 2;
|
|
303
303
|
z-index: 1;
|
|
304
304
|
}
|
|
305
|
-
.
|
|
305
|
+
.awsui_drawer_hyvsj_1t7qb_151 > .awsui_drawer-content-container_hyvsj_1t7qb_290 > .awsui_drawer-content_hyvsj_1t7qb_290:not(#\9) {
|
|
306
306
|
grid-column: 1/span 4;
|
|
307
307
|
}
|
|
308
|
-
.
|
|
308
|
+
.awsui_drawer_hyvsj_1t7qb_151 > .awsui_drawer-content-container_hyvsj_1t7qb_290 > .awsui_drawer-content_hyvsj_1t7qb_290.awsui_drawer-content-hidden_hyvsj_1t7qb_307:not(#\9) {
|
|
309
309
|
display: none;
|
|
310
310
|
}
|
|
311
|
-
.
|
|
311
|
+
.awsui_drawer_hyvsj_1t7qb_151 > .awsui_drawer-slider_hyvsj_1t7qb_310:not(#\9) {
|
|
312
312
|
grid-column: 1;
|
|
313
313
|
grid-row: 1;
|
|
314
314
|
block-size: 100%;
|
|
315
315
|
display: flex;
|
|
316
316
|
align-items: center;
|
|
317
317
|
}
|
|
318
|
-
.
|
|
318
|
+
.awsui_drawer_hyvsj_1t7qb_151:not(#\9):not(.awsui_is-drawer-open_hyvsj_1t7qb_317) {
|
|
319
319
|
opacity: 0;
|
|
320
320
|
inline-size: 0;
|
|
321
321
|
}
|
|
322
|
-
.
|
|
322
|
+
.awsui_drawer_hyvsj_1t7qb_151.awsui_is-drawer-open_hyvsj_1t7qb_317:not(#\9) {
|
|
323
323
|
border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-divider-default-j74lyz, #b6bec9);
|
|
324
324
|
border-inline-start: solid var(--border-divider-section-width-1061zr, 1px) var(--color-border-divider-default-j74lyz, #b6bec9);
|
|
325
325
|
opacity: 1;
|
|
326
|
-
inline-size: var(--awsui-drawer-size-
|
|
326
|
+
inline-size: var(--awsui-drawer-size-lgosor);
|
|
327
327
|
}
|
|
328
328
|
@media (min-width: 2541px) {
|
|
329
|
-
.
|
|
330
|
-
--awsui-drawer-size-
|
|
329
|
+
.awsui_drawer_hyvsj_1t7qb_151.awsui_is-drawer-open_hyvsj_1t7qb_317:not(#\9) {
|
|
330
|
+
--awsui-drawer-size-lgosor: 320px;
|
|
331
331
|
}
|
|
332
332
|
}
|
|
333
333
|
@media (max-width: 688px) {
|
|
334
|
-
.
|
|
335
|
-
--awsui-drawer-size-
|
|
334
|
+
.awsui_drawer_hyvsj_1t7qb_151.awsui_is-drawer-open_hyvsj_1t7qb_317:not(#\9) {
|
|
335
|
+
--awsui-drawer-size-lgosor: 100vw;
|
|
336
336
|
inline-size: 100vw;
|
|
337
337
|
}
|
|
338
338
|
}
|
|
@@ -341,7 +341,7 @@ div.awsui_background_hyvsj_1cour_99 > .awsui_sticky-background_hyvsj_1cour_108.a
|
|
|
341
341
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
342
342
|
SPDX-License-Identifier: Apache-2.0
|
|
343
343
|
*/
|
|
344
|
-
header.
|
|
344
|
+
header.awsui_content_hyvsj_1t7qb_343:not(#\9) {
|
|
345
345
|
grid-area: header;
|
|
346
346
|
}
|
|
347
347
|
|
|
@@ -362,37 +362,35 @@ The minimum content width property is set to zero and applied under all
|
|
|
362
362
|
circumstances regardless of whether the minContentWidth property is
|
|
363
363
|
explicitly set in script.
|
|
364
364
|
*/
|
|
365
|
-
.
|
|
366
|
-
--awsui-breadcrumbs-gap-
|
|
367
|
-
--awsui-content-gap-left-
|
|
368
|
-
--awsui-content-gap-right-
|
|
369
|
-
--awsui-content-height-
|
|
370
|
-
--awsui-
|
|
371
|
-
--awsui-
|
|
372
|
-
--awsui-
|
|
373
|
-
--awsui-
|
|
374
|
-
--awsui-
|
|
375
|
-
--awsui-
|
|
376
|
-
--awsui-
|
|
377
|
-
--awsui-
|
|
378
|
-
--awsui-main-
|
|
379
|
-
--awsui-
|
|
380
|
-
--awsui-
|
|
381
|
-
--awsui-
|
|
382
|
-
--awsui-
|
|
383
|
-
--awsui-
|
|
384
|
-
--awsui-
|
|
385
|
-
--awsui-notifications-
|
|
386
|
-
--awsui-
|
|
387
|
-
--awsui-offset-top-with-notifications-iof9y8: 0px;
|
|
388
|
-
--awsui-overlap-height-iof9y8: var(--space-dark-header-overlap-distance-lxpp0s, 36px);
|
|
365
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9) {
|
|
366
|
+
--awsui-breadcrumbs-gap-lgosor: 0px;
|
|
367
|
+
--awsui-content-gap-left-lgosor: 0px;
|
|
368
|
+
--awsui-content-gap-right-lgosor: 0px;
|
|
369
|
+
--awsui-content-height-lgosor: calc(100vh - var(--awsui-header-height-lgosor) - var(--awsui-footer-height-lgosor));
|
|
370
|
+
--awsui-default-max-content-width-lgosor: 1280px;
|
|
371
|
+
--awsui-default-min-content-width-lgosor: 0px;
|
|
372
|
+
--awsui-footer-height-lgosor: 0px;
|
|
373
|
+
--awsui-header-gap-lgosor: 0px;
|
|
374
|
+
--awsui-header-height-lgosor: 0px;
|
|
375
|
+
--awsui-layout-width-lgosor: 0px;
|
|
376
|
+
--awsui-main-gap-lgosor: 0px;
|
|
377
|
+
--awsui-main-offset-left-lgosor: 0px;
|
|
378
|
+
--awsui-main-template-rows-lgosor: 1fr;
|
|
379
|
+
--awsui-max-content-width-lgosor: 0px;
|
|
380
|
+
--awsui-min-content-width-lgosor: 280px;
|
|
381
|
+
--awsui-mobile-bar-height-lgosor: calc(2 * var(--space-m-udix3p, 16px) + var(--space-scaled-xs-26e2du, 8px));
|
|
382
|
+
--awsui-notifications-gap-lgosor: 0px;
|
|
383
|
+
--awsui-notifications-height-lgosor: 0px;
|
|
384
|
+
--awsui-offset-top-lgosor: var(--awsui-header-height-lgosor);
|
|
385
|
+
--awsui-offset-top-with-notifications-lgosor: 0px;
|
|
386
|
+
--awsui-overlap-height-lgosor: var(--space-dark-header-overlap-distance-lxpp0s, 36px);
|
|
389
387
|
background-color: var(--color-background-layout-main-nx09lr, #ffffff);
|
|
390
388
|
color: var(--color-text-body-default-at06ol, #000716);
|
|
391
389
|
display: grid;
|
|
392
390
|
grid-template-areas: ". . mobileToolbar . ." ". . notificationsGap . ." ". . notifications . ." ". . breadcrumbsGap . ." ". . breadcrumbs . ." ". . headerGap . ." ". . header . ." ". . mainGap . ." ". . main . ." ". . main . .";
|
|
393
|
-
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-
|
|
394
|
-
grid-template-rows: auto var(--awsui-notifications-gap-
|
|
395
|
-
min-block-size: var(--awsui-content-height-
|
|
391
|
+
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-lgosor), 1fr) minmax(var(--awsui-default-min-content-width-lgosor), var(--awsui-default-max-content-width-lgosor)) minmax(var(--awsui-content-gap-right-lgosor), 1fr) min-content;
|
|
392
|
+
grid-template-rows: auto var(--awsui-notifications-gap-lgosor) auto var(--awsui-breadcrumbs-gap-lgosor) auto var(--awsui-header-gap-lgosor) auto var(--awsui-main-gap-lgosor) var(--awsui-overlap-height-lgosor) var(--awsui-main-template-rows-lgosor);
|
|
393
|
+
min-block-size: var(--awsui-content-height-lgosor);
|
|
396
394
|
position: relative;
|
|
397
395
|
/*
|
|
398
396
|
Add unified max-width for AppLayout content based on breakpoints. Only use the max content
|
|
@@ -445,140 +443,131 @@ explicitly set in script.
|
|
|
445
443
|
*/
|
|
446
444
|
}
|
|
447
445
|
@media (min-width: 1401px) {
|
|
448
|
-
.
|
|
449
|
-
--awsui-default-max-content-width-
|
|
446
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445) {
|
|
447
|
+
--awsui-default-max-content-width-lgosor: 1280px;
|
|
450
448
|
}
|
|
451
449
|
}
|
|
452
450
|
@media (min-width: 1921px) {
|
|
453
|
-
.
|
|
454
|
-
--awsui-default-max-content-width-
|
|
451
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445) {
|
|
452
|
+
--awsui-default-max-content-width-lgosor: 1440px;
|
|
455
453
|
}
|
|
456
454
|
}
|
|
457
455
|
@media (min-width: 2541px) {
|
|
458
|
-
.
|
|
459
|
-
--awsui-default-max-content-width-
|
|
456
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445) {
|
|
457
|
+
--awsui-default-max-content-width-lgosor: 1620px;
|
|
460
458
|
}
|
|
461
459
|
}
|
|
462
460
|
@media (min-width: 1401px) {
|
|
463
|
-
.
|
|
464
|
-
--awsui-default-max-content-width-
|
|
461
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445).awsui_content-type-dashboard_hyvsj_1t7qb_460 {
|
|
462
|
+
--awsui-default-max-content-width-lgosor: 1280px;
|
|
465
463
|
}
|
|
466
464
|
}
|
|
467
465
|
@media (min-width: 1921px) {
|
|
468
|
-
.
|
|
469
|
-
--awsui-default-max-content-width-
|
|
466
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445).awsui_content-type-dashboard_hyvsj_1t7qb_460 {
|
|
467
|
+
--awsui-default-max-content-width-lgosor: 1620px;
|
|
470
468
|
}
|
|
471
469
|
}
|
|
472
470
|
@media (min-width: 2541px) {
|
|
473
|
-
.
|
|
474
|
-
--awsui-default-max-content-width-
|
|
471
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445).awsui_content-type-dashboard_hyvsj_1t7qb_460 {
|
|
472
|
+
--awsui-default-max-content-width-lgosor: 2160px;
|
|
475
473
|
}
|
|
476
474
|
}
|
|
477
|
-
.
|
|
478
|
-
--awsui-default-max-content-width-
|
|
475
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445).awsui_content-type-table_hyvsj_1t7qb_474, .awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-max-content-width_hyvsj_1t7qb_445).awsui_content-type-cards_hyvsj_1t7qb_474 {
|
|
476
|
+
--awsui-default-max-content-width-lgosor: 100%;
|
|
479
477
|
}
|
|
480
|
-
.
|
|
481
|
-
--awsui-default-max-content-width-
|
|
478
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-max-content-width_hyvsj_1t7qb_445:not(#\9) {
|
|
479
|
+
--awsui-default-max-content-width-lgosor: var(--awsui-max-content-width-lgosor);
|
|
482
480
|
}
|
|
483
|
-
.
|
|
484
|
-
--awsui-overlap-height-
|
|
481
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_is-overlap-disabled_hyvsj_1t7qb_480:not(#\9) {
|
|
482
|
+
--awsui-overlap-height-lgosor: 0;
|
|
485
483
|
}
|
|
486
|
-
.
|
|
487
|
-
--awsui-mobile-bar-height-
|
|
484
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_is-hide-mobile-toolbar_hyvsj_1t7qb_483:not(#\9) {
|
|
485
|
+
--awsui-mobile-bar-height-lgosor: 0px;
|
|
488
486
|
}
|
|
489
487
|
@media (min-width: 993px) {
|
|
490
|
-
.
|
|
491
|
-
--awsui-default-min-content-width-
|
|
488
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9) {
|
|
489
|
+
--awsui-default-min-content-width-lgosor: var(--awsui-min-content-width-lgosor, 280px);
|
|
492
490
|
}
|
|
493
491
|
}
|
|
494
492
|
@media (max-width: 992px) {
|
|
495
|
-
.
|
|
496
|
-
--awsui-default-min-content-width-
|
|
493
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9) {
|
|
494
|
+
--awsui-default-min-content-width-lgosor: 0px;
|
|
497
495
|
}
|
|
498
496
|
}
|
|
499
|
-
.
|
|
500
|
-
--awsui-offset-top-with-notifications-
|
|
497
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-sticky-notifications_hyvsj_1t7qb_116):not(.awsui_has-sticky-background_hyvsj_1t7qb_139) {
|
|
498
|
+
--awsui-offset-top-with-notifications-lgosor: var(--awsui-header-height-lgosor);
|
|
501
499
|
}
|
|
502
|
-
.
|
|
503
|
-
--awsui-offset-top-with-notifications-
|
|
500
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9):not(.awsui_has-sticky-notifications_hyvsj_1t7qb_116).awsui_has-sticky-background_hyvsj_1t7qb_139 {
|
|
501
|
+
--awsui-offset-top-with-notifications-lgosor: calc(var(--awsui-header-height-lgosor) + var(--space-scaled-s-aqzyko, 12px));
|
|
504
502
|
}
|
|
505
|
-
.
|
|
506
|
-
--awsui-offset-top-with-notifications-
|
|
507
|
-
var(--awsui-offset-top-
|
|
508
|
-
var(--awsui-notifications-height-
|
|
503
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-sticky-notifications_hyvsj_1t7qb_116:not(#\9):not(.awsui_has-sticky-background_hyvsj_1t7qb_139) {
|
|
504
|
+
--awsui-offset-top-with-notifications-lgosor: calc(
|
|
505
|
+
var(--awsui-offset-top-lgosor) + var(--awsui-notifications-gap-lgosor) +
|
|
506
|
+
var(--awsui-notifications-height-lgosor) + var(--space-xxxs-zbmxqb, 2px)
|
|
509
507
|
);
|
|
510
508
|
}
|
|
511
|
-
.
|
|
512
|
-
--awsui-offset-top-with-notifications-
|
|
513
|
-
var(--awsui-offset-top-
|
|
514
|
-
var(--awsui-notifications-height-
|
|
509
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-sticky-notifications_hyvsj_1t7qb_116.awsui_has-sticky-background_hyvsj_1t7qb_139:not(#\9) {
|
|
510
|
+
--awsui-offset-top-with-notifications-lgosor: calc(
|
|
511
|
+
var(--awsui-offset-top-lgosor) + var(--awsui-notifications-gap-lgosor) +
|
|
512
|
+
var(--awsui-notifications-height-lgosor) + var(--space-scaled-s-aqzyko, 12px)
|
|
515
513
|
);
|
|
516
514
|
}
|
|
517
515
|
@media (min-width: 689px) {
|
|
518
|
-
.
|
|
519
|
-
--awsui-content-gap-left-
|
|
516
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-content-gap-left_hyvsj_1t7qb_515:not(#\9) {
|
|
517
|
+
--awsui-content-gap-left-lgosor: var(--space-layout-content-horizontal-7l52k3, 24px);
|
|
520
518
|
}
|
|
521
|
-
.
|
|
522
|
-
--awsui-content-gap-right-
|
|
519
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-content-gap-right_hyvsj_1t7qb_518:not(#\9) {
|
|
520
|
+
--awsui-content-gap-right-lgosor: var(--space-layout-content-horizontal-7l52k3, 24px);
|
|
523
521
|
}
|
|
524
522
|
}
|
|
525
523
|
@media (max-width: 688px) {
|
|
526
|
-
.
|
|
527
|
-
--awsui-content-gap-left-
|
|
528
|
-
--awsui-content-gap-right-
|
|
524
|
+
.awsui_layout_hyvsj_1t7qb_364:not(#\9) {
|
|
525
|
+
--awsui-content-gap-left-lgosor: var(--space-l-t419sm, 20px);
|
|
526
|
+
--awsui-content-gap-right-lgosor: var(--space-l-t419sm, 20px);
|
|
529
527
|
}
|
|
530
528
|
}
|
|
531
|
-
.
|
|
532
|
-
--awsui-notifications-gap-
|
|
529
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-notifications_hyvsj_1t7qb_528:not(#\9) {
|
|
530
|
+
--awsui-notifications-gap-lgosor: var(--space-xs-zb16t3, 8px);
|
|
533
531
|
}
|
|
534
|
-
.
|
|
535
|
-
--awsui-breadcrumbs-gap-
|
|
532
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-breadcrumbs_hyvsj_1t7qb_531:not(#\9) {
|
|
533
|
+
--awsui-breadcrumbs-gap-lgosor: var(--space-scaled-m-mo5yse, 16px);
|
|
536
534
|
}
|
|
537
|
-
.
|
|
538
|
-
--awsui-header-gap-
|
|
535
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-header_hyvsj_1t7qb_534:not(#\9), .awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-notifications_hyvsj_1t7qb_528:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1t7qb_531).awsui_has-header_hyvsj_1t7qb_534 {
|
|
536
|
+
--awsui-header-gap-lgosor: var(--space-scaled-xs-26e2du, 8px);
|
|
539
537
|
}
|
|
540
|
-
.
|
|
541
|
-
--awsui-header-gap-
|
|
538
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-breadcrumbs_hyvsj_1t7qb_531.awsui_has-header_hyvsj_1t7qb_534:not(#\9) {
|
|
539
|
+
--awsui-header-gap-lgosor: var(--space-scaled-xs-26e2du, 8px);
|
|
542
540
|
}
|
|
543
|
-
.
|
|
544
|
-
--awsui-main-gap-
|
|
541
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-notifications_hyvsj_1t7qb_528:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1t7qb_531):not(.awsui_has-header_hyvsj_1t7qb_534) {
|
|
542
|
+
--awsui-main-gap-lgosor: var(--space-xs-zb16t3, 8px);
|
|
545
543
|
}
|
|
546
|
-
.
|
|
547
|
-
--awsui-
|
|
544
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-breadcrumbs_hyvsj_1t7qb_531:not(#\9):not(.awsui_has-header_hyvsj_1t7qb_534).awsui_is-overlap-disabled_hyvsj_1t7qb_480 {
|
|
545
|
+
--awsui-main-gap-lgosor: var(--space-scaled-m-mo5yse, 16px);
|
|
548
546
|
}
|
|
549
|
-
.
|
|
550
|
-
--awsui-main-gap-
|
|
547
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-breadcrumbs_hyvsj_1t7qb_531:not(#\9):not(.awsui_has-header_hyvsj_1t7qb_534):not(.awsui_is-overlap-disabled_hyvsj_1t7qb_480) {
|
|
548
|
+
--awsui-main-gap-lgosor: var(--space-scaled-xxs-7597g1, 4px);
|
|
551
549
|
}
|
|
552
|
-
.
|
|
553
|
-
--awsui-main-gap-
|
|
550
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_has-header_hyvsj_1t7qb_534:not(#\9) {
|
|
551
|
+
--awsui-main-gap-lgosor: var(--space-content-header-padding-bottom-y2enua, 16px);
|
|
554
552
|
}
|
|
555
|
-
.
|
|
556
|
-
--awsui-main-gap-
|
|
557
|
-
}
|
|
558
|
-
.awsui_layout_hyvsj_1cour_364.awsui_content-first-child-main_hyvsj_1cour_557:not(#\9):not(.awsui_is-overlap-disabled_hyvsj_1cour_482), .awsui_layout_hyvsj_1cour_364.awsui_content-first-child-main_hyvsj_1cour_557.awsui_is-overlap-disabled_hyvsj_1cour_482:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1cour_557) {
|
|
559
|
-
--awsui-main-gap-iof9y8: var(--space-scaled-s-aqzyko, 12px);
|
|
560
|
-
}
|
|
561
|
-
@media (min-width: 689px) {
|
|
562
|
-
.awsui_layout_hyvsj_1cour_364.awsui_content-first-child-main_hyvsj_1cour_557:not(#\9):not(.awsui_has-header_hyvsj_1cour_536) {
|
|
563
|
-
--awsui-container-first-overlap-extension-iof9y8: var(--space-m-udix3p, 16px);
|
|
564
|
-
--awsui-container-first-gap-iof9y8: var(--space-xxs-p8yyaw, 4px);
|
|
565
|
-
}
|
|
553
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-main_hyvsj_1t7qb_552:not(#\9):not(.awsui_is-overlap-disabled_hyvsj_1t7qb_480), .awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-main_hyvsj_1t7qb_552.awsui_is-overlap-disabled_hyvsj_1t7qb_480:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1t7qb_552) {
|
|
554
|
+
--awsui-main-gap-lgosor: var(--space-scaled-s-aqzyko, 12px);
|
|
566
555
|
}
|
|
567
556
|
@media (max-width: 688px) {
|
|
568
|
-
.
|
|
569
|
-
--awsui-notifications-gap-
|
|
557
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-notifications_hyvsj_1t7qb_528:not(#\9) {
|
|
558
|
+
--awsui-notifications-gap-lgosor: var(--space-scaled-s-aqzyko, 12px);
|
|
570
559
|
}
|
|
571
|
-
.
|
|
572
|
-
--awsui-header-gap-
|
|
560
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-header_hyvsj_1t7qb_534:not(#\9) {
|
|
561
|
+
--awsui-header-gap-lgosor: var(--space-scaled-s-aqzyko, 12px);
|
|
573
562
|
}
|
|
574
|
-
.
|
|
575
|
-
--awsui-header-gap-
|
|
563
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-notifications_hyvsj_1t7qb_528:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1t7qb_531).awsui_has-header_hyvsj_1t7qb_534 {
|
|
564
|
+
--awsui-header-gap-lgosor: var(--space-scaled-s-aqzyko, 12px);
|
|
576
565
|
}
|
|
577
|
-
.
|
|
578
|
-
--awsui-main-gap-
|
|
566
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-notifications_hyvsj_1t7qb_528:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1t7qb_531):not(.awsui_has-header_hyvsj_1t7qb_534), .awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-main_hyvsj_1t7qb_552:not(#\9):not(.awsui_is-overlap-disabled_hyvsj_1t7qb_480) {
|
|
567
|
+
--awsui-main-gap-lgosor: var(--space-scaled-s-aqzyko, 12px);
|
|
579
568
|
}
|
|
580
|
-
.
|
|
581
|
-
--awsui-main-gap-
|
|
569
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_content-first-child-main_hyvsj_1t7qb_552.awsui_is-overlap-disabled_hyvsj_1t7qb_480:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1t7qb_552) {
|
|
570
|
+
--awsui-main-gap-lgosor: var(--space-scaled-m-mo5yse, 16px);
|
|
582
571
|
}
|
|
583
572
|
}
|
|
584
573
|
|
|
@@ -592,21 +581,21 @@ not matter. The offset top value for AppLayout contentMain children with
|
|
|
592
581
|
position: sticky will be the value of the notifications height in addition to the
|
|
593
582
|
notifications top margin and some additional vertical space for aesthetics.
|
|
594
583
|
*/
|
|
595
|
-
.
|
|
596
|
-
--awsui-main-template-rows-
|
|
597
|
-
--awsui-offset-top-
|
|
598
|
-
block-size: var(--awsui-content-height-
|
|
584
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_disable-body-scroll_hyvsj_1t7qb_185:not(#\9) {
|
|
585
|
+
--awsui-main-template-rows-lgosor: 1fr auto;
|
|
586
|
+
--awsui-offset-top-lgosor: 0px;
|
|
587
|
+
block-size: var(--awsui-content-height-lgosor);
|
|
599
588
|
overflow-y: scroll;
|
|
600
589
|
}
|
|
601
|
-
.
|
|
602
|
-
--awsui-main-template-rows-
|
|
590
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_disable-body-scroll_hyvsj_1t7qb_185.awsui_has-split-panel_hyvsj_1t7qb_589.awsui_split-panel-position-bottom_hyvsj_1t7qb_589:not(#\9) {
|
|
591
|
+
--awsui-main-template-rows-lgosor: repeat(2, auto);
|
|
603
592
|
}
|
|
604
|
-
.
|
|
605
|
-
--awsui-offset-top-with-notifications-
|
|
593
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_disable-body-scroll_hyvsj_1t7qb_185:not(#\9):not(.awsui_has-sticky-notifications_hyvsj_1t7qb_116) {
|
|
594
|
+
--awsui-offset-top-with-notifications-lgosor: 0px;
|
|
606
595
|
}
|
|
607
|
-
.
|
|
608
|
-
--awsui-offset-top-with-notifications-
|
|
609
|
-
var(--awsui-notifications-height-
|
|
596
|
+
.awsui_layout_hyvsj_1t7qb_364.awsui_disable-body-scroll_hyvsj_1t7qb_185.awsui_has-sticky-notifications_hyvsj_1t7qb_116:not(#\9) {
|
|
597
|
+
--awsui-offset-top-with-notifications-lgosor: calc(
|
|
598
|
+
var(--awsui-notifications-height-lgosor) + var(--space-xs-zb16t3, 8px) + var(--space-xxs-p8yyaw, 4px)
|
|
610
599
|
);
|
|
611
600
|
}
|
|
612
601
|
|
|
@@ -614,13 +603,13 @@ notifications top margin and some additional vertical space for aesthetics.
|
|
|
614
603
|
This CSS class is applied to the document body to prevent overflow scrolling
|
|
615
604
|
when the navigation or tools drawers are open in responsive viewports.
|
|
616
605
|
*/
|
|
617
|
-
.awsui_block-body-
|
|
606
|
+
.awsui_block-body-scroll_hyvsj_1t7qb_605:not(#\9) {
|
|
618
607
|
overflow: hidden;
|
|
619
608
|
}
|
|
620
609
|
|
|
621
610
|
/* stylelint-disable selector-max-universal, selector-combinator-disallowed-list */
|
|
622
|
-
.
|
|
623
|
-
.
|
|
611
|
+
.awsui_unfocusable_hyvsj_1t7qb_610:not(#\9),
|
|
612
|
+
.awsui_unfocusable_hyvsj_1t7qb_610 *:not(#\9) {
|
|
624
613
|
visibility: hidden !important;
|
|
625
614
|
}
|
|
626
615
|
|
|
@@ -629,7 +618,7 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
629
618
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
630
619
|
SPDX-License-Identifier: Apache-2.0
|
|
631
620
|
*/
|
|
632
|
-
.
|
|
621
|
+
.awsui_container_hyvsj_1t7qb_620:not(#\9) {
|
|
633
622
|
grid-area: main;
|
|
634
623
|
padding-block-end: var(--space-layout-content-bottom-noqzmw, 40px);
|
|
635
624
|
/*
|
|
@@ -646,19 +635,19 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
646
635
|
on the right, we decrement the column end by one.
|
|
647
636
|
*/
|
|
648
637
|
}
|
|
649
|
-
.
|
|
650
|
-
padding-block-end: calc(var(--awsui-split-panel-height-
|
|
638
|
+
.awsui_container_hyvsj_1t7qb_620.awsui_has-split-panel_hyvsj_1t7qb_589.awsui_split-panel-position-bottom_hyvsj_1t7qb_589:not(#\9) {
|
|
639
|
+
padding-block-end: calc(var(--awsui-split-panel-height-lgosor) + var(--space-layout-content-bottom-noqzmw, 40px));
|
|
651
640
|
}
|
|
652
|
-
.
|
|
641
|
+
.awsui_container_hyvsj_1t7qb_620.awsui_disable-content-paddings_hyvsj_1t7qb_552:not(#\9) {
|
|
653
642
|
grid-column: 1/6;
|
|
654
643
|
padding-block: 0;
|
|
655
644
|
padding-inline: 0;
|
|
656
645
|
}
|
|
657
646
|
@media (min-width: 689px) {
|
|
658
|
-
.
|
|
647
|
+
.awsui_container_hyvsj_1t7qb_620.awsui_disable-content-paddings_hyvsj_1t7qb_552.awsui_is-navigation-open_hyvsj_1t7qb_646:not(#\9) {
|
|
659
648
|
grid-column-start: 2;
|
|
660
649
|
}
|
|
661
|
-
.
|
|
650
|
+
.awsui_container_hyvsj_1t7qb_620.awsui_disable-content-paddings_hyvsj_1t7qb_552.awsui_is-tools-open_hyvsj_1t7qb_649:not(#\9), .awsui_container_hyvsj_1t7qb_620.awsui_disable-content-paddings_hyvsj_1t7qb_552.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_split-panel-position-side_hyvsj_1t7qb_649:not(#\9), .awsui_container_hyvsj_1t7qb_620.awsui_disable-content-paddings_hyvsj_1t7qb_552.awsui_has-active-drawer_hyvsj_1t7qb_649:not(#\9) {
|
|
662
651
|
grid-column-end: 5;
|
|
663
652
|
}
|
|
664
653
|
}
|
|
@@ -667,13 +656,13 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
667
656
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
668
657
|
SPDX-License-Identifier: Apache-2.0
|
|
669
658
|
*/
|
|
670
|
-
section.awsui_mobile-
|
|
659
|
+
section.awsui_mobile-toolbar_hyvsj_1t7qb_658:not(#\9) {
|
|
671
660
|
align-items: center;
|
|
672
661
|
background-color: var(--color-background-layout-main-nx09lr, #ffffff);
|
|
673
662
|
border-block-end: 1px solid var(--color-border-divider-default-j74lyz, #b6bec9);
|
|
674
663
|
box-shadow: var(--shadow-sticky-blixp9, 0px 4px 8px 1px rgba(0, 7, 22, 0.1));
|
|
675
664
|
box-sizing: border-box;
|
|
676
|
-
block-size: var(--awsui-mobile-bar-height-
|
|
665
|
+
block-size: var(--awsui-mobile-bar-height-lgosor);
|
|
677
666
|
display: grid;
|
|
678
667
|
grid-area: mobileToolbar;
|
|
679
668
|
grid-column: 1/span 5;
|
|
@@ -681,22 +670,22 @@ section.awsui_mobile-toolbar_hyvsj_1cour_669:not(#\9) {
|
|
|
681
670
|
padding-block: 0;
|
|
682
671
|
padding-inline: var(--space-m-udix3p, 16px);
|
|
683
672
|
position: sticky;
|
|
684
|
-
inset-block-start: var(--awsui-offset-top-
|
|
673
|
+
inset-block-start: var(--awsui-offset-top-lgosor);
|
|
685
674
|
z-index: 1000;
|
|
686
675
|
}
|
|
687
|
-
section.awsui_mobile-
|
|
676
|
+
section.awsui_mobile-toolbar_hyvsj_1t7qb_658:not(#\9):not(.awsui_remove-high-contrast-header_hyvsj_1t7qb_675) {
|
|
688
677
|
background-color: var(--color-background-layout-main-nx09lr, #ffffff);
|
|
689
678
|
box-shadow: var(--shadow-panel-toggle-0l64f2, 0px 6px 12px 1px rgba(0, 7, 22, 0.12));
|
|
690
679
|
}
|
|
691
|
-
section.awsui_mobile-
|
|
680
|
+
section.awsui_mobile-toolbar_hyvsj_1t7qb_658 > .awsui_mobile-toolbar-nav_hyvsj_1t7qb_679:not(#\9) {
|
|
692
681
|
grid-column: 1;
|
|
693
682
|
margin-inline-end: var(--space-m-udix3p, 16px);
|
|
694
683
|
}
|
|
695
|
-
section.awsui_mobile-
|
|
684
|
+
section.awsui_mobile-toolbar_hyvsj_1t7qb_658 > .awsui_mobile-toolbar-breadcrumbs_hyvsj_1t7qb_683:not(#\9) {
|
|
696
685
|
grid-column: 2;
|
|
697
686
|
background-color: var(--color-background-layout-main-nx09lr, #ffffff);
|
|
698
687
|
}
|
|
699
|
-
section.awsui_mobile-
|
|
688
|
+
section.awsui_mobile-toolbar_hyvsj_1t7qb_658 > .awsui_mobile-toolbar-tools_hyvsj_1t7qb_687:not(#\9) {
|
|
700
689
|
grid-column: 3;
|
|
701
690
|
margin-inline-start: var(--space-m-udix3p, 16px);
|
|
702
691
|
}
|
|
@@ -705,13 +694,13 @@ section.awsui_mobile-toolbar_hyvsj_1cour_669 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
705
694
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
706
695
|
SPDX-License-Identifier: Apache-2.0
|
|
707
696
|
*/
|
|
708
|
-
.awsui_navigation-
|
|
697
|
+
.awsui_navigation-container_hyvsj_1t7qb_696:not(#\9) {
|
|
709
698
|
display: flex;
|
|
710
699
|
grid-column: 1;
|
|
711
700
|
grid-row: 1/span 10;
|
|
712
|
-
block-size: var(--awsui-content-height-
|
|
701
|
+
block-size: var(--awsui-content-height-lgosor);
|
|
713
702
|
position: sticky;
|
|
714
|
-
inset-block-start: var(--awsui-offset-top-
|
|
703
|
+
inset-block-start: var(--awsui-offset-top-lgosor);
|
|
715
704
|
z-index: 830;
|
|
716
705
|
/*
|
|
717
706
|
The navigation and tools containers (that contain the toggle buttons)
|
|
@@ -726,7 +715,7 @@ section.awsui_mobile-toolbar_hyvsj_1cour_669 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
726
715
|
pointer-events: none;
|
|
727
716
|
}
|
|
728
717
|
@media (max-width: 688px) {
|
|
729
|
-
.awsui_navigation-
|
|
718
|
+
.awsui_navigation-container_hyvsj_1t7qb_696:not(#\9) {
|
|
730
719
|
inset-inline-start: 0;
|
|
731
720
|
position: fixed;
|
|
732
721
|
z-index: 1001;
|
|
@@ -738,12 +727,12 @@ section.awsui_mobile-toolbar_hyvsj_1cour_669 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
738
727
|
relative to the body.
|
|
739
728
|
*/
|
|
740
729
|
}
|
|
741
|
-
.awsui_navigation-
|
|
742
|
-
inset-block-start: var(--awsui-header-height-
|
|
730
|
+
.awsui_navigation-container_hyvsj_1t7qb_696.awsui_disable-body-scroll_hyvsj_1t7qb_185:not(#\9) {
|
|
731
|
+
inset-block-start: var(--awsui-header-height-lgosor);
|
|
743
732
|
}
|
|
744
733
|
}
|
|
745
734
|
|
|
746
|
-
nav.awsui_show-
|
|
735
|
+
nav.awsui_show-navigation_hyvsj_1t7qb_734:not(#\9) {
|
|
747
736
|
padding-block: var(--space-scaled-s-aqzyko, 12px);
|
|
748
737
|
padding-inline: var(--space-layout-toggle-padding-lcu6qi, 12px);
|
|
749
738
|
/*
|
|
@@ -751,7 +740,7 @@ nav.awsui_show-navigation_hyvsj_1cour_745:not(#\9) {
|
|
|
751
740
|
take control in responsive viewports.
|
|
752
741
|
*/
|
|
753
742
|
}
|
|
754
|
-
@keyframes
|
|
743
|
+
@keyframes awsui_showButtons_hyvsj_1t7qb_1 {
|
|
755
744
|
0% {
|
|
756
745
|
opacity: 0;
|
|
757
746
|
}
|
|
@@ -759,31 +748,31 @@ nav.awsui_show-navigation_hyvsj_1cour_745:not(#\9) {
|
|
|
759
748
|
opacity: 1;
|
|
760
749
|
}
|
|
761
750
|
}
|
|
762
|
-
nav.awsui_show-
|
|
751
|
+
nav.awsui_show-navigation_hyvsj_1t7qb_734.awsui_is-navigation-open_hyvsj_1t7qb_646:not(#\9) {
|
|
763
752
|
display: none;
|
|
764
753
|
}
|
|
765
754
|
@media (min-width: 689px) {
|
|
766
|
-
nav.awsui_show-
|
|
755
|
+
nav.awsui_show-navigation_hyvsj_1t7qb_734:not(#\9):not(.awsui_is-navigation-open_hyvsj_1t7qb_646) {
|
|
767
756
|
display: block;
|
|
768
757
|
}
|
|
769
|
-
nav.awsui_show-
|
|
770
|
-
animation:
|
|
758
|
+
nav.awsui_show-navigation_hyvsj_1t7qb_734:not(#\9):not(.awsui_is-navigation-open_hyvsj_1t7qb_646).awsui_animating_hyvsj_1t7qb_757 {
|
|
759
|
+
animation: awsui_showButtons_hyvsj_1t7qb_1 var(--motion-duration-refresh-only-fast-4jn2d7, 115ms);
|
|
771
760
|
}
|
|
772
761
|
}
|
|
773
762
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
774
|
-
nav.awsui_show-
|
|
763
|
+
nav.awsui_show-navigation_hyvsj_1t7qb_734:not(#\9):not(.awsui_is-navigation-open_hyvsj_1t7qb_646).awsui_animating_hyvsj_1t7qb_757 {
|
|
775
764
|
animation: none;
|
|
776
765
|
transition: none;
|
|
777
766
|
}
|
|
778
767
|
}
|
|
779
768
|
@media (min-width: 689px) {
|
|
780
|
-
.awsui-motion-disabled nav.awsui_show-
|
|
769
|
+
.awsui-motion-disabled nav.awsui_show-navigation_hyvsj_1t7qb_734:not(#\9):not(.awsui_is-navigation-open_hyvsj_1t7qb_646).awsui_animating_hyvsj_1t7qb_757, .awsui-mode-entering nav.awsui_show-navigation_hyvsj_1t7qb_734:not(#\9):not(.awsui_is-navigation-open_hyvsj_1t7qb_646).awsui_animating_hyvsj_1t7qb_757 {
|
|
781
770
|
animation: none;
|
|
782
771
|
transition: none;
|
|
783
772
|
}
|
|
784
773
|
}
|
|
785
774
|
|
|
786
|
-
nav.
|
|
775
|
+
nav.awsui_navigation_hyvsj_1t7qb_696:not(#\9) {
|
|
787
776
|
background-color: var(--color-background-container-content-4un1ap, #ffffff);
|
|
788
777
|
inset-block-end: 0;
|
|
789
778
|
block-size: 100%;
|
|
@@ -801,43 +790,43 @@ nav.awsui_navigation_hyvsj_1cour_707:not(#\9) {
|
|
|
801
790
|
prevent unwanted text wrapping.
|
|
802
791
|
*/
|
|
803
792
|
}
|
|
804
|
-
@keyframes
|
|
793
|
+
@keyframes awsui_openNavigation_hyvsj_1t7qb_1 {
|
|
805
794
|
from {
|
|
806
795
|
opacity: 0;
|
|
807
796
|
inline-size: calc(var(--space-layout-toggle-padding-lcu6qi, 12px) * 2 + var(--space-layout-toggle-diameter-hb85rk, 36px));
|
|
808
797
|
}
|
|
809
798
|
to {
|
|
810
799
|
opacity: 1;
|
|
811
|
-
inline-size: var(--awsui-navigation-width-
|
|
800
|
+
inline-size: var(--awsui-navigation-width-lgosor);
|
|
812
801
|
}
|
|
813
802
|
}
|
|
814
|
-
nav.
|
|
803
|
+
nav.awsui_navigation_hyvsj_1t7qb_696:not(#\9):not(.awsui_is-navigation-open_hyvsj_1t7qb_646) {
|
|
815
804
|
inline-size: 0;
|
|
816
805
|
display: none;
|
|
817
806
|
}
|
|
818
|
-
nav.
|
|
819
|
-
animation:
|
|
807
|
+
nav.awsui_navigation_hyvsj_1t7qb_696.awsui_is-navigation-open_hyvsj_1t7qb_646.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
808
|
+
animation: awsui_openNavigation_hyvsj_1t7qb_1 var(--motion-duration-refresh-only-fast-4jn2d7, 115ms);
|
|
820
809
|
}
|
|
821
810
|
@media (prefers-reduced-motion: reduce) {
|
|
822
|
-
nav.
|
|
811
|
+
nav.awsui_navigation_hyvsj_1t7qb_696.awsui_is-navigation-open_hyvsj_1t7qb_646.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
823
812
|
animation: none;
|
|
824
813
|
transition: none;
|
|
825
814
|
}
|
|
826
815
|
}
|
|
827
|
-
.awsui-motion-disabled nav.
|
|
816
|
+
.awsui-motion-disabled nav.awsui_navigation_hyvsj_1t7qb_696.awsui_is-navigation-open_hyvsj_1t7qb_646.awsui_animating_hyvsj_1t7qb_757:not(#\9), .awsui-mode-entering nav.awsui_navigation_hyvsj_1t7qb_696.awsui_is-navigation-open_hyvsj_1t7qb_646.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
828
817
|
animation: none;
|
|
829
818
|
transition: none;
|
|
830
819
|
}
|
|
831
|
-
nav.
|
|
832
|
-
inline-size: var(--awsui-navigation-width-
|
|
820
|
+
nav.awsui_navigation_hyvsj_1t7qb_696 > .awsui_animated-content_hyvsj_1t7qb_819:not(#\9) {
|
|
821
|
+
inline-size: var(--awsui-navigation-width-lgosor);
|
|
833
822
|
}
|
|
834
823
|
@media (max-width: 688px) {
|
|
835
|
-
nav.
|
|
836
|
-
--awsui-navigation-width-
|
|
824
|
+
nav.awsui_navigation_hyvsj_1t7qb_696:not(#\9) {
|
|
825
|
+
--awsui-navigation-width-lgosor: 100vw;
|
|
837
826
|
}
|
|
838
827
|
}
|
|
839
828
|
|
|
840
|
-
.awsui_hide-
|
|
829
|
+
.awsui_hide-navigation_hyvsj_1t7qb_828:not(#\9) {
|
|
841
830
|
position: absolute;
|
|
842
831
|
inset-inline-end: var(--space-m-udix3p, 16px);
|
|
843
832
|
inset-block-start: var(--size-vertical-panel-icon-offset-wy8j08, 15px);
|
|
@@ -847,16 +836,16 @@ nav.awsui_navigation_hyvsj_1cour_707 > .awsui_animated-content_hyvsj_1cour_830:n
|
|
|
847
836
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
848
837
|
SPDX-License-Identifier: Apache-2.0
|
|
849
838
|
*/
|
|
850
|
-
.
|
|
839
|
+
.awsui_notifications_hyvsj_1t7qb_838:not(#\9) {
|
|
851
840
|
color: var(--color-text-body-default-at06ol, #000716);
|
|
852
841
|
grid-area: notifications;
|
|
853
842
|
z-index: 850;
|
|
854
843
|
}
|
|
855
844
|
@media (min-width: 689px) {
|
|
856
|
-
.
|
|
857
|
-
--awsui-flashbar-sticky-bottom-margin-
|
|
845
|
+
.awsui_notifications_hyvsj_1t7qb_838.awsui_sticky-notifications_hyvsj_1t7qb_844:not(#\9) {
|
|
846
|
+
--awsui-flashbar-sticky-bottom-margin-lgosor: var(--space-xxl-cu2m1r, 32px);
|
|
858
847
|
position: sticky;
|
|
859
|
-
inset-block-start: calc(var(--awsui-offset-top-
|
|
848
|
+
inset-block-start: calc(var(--awsui-offset-top-lgosor) + var(--space-xs-zb16t3, 8px));
|
|
860
849
|
}
|
|
861
850
|
}
|
|
862
851
|
|
|
@@ -870,13 +859,13 @@ as the content area. This row is defined as 1 fractional unit which will
|
|
|
870
859
|
consume the remaining vertical space in the grid after the notifications
|
|
871
860
|
and breadcrumbs.
|
|
872
861
|
*/
|
|
873
|
-
section.awsui_split-panel-
|
|
862
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861:not(#\9) {
|
|
874
863
|
/*
|
|
875
864
|
The align self property will position the split panel at the bottom of the grid row.
|
|
876
865
|
This could be off the viewport if the content area has enough content to be scrollable.
|
|
877
866
|
*/
|
|
878
867
|
align-self: end;
|
|
879
|
-
inset-block-end: var(--awsui-footer-height-
|
|
868
|
+
inset-block-end: var(--awsui-footer-height-lgosor);
|
|
880
869
|
display: none;
|
|
881
870
|
grid-column: 1/6;
|
|
882
871
|
grid-row: 10;
|
|
@@ -906,47 +895,47 @@ section.awsui_split-panel-bottom_hyvsj_1cour_872:not(#\9) {
|
|
|
906
895
|
apply the animation to the height property.
|
|
907
896
|
*/
|
|
908
897
|
}
|
|
909
|
-
@keyframes
|
|
898
|
+
@keyframes awsui_openSplitPanelBottom_hyvsj_1t7qb_1 {
|
|
910
899
|
from {
|
|
911
|
-
block-size: var(--awsui-split-panel-reported-header-size-
|
|
900
|
+
block-size: var(--awsui-split-panel-reported-header-size-lgosor, 0);
|
|
912
901
|
}
|
|
913
902
|
to {
|
|
914
|
-
block-size: var(--awsui-split-panel-reported-size-
|
|
903
|
+
block-size: var(--awsui-split-panel-reported-size-lgosor);
|
|
915
904
|
}
|
|
916
905
|
}
|
|
917
|
-
section.awsui_split-panel-
|
|
906
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_disable-body-scroll_hyvsj_1t7qb_185:not(#\9) {
|
|
918
907
|
inset-block-end: 0;
|
|
919
908
|
}
|
|
920
|
-
section.awsui_split-panel-
|
|
909
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_is-navigation-open_hyvsj_1t7qb_646.awsui_position-bottom_hyvsj_1t7qb_908:not(#\9) {
|
|
921
910
|
grid-column-start: 2;
|
|
922
911
|
}
|
|
923
|
-
section.awsui_split-panel-
|
|
912
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_has-open-drawer_hyvsj_1t7qb_162.awsui_position-bottom_hyvsj_1t7qb_908:not(#\9) {
|
|
924
913
|
grid-column-end: 5;
|
|
925
914
|
}
|
|
926
|
-
section.awsui_split-panel-
|
|
915
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_position-bottom_hyvsj_1t7qb_908:not(#\9) {
|
|
927
916
|
display: block;
|
|
928
917
|
}
|
|
929
|
-
section.awsui_split-panel-
|
|
918
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1t7qb_649).awsui_position-bottom_hyvsj_1t7qb_908 {
|
|
930
919
|
box-shadow: rgba(0, 7, 22, 0.1) 0px -32px 32px -24px;
|
|
931
920
|
}
|
|
932
|
-
section.awsui_split-panel-
|
|
921
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_position-bottom_hyvsj_1t7qb_908:not(#\9) {
|
|
933
922
|
box-shadow: var(--shadow-split-bottom-5e389u, 0px -36px 36px -36px rgba(0, 7, 22, 0.1));
|
|
934
923
|
}
|
|
935
|
-
section.awsui_split-panel-
|
|
936
|
-
animation:
|
|
924
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_position-bottom_hyvsj_1t7qb_908.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
925
|
+
animation: awsui_openSplitPanelBottom_hyvsj_1t7qb_1 var(--motion-duration-refresh-only-fast-4jn2d7, 115ms);
|
|
937
926
|
}
|
|
938
927
|
@media (prefers-reduced-motion: reduce) {
|
|
939
|
-
section.awsui_split-panel-
|
|
928
|
+
section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_position-bottom_hyvsj_1t7qb_908.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
940
929
|
animation: none;
|
|
941
930
|
transition: none;
|
|
942
931
|
}
|
|
943
932
|
}
|
|
944
|
-
.awsui-motion-disabled section.awsui_split-panel-
|
|
933
|
+
.awsui-motion-disabled section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_position-bottom_hyvsj_1t7qb_908.awsui_animating_hyvsj_1t7qb_757:not(#\9), .awsui-mode-entering section.awsui_split-panel-bottom_hyvsj_1t7qb_861.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_position-bottom_hyvsj_1t7qb_908.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
945
934
|
animation: none;
|
|
946
935
|
transition: none;
|
|
947
936
|
}
|
|
948
937
|
|
|
949
|
-
section.awsui_split-panel-
|
|
938
|
+
section.awsui_split-panel-side_hyvsj_1t7qb_937:not(#\9) {
|
|
950
939
|
block-size: 100%;
|
|
951
940
|
overflow-x: hidden;
|
|
952
941
|
pointer-events: auto;
|
|
@@ -956,15 +945,15 @@ section.awsui_split-panel-side_hyvsj_1cour_948:not(#\9) {
|
|
|
956
945
|
be persistent in the DOM when closed.
|
|
957
946
|
*/
|
|
958
947
|
}
|
|
959
|
-
section.awsui_split-panel-
|
|
948
|
+
section.awsui_split-panel-side_hyvsj_1t7qb_937:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1t7qb_649), section.awsui_split-panel-side_hyvsj_1t7qb_937.awsui_position-bottom_hyvsj_1t7qb_908:not(#\9) {
|
|
960
949
|
inline-size: 0;
|
|
961
950
|
}
|
|
962
|
-
section.awsui_split-panel-
|
|
963
|
-
max-inline-size: var(--awsui-split-panel-max-width-
|
|
964
|
-
min-inline-size: var(--awsui-split-panel-min-width-
|
|
951
|
+
section.awsui_split-panel-side_hyvsj_1t7qb_937.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_position-side_hyvsj_1t7qb_950:not(#\9) {
|
|
952
|
+
max-inline-size: var(--awsui-split-panel-max-width-lgosor, 280px);
|
|
953
|
+
min-inline-size: var(--awsui-split-panel-min-width-lgosor, 280px);
|
|
965
954
|
border-inline-start: solid var(--border-divider-section-width-1061zr, 1px) var(--color-border-divider-default-j74lyz, #b6bec9);
|
|
966
955
|
}
|
|
967
|
-
section.awsui_split-panel-
|
|
956
|
+
section.awsui_split-panel-side_hyvsj_1t7qb_937.awsui_is-split-panel-open_hyvsj_1t7qb_649.awsui_position-side_hyvsj_1t7qb_950:not(#\9):not(.awsui_has-open-drawer_hyvsj_1t7qb_162) {
|
|
968
957
|
border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-divider-panel-side-93n0qu, #b6bec9);
|
|
969
958
|
}
|
|
970
959
|
|
|
@@ -981,24 +970,24 @@ content width has a default value that can be set directly with the minContentWi
|
|
|
981
970
|
property. The content gap right is computed in the Layout styles based on the
|
|
982
971
|
viewport size and state of the Tools drawer.
|
|
983
972
|
*/
|
|
984
|
-
.awsui_tools-
|
|
973
|
+
.awsui_tools-container_hyvsj_1t7qb_972:not(#\9) {
|
|
985
974
|
/* stylelint-disable scss/operator-no-newline-after */
|
|
986
|
-
--awsui-tools-max-width-
|
|
975
|
+
--awsui-tools-max-width-lgosor: calc(var(--awsui-layout-width-lgosor) - var(--awsui-main-offset-left-lgosor) - var(--awsui-default-min-content-width-lgosor) - var(--awsui-content-gap-right-lgosor));
|
|
987
976
|
/* stylelint-enable scss/operator-no-newline-after */
|
|
988
977
|
display: flex;
|
|
989
978
|
grid-column: 5;
|
|
990
979
|
grid-row: 1/span 10;
|
|
991
|
-
block-size: var(--awsui-content-height-
|
|
992
|
-
max-inline-size: var(--awsui-tools-max-width-
|
|
980
|
+
block-size: var(--awsui-content-height-lgosor);
|
|
981
|
+
max-inline-size: var(--awsui-tools-max-width-lgosor);
|
|
993
982
|
position: sticky;
|
|
994
|
-
inset-block-start: var(--awsui-offset-top-
|
|
983
|
+
inset-block-start: var(--awsui-offset-top-lgosor);
|
|
995
984
|
z-index: 830;
|
|
996
985
|
pointer-events: none;
|
|
997
986
|
}
|
|
998
987
|
@media (max-width: 688px) {
|
|
999
|
-
.awsui_tools-
|
|
1000
|
-
--awsui-tools-max-width-
|
|
1001
|
-
--awsui-tools-width-
|
|
988
|
+
.awsui_tools-container_hyvsj_1t7qb_972:not(#\9) {
|
|
989
|
+
--awsui-tools-max-width-lgosor: none;
|
|
990
|
+
--awsui-tools-width-lgosor: auto;
|
|
1002
991
|
position: fixed;
|
|
1003
992
|
inset-inline-end: 0;
|
|
1004
993
|
z-index: 1001;
|
|
@@ -1010,12 +999,12 @@ viewport size and state of the Tools drawer.
|
|
|
1010
999
|
relative to the body.
|
|
1011
1000
|
*/
|
|
1012
1001
|
}
|
|
1013
|
-
.awsui_tools-
|
|
1014
|
-
inset-block-start: var(--awsui-header-height-
|
|
1002
|
+
.awsui_tools-container_hyvsj_1t7qb_972.awsui_disable-body-scroll_hyvsj_1t7qb_185:not(#\9) {
|
|
1003
|
+
inset-block-start: var(--awsui-header-height-lgosor);
|
|
1015
1004
|
}
|
|
1016
1005
|
}
|
|
1017
1006
|
|
|
1018
|
-
.
|
|
1007
|
+
.awsui_tools_hyvsj_1t7qb_972:not(#\9) {
|
|
1019
1008
|
background-color: var(--color-background-container-content-4un1ap, #ffffff);
|
|
1020
1009
|
flex-shrink: 0;
|
|
1021
1010
|
block-size: 100%;
|
|
@@ -1038,51 +1027,51 @@ viewport size and state of the Tools drawer.
|
|
|
1038
1027
|
in the side position.
|
|
1039
1028
|
*/
|
|
1040
1029
|
}
|
|
1041
|
-
@keyframes
|
|
1030
|
+
@keyframes awsui_openTools_hyvsj_1t7qb_1 {
|
|
1042
1031
|
from {
|
|
1043
|
-
opacity: var(--awsui-tools-animation-starting-opacity-
|
|
1032
|
+
opacity: var(--awsui-tools-animation-starting-opacity-lgosor, 0);
|
|
1044
1033
|
inline-size: calc(var(--space-layout-toggle-padding-lcu6qi, 12px) * 2 + var(--space-layout-toggle-diameter-hb85rk, 36px));
|
|
1045
1034
|
}
|
|
1046
1035
|
to {
|
|
1047
1036
|
opacity: 1;
|
|
1048
|
-
inline-size: var(--awsui-tools-width-
|
|
1037
|
+
inline-size: var(--awsui-tools-width-lgosor);
|
|
1049
1038
|
}
|
|
1050
1039
|
}
|
|
1051
|
-
.
|
|
1040
|
+
.awsui_tools_hyvsj_1t7qb_972:not(#\9):not(.awsui_is-tools-open_hyvsj_1t7qb_649) {
|
|
1052
1041
|
inline-size: 0;
|
|
1053
1042
|
display: none;
|
|
1054
1043
|
}
|
|
1055
|
-
.
|
|
1044
|
+
.awsui_tools_hyvsj_1t7qb_972.awsui_is-tools-open_hyvsj_1t7qb_649:not(#\9) {
|
|
1056
1045
|
border-inline-start: solid var(--border-divider-section-width-1061zr, 1px) var(--color-border-divider-default-j74lyz, #b6bec9);
|
|
1057
1046
|
}
|
|
1058
|
-
.
|
|
1059
|
-
animation:
|
|
1047
|
+
.awsui_tools_hyvsj_1t7qb_972.awsui_is-tools-open_hyvsj_1t7qb_649.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
1048
|
+
animation: awsui_openTools_hyvsj_1t7qb_1 var(--motion-duration-refresh-only-fast-4jn2d7, 115ms);
|
|
1060
1049
|
}
|
|
1061
1050
|
@media (prefers-reduced-motion: reduce) {
|
|
1062
|
-
.
|
|
1051
|
+
.awsui_tools_hyvsj_1t7qb_972.awsui_is-tools-open_hyvsj_1t7qb_649.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
1063
1052
|
animation: none;
|
|
1064
1053
|
transition: none;
|
|
1065
1054
|
}
|
|
1066
1055
|
}
|
|
1067
|
-
.awsui-motion-disabled .
|
|
1056
|
+
.awsui-motion-disabled .awsui_tools_hyvsj_1t7qb_972.awsui_is-tools-open_hyvsj_1t7qb_649.awsui_animating_hyvsj_1t7qb_757:not(#\9), .awsui-mode-entering .awsui_tools_hyvsj_1t7qb_972.awsui_is-tools-open_hyvsj_1t7qb_649.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
1068
1057
|
animation: none;
|
|
1069
1058
|
transition: none;
|
|
1070
1059
|
}
|
|
1071
|
-
.
|
|
1072
|
-
inline-size: var(--awsui-tools-width-
|
|
1060
|
+
.awsui_tools_hyvsj_1t7qb_972 > .awsui_animated-content_hyvsj_1t7qb_819:not(#\9) {
|
|
1061
|
+
inline-size: var(--awsui-tools-width-lgosor);
|
|
1073
1062
|
}
|
|
1074
1063
|
@media (min-width: 689px) {
|
|
1075
|
-
.
|
|
1064
|
+
.awsui_tools_hyvsj_1t7qb_972.awsui_is-tools-open_hyvsj_1t7qb_649.awsui_has-tools-form-persistence_hyvsj_1t7qb_1063:not(#\9) {
|
|
1076
1065
|
border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-divider-default-j74lyz, #b6bec9);
|
|
1077
1066
|
}
|
|
1078
1067
|
}
|
|
1079
1068
|
@media (max-width: 688px) {
|
|
1080
|
-
.
|
|
1081
|
-
--awsui-tools-width-
|
|
1069
|
+
.awsui_tools_hyvsj_1t7qb_972:not(#\9) {
|
|
1070
|
+
--awsui-tools-width-lgosor: 100vw;
|
|
1082
1071
|
}
|
|
1083
1072
|
}
|
|
1084
1073
|
|
|
1085
|
-
.awsui_hide-
|
|
1074
|
+
.awsui_hide-tools_hyvsj_1t7qb_1073:not(#\9) {
|
|
1086
1075
|
position: absolute;
|
|
1087
1076
|
inset-inline-end: var(--space-m-udix3p, 16px);
|
|
1088
1077
|
inset-block-start: var(--size-vertical-panel-icon-offset-wy8j08, 15px);
|
|
@@ -1094,7 +1083,7 @@ Warning! If these design tokens for padding change it will adversely impact
|
|
|
1094
1083
|
the calculation used to determine the Split Panel maximum width in the
|
|
1095
1084
|
handleSplitPanelMaxWidth function in the context.
|
|
1096
1085
|
*/
|
|
1097
|
-
.awsui_show-
|
|
1086
|
+
.awsui_show-tools_hyvsj_1t7qb_1085:not(#\9) {
|
|
1098
1087
|
border-collapse: separate;
|
|
1099
1088
|
border-spacing: 0;
|
|
1100
1089
|
box-sizing: border-box;
|
|
@@ -1136,7 +1125,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1136
1125
|
take control in responsive viewports.
|
|
1137
1126
|
*/
|
|
1138
1127
|
}
|
|
1139
|
-
@keyframes
|
|
1128
|
+
@keyframes awsui_showButtons_hyvsj_1t7qb_1 {
|
|
1140
1129
|
0% {
|
|
1141
1130
|
opacity: 0;
|
|
1142
1131
|
}
|
|
@@ -1144,31 +1133,31 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1144
1133
|
opacity: 1;
|
|
1145
1134
|
}
|
|
1146
1135
|
}
|
|
1147
|
-
.awsui_show-
|
|
1136
|
+
.awsui_show-tools_hyvsj_1t7qb_1085:not(#\9):not(.awsui_has-tools-form_hyvsj_1t7qb_1063) {
|
|
1148
1137
|
display: none;
|
|
1149
1138
|
}
|
|
1150
1139
|
@media (min-width: 689px) {
|
|
1151
|
-
.awsui_show-
|
|
1140
|
+
.awsui_show-tools_hyvsj_1t7qb_1085.awsui_has-tools-form_hyvsj_1t7qb_1063:not(#\9) {
|
|
1152
1141
|
display: flex;
|
|
1153
1142
|
flex-direction: column;
|
|
1154
1143
|
gap: var(--space-xs-zb16t3, 8px);
|
|
1155
1144
|
}
|
|
1156
|
-
.awsui_show-
|
|
1157
|
-
animation:
|
|
1145
|
+
.awsui_show-tools_hyvsj_1t7qb_1085.awsui_has-tools-form_hyvsj_1t7qb_1063.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
1146
|
+
animation: awsui_showButtons_hyvsj_1t7qb_1 var(--motion-duration-refresh-only-fast-4jn2d7, 115ms);
|
|
1158
1147
|
}
|
|
1159
1148
|
}
|
|
1160
1149
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
1161
|
-
.awsui_show-
|
|
1150
|
+
.awsui_show-tools_hyvsj_1t7qb_1085.awsui_has-tools-form_hyvsj_1t7qb_1063.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
1162
1151
|
animation: none;
|
|
1163
1152
|
transition: none;
|
|
1164
1153
|
}
|
|
1165
1154
|
}
|
|
1166
1155
|
@media (min-width: 689px) {
|
|
1167
|
-
.awsui-motion-disabled .awsui_show-
|
|
1156
|
+
.awsui-motion-disabled .awsui_show-tools_hyvsj_1t7qb_1085.awsui_has-tools-form_hyvsj_1t7qb_1063.awsui_animating_hyvsj_1t7qb_757:not(#\9), .awsui-mode-entering .awsui_show-tools_hyvsj_1t7qb_1085.awsui_has-tools-form_hyvsj_1t7qb_1063.awsui_animating_hyvsj_1t7qb_757:not(#\9) {
|
|
1168
1157
|
animation: none;
|
|
1169
1158
|
transition: none;
|
|
1170
1159
|
}
|
|
1171
|
-
.awsui_show-
|
|
1160
|
+
.awsui_show-tools_hyvsj_1t7qb_1085.awsui_has-tools-form-persistence_hyvsj_1t7qb_1063:not(#\9) {
|
|
1172
1161
|
background-color: var(--color-background-container-content-4un1ap, #ffffff);
|
|
1173
1162
|
z-index: 1;
|
|
1174
1163
|
}
|
|
@@ -1178,7 +1167,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1178
1167
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
1179
1168
|
SPDX-License-Identifier: Apache-2.0
|
|
1180
1169
|
*/
|
|
1181
|
-
.awsui_trigger-badge-
|
|
1170
|
+
.awsui_trigger-badge-wrapper_hyvsj_1t7qb_1168:not(#\9) {
|
|
1182
1171
|
background: var(--color-background-layout-toggle-default-o2evu2, #414d5c);
|
|
1183
1172
|
border-start-start-radius: 50%;
|
|
1184
1173
|
border-start-end-radius: 50%;
|
|
@@ -1194,10 +1183,10 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1194
1183
|
align-items: center;
|
|
1195
1184
|
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
1185
|
}
|
|
1197
|
-
.awsui_trigger-badge-
|
|
1186
|
+
.awsui_trigger-badge-wrapper_hyvsj_1t7qb_1168:not(#\9):hover {
|
|
1198
1187
|
background: var(--color-background-layout-toggle-hover-awem6j, #5f6b7a);
|
|
1199
1188
|
}
|
|
1200
|
-
.awsui_trigger-badge-
|
|
1189
|
+
.awsui_trigger-badge-wrapper_hyvsj_1t7qb_1168:not(#\9):active {
|
|
1201
1190
|
background: var(--color-background-layout-toggle-active-aa8dko, #414d5c);
|
|
1202
1191
|
}
|
|
1203
1192
|
|
|
@@ -1206,7 +1195,7 @@ Warning! If these design tokens for width change it will adversely impact
|
|
|
1206
1195
|
the calculation used to determine the Split Panel maximum width in the
|
|
1207
1196
|
handleSplitPanelMaxWidth function in the context.
|
|
1208
1197
|
*/
|
|
1209
|
-
.
|
|
1198
|
+
.awsui_trigger_hyvsj_1t7qb_1168:not(#\9) {
|
|
1210
1199
|
background: var(--color-background-layout-toggle-default-o2evu2, #414d5c);
|
|
1211
1200
|
border-start-start-radius: 50%;
|
|
1212
1201
|
border-start-end-radius: 50%;
|
|
@@ -1222,20 +1211,20 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1222
1211
|
pointer-events: auto;
|
|
1223
1212
|
position: relative;
|
|
1224
1213
|
}
|
|
1225
|
-
.
|
|
1214
|
+
.awsui_trigger_hyvsj_1t7qb_1168:not(#\9):hover {
|
|
1226
1215
|
background: var(--color-background-layout-toggle-hover-awem6j, #5f6b7a);
|
|
1227
1216
|
}
|
|
1228
|
-
.
|
|
1217
|
+
.awsui_trigger_hyvsj_1t7qb_1168:not(#\9):active {
|
|
1229
1218
|
background: var(--color-background-layout-toggle-active-aa8dko, #414d5c);
|
|
1230
1219
|
}
|
|
1231
|
-
body[data-awsui-focus-visible=true] .
|
|
1220
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1t7qb_1168:not(#\9):focus {
|
|
1232
1221
|
position: relative;
|
|
1233
1222
|
}
|
|
1234
|
-
body[data-awsui-focus-visible=true] .
|
|
1223
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1t7qb_1168:not(#\9):focus {
|
|
1235
1224
|
outline: 2px dotted transparent;
|
|
1236
1225
|
outline-offset: calc(3px - 1px);
|
|
1237
1226
|
}
|
|
1238
|
-
body[data-awsui-focus-visible=true] .
|
|
1227
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1t7qb_1168:not(#\9):focus::before {
|
|
1239
1228
|
content: " ";
|
|
1240
1229
|
display: block;
|
|
1241
1230
|
position: absolute;
|
|
@@ -1249,45 +1238,45 @@ body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1cour_1179:not(#\9):foc
|
|
|
1249
1238
|
border-end-end-radius: var(--border-radius-control-default-focus-ring-u8zbsz, 4px);
|
|
1250
1239
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
|
|
1251
1240
|
}
|
|
1252
|
-
.
|
|
1241
|
+
.awsui_trigger_hyvsj_1t7qb_1168:not(#\9):focus {
|
|
1253
1242
|
outline: none;
|
|
1254
1243
|
}
|
|
1255
|
-
.
|
|
1244
|
+
.awsui_trigger_hyvsj_1t7qb_1168.awsui_selected_hyvsj_1t7qb_1242:not(#\9) {
|
|
1256
1245
|
background: var(--color-background-layout-toggle-selected-default-caco0q, #0972d3);
|
|
1257
1246
|
color: var(--color-text-layout-toggle-selected-b93usl, #ffffff);
|
|
1258
1247
|
}
|
|
1259
|
-
.
|
|
1248
|
+
.awsui_trigger_hyvsj_1t7qb_1168.awsui_selected_hyvsj_1t7qb_1242:not(#\9):hover {
|
|
1260
1249
|
background: var(--color-background-layout-toggle-selected-hover-kjak2q, #065299);
|
|
1261
1250
|
}
|
|
1262
|
-
.
|
|
1251
|
+
.awsui_trigger_hyvsj_1t7qb_1168.awsui_selected_hyvsj_1t7qb_1242:not(#\9):active {
|
|
1263
1252
|
background: var(--color-background-layout-toggle-selected-active-xfk480, #0972d3);
|
|
1264
1253
|
}
|
|
1265
|
-
.
|
|
1254
|
+
.awsui_trigger_hyvsj_1t7qb_1168.awsui_selected_hyvsj_1t7qb_1242 > .awsui_trigger-badge-wrapper_hyvsj_1t7qb_1168:not(#\9) {
|
|
1266
1255
|
background: var(--color-background-layout-toggle-selected-default-caco0q, #0972d3);
|
|
1267
1256
|
color: var(--color-text-layout-toggle-selected-b93usl, #ffffff);
|
|
1268
1257
|
}
|
|
1269
|
-
.
|
|
1258
|
+
.awsui_trigger_hyvsj_1t7qb_1168.awsui_selected_hyvsj_1t7qb_1242 > .awsui_trigger-badge-wrapper_hyvsj_1t7qb_1168:not(#\9):hover {
|
|
1270
1259
|
background: var(--color-background-layout-toggle-selected-hover-kjak2q, #065299);
|
|
1271
1260
|
}
|
|
1272
|
-
.
|
|
1261
|
+
.awsui_trigger_hyvsj_1t7qb_1168.awsui_selected_hyvsj_1t7qb_1242 > .awsui_trigger-badge-wrapper_hyvsj_1t7qb_1168:not(#\9):active {
|
|
1273
1262
|
background: var(--color-background-layout-toggle-selected-active-xfk480, #0972d3);
|
|
1274
1263
|
}
|
|
1275
|
-
.
|
|
1264
|
+
.awsui_trigger_hyvsj_1t7qb_1168.awsui_badge_hyvsj_1t7qb_1262:not(#\9), .awsui_trigger_hyvsj_1t7qb_1168.awsui_badge_hyvsj_1t7qb_1262:not(#\9):hover, .awsui_trigger_hyvsj_1t7qb_1168.awsui_badge_hyvsj_1t7qb_1262:not(#\9):active {
|
|
1276
1265
|
background: transparent;
|
|
1277
1266
|
}
|
|
1278
1267
|
|
|
1279
|
-
.awsui_trigger-
|
|
1268
|
+
.awsui_trigger-wrapper_hyvsj_1t7qb_1266:not(#\9) {
|
|
1280
1269
|
position: relative;
|
|
1281
1270
|
border-start-start-radius: 50%;
|
|
1282
1271
|
border-start-end-radius: 50%;
|
|
1283
1272
|
border-end-start-radius: 50%;
|
|
1284
1273
|
border-end-end-radius: 50%;
|
|
1285
1274
|
}
|
|
1286
|
-
.awsui_trigger-
|
|
1275
|
+
.awsui_trigger-wrapper_hyvsj_1t7qb_1266:not(#\9):not(.awsui_remove-high-contrast-header_hyvsj_1t7qb_675) {
|
|
1287
1276
|
box-shadow: var(--shadow-panel-toggle-0l64f2, 0px 6px 12px 1px rgba(0, 7, 22, 0.12));
|
|
1288
1277
|
}
|
|
1289
1278
|
|
|
1290
|
-
.
|
|
1279
|
+
.awsui_dot_hyvsj_1t7qb_1277:not(#\9) {
|
|
1291
1280
|
position: absolute;
|
|
1292
1281
|
inline-size: 9px;
|
|
1293
1282
|
block-size: 9px;
|