@cloudscape-design/components-themeable 3.0.1182 → 3.0.1183
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/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +139 -132
- package/lib/internal/scss/slider/mixins.scss +32 -24
- package/lib/internal/scss/slider/styles.scss +56 -29
- package/lib/internal/template/alert/styles.css.js +27 -27
- package/lib/internal/template/alert/styles.scoped.css +50 -50
- package/lib/internal/template/alert/styles.selectors.js +27 -27
- package/lib/internal/template/annotation-context/annotation/styles.css.js +13 -13
- package/lib/internal/template/annotation-context/annotation/styles.scoped.css +21 -21
- package/lib/internal/template/annotation-context/annotation/styles.selectors.js +13 -13
- package/lib/internal/template/app-layout/notifications/styles.css.js +3 -3
- package/lib/internal/template/app-layout/notifications/styles.scoped.css +7 -7
- package/lib/internal/template/app-layout/notifications/styles.selectors.js +3 -3
- package/lib/internal/template/app-layout/visual-refresh/styles.css.js +86 -86
- package/lib/internal/template/app-layout/visual-refresh/styles.scoped.css +258 -258
- package/lib/internal/template/app-layout/visual-refresh/styles.selectors.js +86 -86
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.css.js +30 -30
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +87 -87
- package/lib/internal/template/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +30 -30
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.css.js +4 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +7 -7
- package/lib/internal/template/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +4 -4
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +27 -27
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +54 -54
- package/lib/internal/template/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +27 -27
- package/lib/internal/template/attribute-editor/styles.css.js +15 -15
- package/lib/internal/template/attribute-editor/styles.scoped.css +28 -28
- package/lib/internal/template/attribute-editor/styles.selectors.js +15 -15
- package/lib/internal/template/breadcrumb-group/item/styles.css.js +7 -7
- package/lib/internal/template/breadcrumb-group/item/styles.scoped.css +28 -28
- package/lib/internal/template/breadcrumb-group/item/styles.selectors.js +7 -7
- package/lib/internal/template/button/styles.css.js +22 -22
- package/lib/internal/template/button/styles.scoped.css +256 -256
- package/lib/internal/template/button/styles.selectors.js +22 -22
- package/lib/internal/template/button-dropdown/item-element/styles.css.js +20 -20
- package/lib/internal/template/button-dropdown/item-element/styles.scoped.css +34 -34
- package/lib/internal/template/button-dropdown/item-element/styles.selectors.js +20 -20
- package/lib/internal/template/checkbox/styles.css.js +3 -3
- package/lib/internal/template/checkbox/styles.scoped.css +11 -11
- package/lib/internal/template/checkbox/styles.selectors.js +3 -3
- package/lib/internal/template/content-layout/styles.css.js +14 -14
- package/lib/internal/template/content-layout/styles.scoped.css +27 -27
- package/lib/internal/template/content-layout/styles.selectors.js +14 -14
- package/lib/internal/template/flashbar/styles.css.js +50 -50
- package/lib/internal/template/flashbar/styles.scoped.css +187 -187
- package/lib/internal/template/flashbar/styles.selectors.js +50 -50
- package/lib/internal/template/help-panel/styles.css.js +6 -6
- package/lib/internal/template/help-panel/styles.scoped.css +73 -73
- package/lib/internal/template/help-panel/styles.selectors.js +6 -6
- package/lib/internal/template/input/styles.css.js +13 -13
- package/lib/internal/template/input/styles.scoped.css +74 -74
- package/lib/internal/template/input/styles.selectors.js +13 -13
- package/lib/internal/template/internal/base-component/styles.scoped.css +1 -1
- package/lib/internal/template/internal/components/drag-handle-wrapper/styles.css.js +30 -30
- package/lib/internal/template/internal/components/drag-handle-wrapper/styles.scoped.css +58 -58
- package/lib/internal/template/internal/components/drag-handle-wrapper/styles.selectors.js +30 -30
- package/lib/internal/template/internal/components/dropdown/styles.css.js +20 -20
- package/lib/internal/template/internal/components/dropdown/styles.scoped.css +38 -38
- package/lib/internal/template/internal/components/dropdown/styles.selectors.js +20 -20
- package/lib/internal/template/internal/components/radio-button/styles.css.js +7 -7
- package/lib/internal/template/internal/components/radio-button/styles.scoped.css +18 -18
- package/lib/internal/template/internal/components/radio-button/styles.selectors.js +7 -7
- package/lib/internal/template/internal/components/token-list/styles.css.js +10 -10
- package/lib/internal/template/internal/components/token-list/styles.scoped.css +25 -25
- package/lib/internal/template/internal/components/token-list/styles.selectors.js +10 -10
- package/lib/internal/template/internal/environment.js +2 -2
- package/lib/internal/template/internal/environment.json +2 -2
- package/lib/internal/template/internal/generated/custom-css-properties/index.d.ts +7 -0
- package/lib/internal/template/internal/generated/custom-css-properties/index.d.ts.map +1 -1
- package/lib/internal/template/internal/generated/custom-css-properties/index.js +138 -131
- package/lib/internal/template/internal/generated/custom-css-properties/index.js.map +1 -1
- package/lib/internal/template/link/styles.css.js +20 -20
- package/lib/internal/template/link/styles.scoped.css +103 -103
- package/lib/internal/template/link/styles.selectors.js +20 -20
- package/lib/internal/template/progress-bar/styles.css.js +19 -19
- package/lib/internal/template/progress-bar/styles.scoped.css +56 -56
- package/lib/internal/template/progress-bar/styles.selectors.js +19 -19
- package/lib/internal/template/prompt-input/styles.css.js +17 -17
- package/lib/internal/template/prompt-input/styles.scoped.css +79 -79
- package/lib/internal/template/prompt-input/styles.selectors.js +17 -17
- package/lib/internal/template/segmented-control/styles.css.js +16 -16
- package/lib/internal/template/segmented-control/styles.scoped.css +46 -46
- package/lib/internal/template/segmented-control/styles.selectors.js +16 -16
- package/lib/internal/template/slider/index.d.ts +1 -1
- package/lib/internal/template/slider/index.d.ts.map +1 -1
- package/lib/internal/template/slider/index.js +2 -2
- package/lib/internal/template/slider/index.js.map +1 -1
- package/lib/internal/template/slider/interfaces.d.ts +23 -0
- package/lib/internal/template/slider/interfaces.d.ts.map +1 -1
- package/lib/internal/template/slider/interfaces.js.map +1 -1
- package/lib/internal/template/slider/internal.d.ts +2 -1
- package/lib/internal/template/slider/internal.d.ts.map +1 -1
- package/lib/internal/template/slider/internal.js +3 -2
- package/lib/internal/template/slider/internal.js.map +1 -1
- package/lib/internal/template/slider/styles.css.js +26 -26
- package/lib/internal/template/slider/styles.d.ts +12 -0
- package/lib/internal/template/slider/styles.d.ts.map +1 -0
- package/lib/internal/template/slider/styles.js +20 -0
- package/lib/internal/template/slider/styles.js.map +1 -0
- package/lib/internal/template/slider/styles.scoped.css +165 -163
- package/lib/internal/template/slider/styles.selectors.js +26 -26
- package/lib/internal/template/spinner/styles.css.js +13 -13
- package/lib/internal/template/spinner/styles.scoped.css +39 -39
- package/lib/internal/template/spinner/styles.selectors.js +13 -13
- package/lib/internal/template/tabs/styles.css.js +30 -30
- package/lib/internal/template/tabs/styles.scoped.css +76 -76
- package/lib/internal/template/tabs/styles.selectors.js +30 -30
- package/lib/internal/template/tag-editor/styles.css.js +3 -3
- package/lib/internal/template/tag-editor/styles.scoped.css +13 -13
- package/lib/internal/template/tag-editor/styles.selectors.js +3 -3
- package/lib/internal/template/text-content/styles.css.js +1 -1
- package/lib/internal/template/text-content/styles.scoped.css +66 -66
- package/lib/internal/template/text-content/styles.selectors.js +1 -1
- package/lib/internal/template/textarea/styles.css.js +5 -5
- package/lib/internal/template/textarea/styles.scoped.css +45 -45
- package/lib/internal/template/textarea/styles.selectors.js +5 -5
- package/lib/internal/template/toggle/styles.css.js +10 -10
- package/lib/internal/template/toggle/styles.scoped.css +23 -23
- package/lib/internal/template/toggle/styles.selectors.js +10 -10
- package/package.json +1 -1
|
@@ -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_1oix2_149:not(#\9) {
|
|
150
150
|
display: contents;
|
|
151
151
|
}
|
|
152
|
-
div.
|
|
152
|
+
div.awsui_background_hyvsj_1oix2_149 > .awsui_scrolling-background_hyvsj_1oix2_152:not(#\9) {
|
|
153
153
|
background-color: var(--color-background-layout-main-05m5y6, #f2f3f3);
|
|
154
154
|
color: var(--color-text-body-default-5qid0u, #16191f);
|
|
155
155
|
grid-column: 1/span 5;
|
|
@@ -160,7 +160,7 @@ div.awsui_background_hyvsj_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_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_1oix2_163:not(#\9) {
|
|
164
164
|
background-color: var(--color-background-layout-main-05m5y6, #f2f3f3);
|
|
165
165
|
grid-area: breadcrumbs;
|
|
166
166
|
}
|
|
@@ -173,27 +173,27 @@ div.awsui_background_hyvsj_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_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_1oix2_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-4hh3rt);
|
|
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-4hh3rt);
|
|
185
185
|
z-index: 830;
|
|
186
186
|
}
|
|
187
|
-
.awsui_drawers-
|
|
187
|
+
.awsui_drawers-container_hyvsj_1oix2_176.awsui_has-open-drawer_hyvsj_1oix2_187:not(#\9) {
|
|
188
188
|
background-color: var(--color-background-container-content-aemn43, #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_1oix2_176:not(#\9) {
|
|
192
|
+
max-inline-size: calc(var(--awsui-layout-width-4hh3rt) - var(--awsui-main-offset-left-4hh3rt) - var(--awsui-default-min-content-width-4hh3rt) - var(--awsui-content-gap-right-4hh3rt));
|
|
193
193
|
}
|
|
194
194
|
}
|
|
195
195
|
@media (max-width: 688px) {
|
|
196
|
-
.awsui_drawers-
|
|
196
|
+
.awsui_drawers-container_hyvsj_1oix2_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_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_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_1oix2_176.awsui_disable-body-scroll_hyvsj_1oix2_208:not(#\9) {
|
|
209
|
+
inset-block-start: var(--awsui-header-height-4hh3rt);
|
|
210
210
|
}
|
|
211
211
|
}
|
|
212
212
|
|
|
213
|
-
.awsui_drawers-desktop-triggers-
|
|
213
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1oix2_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_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_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_1oix2_213:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1oix2_251).awsui_has-open-drawer_hyvsj_1oix2_187 {
|
|
252
252
|
inline-size: 0;
|
|
253
253
|
}
|
|
254
|
-
.awsui_drawers-desktop-triggers-
|
|
254
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1oix2_213.awsui_has-multiple-triggers_hyvsj_1oix2_251.awsui_has-open-drawer_hyvsj_1oix2_187:not(#\9) {
|
|
255
255
|
background-color: var(--color-background-container-content-aemn43, #ffffff);
|
|
256
256
|
}
|
|
257
|
-
.awsui_drawers-desktop-triggers-
|
|
257
|
+
.awsui_drawers-desktop-triggers-container_hyvsj_1oix2_213:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1oix2_251):not(.awsui_has-open-drawer_hyvsj_1oix2_187) {
|
|
258
258
|
inline-size: calc(var(--space-layout-toggle-padding-quc8b2, 12px) * 2 + var(--space-layout-toggle-diameter-vount6, 36px));
|
|
259
259
|
}
|
|
260
260
|
|
|
261
|
-
.awsui_drawers-mobile-triggers-
|
|
261
|
+
.awsui_drawers-mobile-triggers-container_hyvsj_1oix2_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_1oix2_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_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_1
|
|
|
271
271
|
padding-block-start: var(--space-scaled-s-gjhvjd, 12px);
|
|
272
272
|
inline-size: calc(var(--space-layout-toggle-padding-quc8b2, 12px) * 2 + var(--space-layout-toggle-diameter-vount6, 36px));
|
|
273
273
|
}
|
|
274
|
-
.awsui_drawers-trigger-
|
|
274
|
+
.awsui_drawers-trigger-content_hyvsj_1oix2_266:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1oix2_251).awsui_has-open-drawer_hyvsj_1oix2_187 {
|
|
275
275
|
opacity: 0;
|
|
276
276
|
}
|
|
277
|
-
.awsui_drawers-trigger-
|
|
277
|
+
.awsui_drawers-trigger-content_hyvsj_1oix2_266:not(#\9):not(.awsui_has-multiple-triggers_hyvsj_1oix2_251):not(.awsui_has-open-drawer_hyvsj_1oix2_187) {
|
|
278
278
|
opacity: 1;
|
|
279
279
|
}
|
|
280
|
-
.awsui_drawers-trigger-
|
|
280
|
+
.awsui_drawers-trigger-content_hyvsj_1oix2_266 > .awsui_drawers-trigger-overflow_hyvsj_1oix2_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_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_1
|
|
|
286
286
|
}
|
|
287
287
|
|
|
288
288
|
@media (max-width: 688px) {
|
|
289
|
-
.awsui_drawers-
|
|
289
|
+
.awsui_drawers-trigger_hyvsj_1oix2_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_1oix2_176:not(#\9) {
|
|
297
|
+
--awsui-drawer-size-4hh3rt: 290px;
|
|
298
298
|
background-color: var(--color-background-container-content-aemn43, #ffffff);
|
|
299
299
|
border-color: transparent;
|
|
300
300
|
display: grid;
|
|
@@ -308,28 +308,28 @@ div.awsui_background_hyvsj_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_1
|
|
|
308
308
|
pointer-events: auto;
|
|
309
309
|
word-wrap: break-word;
|
|
310
310
|
}
|
|
311
|
-
.
|
|
311
|
+
.awsui_drawer_hyvsj_1oix2_176 > .awsui_drawer-content-container_hyvsj_1oix2_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-4hh3rt);
|
|
315
315
|
display: grid;
|
|
316
316
|
grid-template-columns: var(--space-m-n2lypl, 16px) 1fr auto var(--space-m-n2lypl, 16px);
|
|
317
317
|
grid-template-rows: var(--size-vertical-panel-icon-offset-1tiizm, 15px) auto 1fr;
|
|
318
318
|
overflow-y: auto;
|
|
319
319
|
}
|
|
320
|
-
.
|
|
320
|
+
.awsui_drawer_hyvsj_1oix2_176 > .awsui_drawer-content-container_hyvsj_1oix2_311 > .awsui_drawer-close-button_hyvsj_1oix2_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_1oix2_176 > .awsui_drawer-content-container_hyvsj_1oix2_311 > .awsui_drawer-content_hyvsj_1oix2_311:not(#\9) {
|
|
326
326
|
grid-column: 1/span 4;
|
|
327
|
-
block-size: var(--awsui-content-height-
|
|
327
|
+
block-size: var(--awsui-content-height-4hh3rt);
|
|
328
328
|
}
|
|
329
|
-
.
|
|
329
|
+
.awsui_drawer_hyvsj_1oix2_176 > .awsui_drawer-content-container_hyvsj_1oix2_311 > .awsui_drawer-content_hyvsj_1oix2_311.awsui_drawer-content-hidden_hyvsj_1oix2_329:not(#\9) {
|
|
330
330
|
display: none;
|
|
331
331
|
}
|
|
332
|
-
.
|
|
332
|
+
.awsui_drawer_hyvsj_1oix2_176 > .awsui_drawer-slider_hyvsj_1oix2_332:not(#\9) {
|
|
333
333
|
grid-column: 1;
|
|
334
334
|
grid-row: 1;
|
|
335
335
|
block-size: 100%;
|
|
@@ -337,24 +337,24 @@ div.awsui_background_hyvsj_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_1
|
|
|
337
337
|
align-items: center;
|
|
338
338
|
z-index: 850;
|
|
339
339
|
}
|
|
340
|
-
.
|
|
340
|
+
.awsui_drawer_hyvsj_1oix2_176:not(#\9):not(.awsui_is-drawer-open_hyvsj_1oix2_340) {
|
|
341
341
|
opacity: 0;
|
|
342
342
|
inline-size: 0;
|
|
343
343
|
}
|
|
344
|
-
.
|
|
344
|
+
.awsui_drawer_hyvsj_1oix2_176.awsui_is-drawer-open_hyvsj_1oix2_340:not(#\9) {
|
|
345
345
|
border-inline-end: var(--border-divider-section-width-sznrdy, 1px) solid var(--color-border-divider-default-ipvpev, #eaeded);
|
|
346
346
|
border-inline-start: solid var(--border-divider-section-width-sznrdy, 1px) var(--color-border-divider-default-ipvpev, #eaeded);
|
|
347
347
|
opacity: 1;
|
|
348
|
-
inline-size: var(--awsui-drawer-size-
|
|
348
|
+
inline-size: var(--awsui-drawer-size-4hh3rt);
|
|
349
349
|
}
|
|
350
350
|
@media (min-width: 2541px) {
|
|
351
|
-
.
|
|
352
|
-
--awsui-drawer-size-
|
|
351
|
+
.awsui_drawer_hyvsj_1oix2_176.awsui_is-drawer-open_hyvsj_1oix2_340:not(#\9) {
|
|
352
|
+
--awsui-drawer-size-4hh3rt: 320px;
|
|
353
353
|
}
|
|
354
354
|
}
|
|
355
355
|
@media (max-width: 688px) {
|
|
356
|
-
.
|
|
357
|
-
--awsui-drawer-size-
|
|
356
|
+
.awsui_drawer_hyvsj_1oix2_176.awsui_is-drawer-open_hyvsj_1oix2_340:not(#\9) {
|
|
357
|
+
--awsui-drawer-size-4hh3rt: 100vw;
|
|
358
358
|
inline-size: 100vw;
|
|
359
359
|
}
|
|
360
360
|
}
|
|
@@ -363,7 +363,7 @@ div.awsui_background_hyvsj_1f2m7_149 > .awsui_scrolling-background_hyvsj_1f2m7_1
|
|
|
363
363
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
364
364
|
SPDX-License-Identifier: Apache-2.0
|
|
365
365
|
*/
|
|
366
|
-
header.
|
|
366
|
+
header.awsui_content_hyvsj_1oix2_366:not(#\9) {
|
|
367
367
|
grid-area: header;
|
|
368
368
|
}
|
|
369
369
|
|
|
@@ -388,35 +388,35 @@ The minimum content width property is set to zero and applied under all
|
|
|
388
388
|
circumstances regardless of whether the minContentWidth property is
|
|
389
389
|
explicitly set in script.
|
|
390
390
|
*/
|
|
391
|
-
.
|
|
392
|
-
--awsui-breadcrumbs-gap-
|
|
393
|
-
--awsui-content-gap-left-
|
|
394
|
-
--awsui-content-gap-right-
|
|
395
|
-
--awsui-content-height-
|
|
396
|
-
--awsui-default-max-content-width-
|
|
397
|
-
--awsui-default-min-content-width-
|
|
398
|
-
--awsui-footer-height-
|
|
399
|
-
--awsui-header-gap-
|
|
400
|
-
--awsui-header-height-
|
|
401
|
-
--awsui-layout-width-
|
|
402
|
-
--awsui-main-gap-
|
|
403
|
-
--awsui-main-offset-left-
|
|
404
|
-
--awsui-main-template-rows-
|
|
405
|
-
--awsui-max-content-width-
|
|
406
|
-
--awsui-min-content-width-
|
|
407
|
-
--awsui-mobile-bar-height-
|
|
408
|
-
--awsui-notifications-height-
|
|
409
|
-
--awsui-offset-top-
|
|
410
|
-
--awsui-overlap-height-
|
|
411
|
-
--awsui-toggles-left-width-
|
|
412
|
-
--awsui-toggles-right-width-
|
|
391
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9) {
|
|
392
|
+
--awsui-breadcrumbs-gap-4hh3rt: 0px;
|
|
393
|
+
--awsui-content-gap-left-4hh3rt: 0px;
|
|
394
|
+
--awsui-content-gap-right-4hh3rt: 0px;
|
|
395
|
+
--awsui-content-height-4hh3rt: calc(100vh - var(--awsui-header-height-4hh3rt) - var(--awsui-footer-height-4hh3rt));
|
|
396
|
+
--awsui-default-max-content-width-4hh3rt: 1280px;
|
|
397
|
+
--awsui-default-min-content-width-4hh3rt: 0px;
|
|
398
|
+
--awsui-footer-height-4hh3rt: 0px;
|
|
399
|
+
--awsui-header-gap-4hh3rt: 0px;
|
|
400
|
+
--awsui-header-height-4hh3rt: 0px;
|
|
401
|
+
--awsui-layout-width-4hh3rt: 0px;
|
|
402
|
+
--awsui-main-gap-4hh3rt: 0px;
|
|
403
|
+
--awsui-main-offset-left-4hh3rt: 0px;
|
|
404
|
+
--awsui-main-template-rows-4hh3rt: 1fr;
|
|
405
|
+
--awsui-max-content-width-4hh3rt: 0px;
|
|
406
|
+
--awsui-min-content-width-4hh3rt: 280px;
|
|
407
|
+
--awsui-mobile-bar-height-4hh3rt: calc(2 * var(--space-m-n2lypl, 16px) + var(--space-scaled-xs-sppte9, 8px));
|
|
408
|
+
--awsui-notifications-height-4hh3rt: 0px;
|
|
409
|
+
--awsui-offset-top-4hh3rt: var(--awsui-header-height-4hh3rt);
|
|
410
|
+
--awsui-overlap-height-4hh3rt: var(--space-dark-header-overlap-distance-45h6a9, 0px);
|
|
411
|
+
--awsui-toggles-left-width-4hh3rt: 0px;
|
|
412
|
+
--awsui-toggles-right-width-4hh3rt: 0px;
|
|
413
413
|
background-color: var(--color-background-layout-main-05m5y6, #f2f3f3);
|
|
414
414
|
color: var(--color-text-body-default-5qid0u, #16191f);
|
|
415
415
|
display: grid;
|
|
416
416
|
grid-template-areas: ". . mobileToolbar . ." ". . notifications . ." ". . breadcrumbsGap . ." ". . breadcrumbs . ." ". . headerGap . ." ". . header . ." ". . mainGap . ." ". . main . ." ". . main . .";
|
|
417
|
-
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-
|
|
418
|
-
grid-template-rows: auto auto var(--awsui-breadcrumbs-gap-
|
|
419
|
-
min-block-size: var(--awsui-content-height-
|
|
417
|
+
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-4hh3rt), 1fr) minmax(var(--awsui-default-min-content-width-4hh3rt), var(--awsui-default-max-content-width-4hh3rt)) minmax(var(--awsui-content-gap-right-4hh3rt), 1fr) min-content;
|
|
418
|
+
grid-template-rows: auto auto var(--awsui-breadcrumbs-gap-4hh3rt) auto var(--awsui-header-gap-4hh3rt) auto var(--awsui-main-gap-4hh3rt) var(--awsui-overlap-height-4hh3rt) var(--awsui-main-template-rows-4hh3rt);
|
|
419
|
+
min-block-size: var(--awsui-content-height-4hh3rt);
|
|
420
420
|
position: relative;
|
|
421
421
|
/*
|
|
422
422
|
Add unified max-width for AppLayout content based on breakpoints. Only use the max content
|
|
@@ -460,114 +460,114 @@ explicitly set in script.
|
|
|
460
460
|
*/
|
|
461
461
|
}
|
|
462
462
|
@media (min-width: 1401px) {
|
|
463
|
-
.
|
|
464
|
-
--awsui-default-max-content-width-
|
|
463
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463) {
|
|
464
|
+
--awsui-default-max-content-width-4hh3rt: 1280px;
|
|
465
465
|
}
|
|
466
466
|
}
|
|
467
467
|
@media (min-width: 1921px) {
|
|
468
|
-
.
|
|
469
|
-
--awsui-default-max-content-width-
|
|
468
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463) {
|
|
469
|
+
--awsui-default-max-content-width-4hh3rt: 1440px;
|
|
470
470
|
}
|
|
471
471
|
}
|
|
472
472
|
@media (min-width: 2541px) {
|
|
473
|
-
.
|
|
474
|
-
--awsui-default-max-content-width-
|
|
473
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463) {
|
|
474
|
+
--awsui-default-max-content-width-4hh3rt: 1620px;
|
|
475
475
|
}
|
|
476
476
|
}
|
|
477
477
|
@media (min-width: 1401px) {
|
|
478
|
-
.
|
|
479
|
-
--awsui-default-max-content-width-
|
|
478
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463).awsui_content-type-dashboard_hyvsj_1oix2_478 {
|
|
479
|
+
--awsui-default-max-content-width-4hh3rt: 1280px;
|
|
480
480
|
}
|
|
481
481
|
}
|
|
482
482
|
@media (min-width: 1921px) {
|
|
483
|
-
.
|
|
484
|
-
--awsui-default-max-content-width-
|
|
483
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463).awsui_content-type-dashboard_hyvsj_1oix2_478 {
|
|
484
|
+
--awsui-default-max-content-width-4hh3rt: 1620px;
|
|
485
485
|
}
|
|
486
486
|
}
|
|
487
487
|
@media (min-width: 2541px) {
|
|
488
|
-
.
|
|
489
|
-
--awsui-default-max-content-width-
|
|
488
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463).awsui_content-type-dashboard_hyvsj_1oix2_478 {
|
|
489
|
+
--awsui-default-max-content-width-4hh3rt: 2160px;
|
|
490
490
|
}
|
|
491
491
|
}
|
|
492
|
-
.
|
|
493
|
-
--awsui-default-max-content-width-
|
|
492
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463).awsui_content-type-table_hyvsj_1oix2_492, .awsui_layout_hyvsj_1oix2_391:not(#\9):not(.awsui_has-max-content-width_hyvsj_1oix2_463).awsui_content-type-cards_hyvsj_1oix2_492 {
|
|
493
|
+
--awsui-default-max-content-width-4hh3rt: 100%;
|
|
494
494
|
}
|
|
495
|
-
.
|
|
496
|
-
--awsui-default-max-content-width-
|
|
495
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-max-content-width_hyvsj_1oix2_463:not(#\9) {
|
|
496
|
+
--awsui-default-max-content-width-4hh3rt: var(--awsui-max-content-width-4hh3rt);
|
|
497
497
|
}
|
|
498
|
-
.
|
|
499
|
-
--awsui-overlap-height-
|
|
498
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_is-overlap-disabled_hyvsj_1oix2_498:not(#\9) {
|
|
499
|
+
--awsui-overlap-height-4hh3rt: 0;
|
|
500
500
|
}
|
|
501
|
-
.
|
|
502
|
-
--awsui-mobile-bar-height-
|
|
501
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_is-hide-mobile-toolbar_hyvsj_1oix2_501:not(#\9) {
|
|
502
|
+
--awsui-mobile-bar-height-4hh3rt: 0px;
|
|
503
503
|
}
|
|
504
504
|
@media (min-width: 993px) {
|
|
505
|
-
.
|
|
506
|
-
--awsui-default-min-content-width-
|
|
505
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9) {
|
|
506
|
+
--awsui-default-min-content-width-4hh3rt: var(--awsui-min-content-width-4hh3rt, 280px);
|
|
507
507
|
}
|
|
508
508
|
}
|
|
509
509
|
@media (max-width: 992px) {
|
|
510
|
-
.
|
|
511
|
-
--awsui-default-min-content-width-
|
|
510
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9) {
|
|
511
|
+
--awsui-default-min-content-width-4hh3rt: 0px;
|
|
512
512
|
}
|
|
513
513
|
}
|
|
514
514
|
@media (min-width: 689px) {
|
|
515
|
-
.
|
|
516
|
-
--awsui-content-gap-left-
|
|
515
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-content-gap-left_hyvsj_1oix2_515:not(#\9) {
|
|
516
|
+
--awsui-content-gap-left-4hh3rt: var(--space-layout-content-horizontal-q3zhej, 40px);
|
|
517
517
|
}
|
|
518
|
-
.
|
|
519
|
-
--awsui-content-gap-right-
|
|
518
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-content-gap-right_hyvsj_1oix2_518:not(#\9) {
|
|
519
|
+
--awsui-content-gap-right-4hh3rt: var(--space-layout-content-horizontal-q3zhej, 40px);
|
|
520
520
|
}
|
|
521
521
|
}
|
|
522
522
|
@media (max-width: 688px) {
|
|
523
|
-
.
|
|
524
|
-
--awsui-content-gap-left-
|
|
525
|
-
--awsui-content-gap-right-
|
|
523
|
+
.awsui_layout_hyvsj_1oix2_391:not(#\9) {
|
|
524
|
+
--awsui-content-gap-left-4hh3rt: var(--space-l-3cws6j, 20px);
|
|
525
|
+
--awsui-content-gap-right-4hh3rt: var(--space-l-3cws6j, 20px);
|
|
526
526
|
}
|
|
527
527
|
}
|
|
528
|
-
.
|
|
529
|
-
--awsui-breadcrumbs-gap-
|
|
528
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-breadcrumbs_hyvsj_1oix2_528:not(#\9) {
|
|
529
|
+
--awsui-breadcrumbs-gap-4hh3rt: var(--space-scaled-m-sw9kcx, 16px);
|
|
530
530
|
}
|
|
531
|
-
.
|
|
532
|
-
--awsui-header-gap-
|
|
531
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-header_hyvsj_1oix2_531:not(#\9), .awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-notifications_hyvsj_1oix2_531:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1oix2_528).awsui_has-header_hyvsj_1oix2_531 {
|
|
532
|
+
--awsui-header-gap-4hh3rt: var(--space-scaled-xs-sppte9, 8px);
|
|
533
533
|
}
|
|
534
|
-
.
|
|
535
|
-
--awsui-header-gap-
|
|
534
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-breadcrumbs_hyvsj_1oix2_528.awsui_has-header_hyvsj_1oix2_531:not(#\9) {
|
|
535
|
+
--awsui-header-gap-4hh3rt: var(--space-scaled-xs-sppte9, 8px);
|
|
536
536
|
}
|
|
537
|
-
.
|
|
538
|
-
--awsui-main-gap-
|
|
537
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-notifications_hyvsj_1oix2_531:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1oix2_528):not(.awsui_has-header_hyvsj_1oix2_531) {
|
|
538
|
+
--awsui-main-gap-4hh3rt: var(--space-xs-kw7k3v, 8px);
|
|
539
539
|
}
|
|
540
|
-
.
|
|
541
|
-
--awsui-main-gap-
|
|
540
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-breadcrumbs_hyvsj_1oix2_528:not(#\9):not(.awsui_has-header_hyvsj_1oix2_531) {
|
|
541
|
+
--awsui-main-gap-4hh3rt: var(--space-scaled-xxs-jatbiv, 4px);
|
|
542
542
|
}
|
|
543
|
-
.
|
|
544
|
-
--awsui-main-gap-
|
|
543
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-header_hyvsj_1oix2_531:not(#\9) {
|
|
544
|
+
--awsui-main-gap-4hh3rt: var(--space-content-header-padding-bottom-hjkugf, 16px);
|
|
545
545
|
}
|
|
546
|
-
.
|
|
547
|
-
--awsui-main-gap-
|
|
546
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-main_hyvsj_1oix2_546:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1oix2_546) {
|
|
547
|
+
--awsui-main-gap-4hh3rt: var(--space-scaled-s-gjhvjd, 12px);
|
|
548
548
|
}
|
|
549
|
-
.
|
|
550
|
-
--awsui-main-gap-
|
|
549
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-main_hyvsj_1oix2_546.awsui_disable-content-paddings_hyvsj_1oix2_546:not(#\9) {
|
|
550
|
+
--awsui-main-gap-4hh3rt: 0px;
|
|
551
551
|
}
|
|
552
552
|
@media (max-width: 688px) {
|
|
553
|
-
.
|
|
554
|
-
--awsui-header-gap-
|
|
553
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-header_hyvsj_1oix2_531:not(#\9) {
|
|
554
|
+
--awsui-header-gap-4hh3rt: var(--space-scaled-s-gjhvjd, 12px);
|
|
555
555
|
}
|
|
556
|
-
.
|
|
557
|
-
--awsui-header-gap-
|
|
556
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-notifications_hyvsj_1oix2_531:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1oix2_528).awsui_has-header_hyvsj_1oix2_531 {
|
|
557
|
+
--awsui-header-gap-4hh3rt: var(--space-scaled-s-gjhvjd, 12px);
|
|
558
558
|
}
|
|
559
|
-
.
|
|
560
|
-
--awsui-main-gap-
|
|
559
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-notifications_hyvsj_1oix2_531:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1oix2_528):not(.awsui_has-header_hyvsj_1oix2_531), .awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-main_hyvsj_1oix2_546:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1oix2_546) {
|
|
560
|
+
--awsui-main-gap-4hh3rt: var(--space-scaled-s-gjhvjd, 12px);
|
|
561
561
|
}
|
|
562
|
-
.
|
|
563
|
-
--awsui-main-gap-
|
|
562
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_content-first-child-main_hyvsj_1oix2_546.awsui_disable-content-paddings_hyvsj_1oix2_546:not(#\9) {
|
|
563
|
+
--awsui-main-gap-4hh3rt: 0px;
|
|
564
564
|
}
|
|
565
565
|
}
|
|
566
|
-
.
|
|
567
|
-
--awsui-toggles-left-width-
|
|
566
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-left-toggles-gutter_hyvsj_1oix2_566:not(#\9) {
|
|
567
|
+
--awsui-toggles-left-width-4hh3rt: calc(var(--space-layout-toggle-padding-quc8b2, 12px) + 36px);
|
|
568
568
|
}
|
|
569
|
-
.
|
|
570
|
-
--awsui-toggles-right-width-
|
|
569
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_has-right-toggles-gutter_hyvsj_1oix2_569:not(#\9) {
|
|
570
|
+
--awsui-toggles-right-width-4hh3rt: calc(var(--space-layout-toggle-padding-quc8b2, 12px) + 36px);
|
|
571
571
|
}
|
|
572
572
|
|
|
573
573
|
/*
|
|
@@ -580,27 +580,27 @@ not matter. The offset top value for AppLayout contentMain children with
|
|
|
580
580
|
position: sticky will be the value of the notifications height in addition to the
|
|
581
581
|
notifications top margin and some additional vertical space for aesthetics.
|
|
582
582
|
*/
|
|
583
|
-
.
|
|
584
|
-
--awsui-main-template-rows-
|
|
585
|
-
--awsui-offset-top-
|
|
586
|
-
block-size: var(--awsui-content-height-
|
|
583
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_disable-body-scroll_hyvsj_1oix2_208:not(#\9) {
|
|
584
|
+
--awsui-main-template-rows-4hh3rt: 1fr auto;
|
|
585
|
+
--awsui-offset-top-4hh3rt: 0px;
|
|
586
|
+
block-size: var(--awsui-content-height-4hh3rt);
|
|
587
587
|
overflow-y: scroll;
|
|
588
588
|
}
|
|
589
|
-
.
|
|
590
|
-
--awsui-main-template-rows-
|
|
589
|
+
.awsui_layout_hyvsj_1oix2_391.awsui_disable-body-scroll_hyvsj_1oix2_208.awsui_has-split-panel_hyvsj_1oix2_589.awsui_split-panel-position-bottom_hyvsj_1oix2_589:not(#\9) {
|
|
590
|
+
--awsui-main-template-rows-4hh3rt: repeat(2, auto);
|
|
591
591
|
}
|
|
592
592
|
|
|
593
593
|
/*
|
|
594
594
|
This CSS class is applied to the document body to prevent overflow scrolling
|
|
595
595
|
when the navigation or tools drawers are open in responsive viewports.
|
|
596
596
|
*/
|
|
597
|
-
.awsui_block-body-
|
|
597
|
+
.awsui_block-body-scroll_hyvsj_1oix2_597:not(#\9) {
|
|
598
598
|
overflow: hidden;
|
|
599
599
|
}
|
|
600
600
|
|
|
601
601
|
/* stylelint-disable selector-max-universal, selector-combinator-disallowed-list */
|
|
602
|
-
.
|
|
603
|
-
.
|
|
602
|
+
.awsui_unfocusable_hyvsj_1oix2_602:not(#\9),
|
|
603
|
+
.awsui_unfocusable_hyvsj_1oix2_602 *:not(#\9) {
|
|
604
604
|
visibility: hidden !important;
|
|
605
605
|
}
|
|
606
606
|
|
|
@@ -609,7 +609,7 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
609
609
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
610
610
|
SPDX-License-Identifier: Apache-2.0
|
|
611
611
|
*/
|
|
612
|
-
.
|
|
612
|
+
.awsui_container_hyvsj_1oix2_612:not(#\9) {
|
|
613
613
|
grid-area: main;
|
|
614
614
|
padding-block-end: var(--space-layout-content-bottom-iu1izz, 20px);
|
|
615
615
|
/*
|
|
@@ -626,19 +626,19 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
626
626
|
on the right, we decrement the column end by one.
|
|
627
627
|
*/
|
|
628
628
|
}
|
|
629
|
-
.
|
|
630
|
-
padding-block-end: calc(var(--awsui-split-panel-height-
|
|
629
|
+
.awsui_container_hyvsj_1oix2_612.awsui_has-split-panel_hyvsj_1oix2_589.awsui_split-panel-position-bottom_hyvsj_1oix2_589:not(#\9) {
|
|
630
|
+
padding-block-end: calc(var(--awsui-split-panel-height-4hh3rt) + var(--space-layout-content-bottom-iu1izz, 20px));
|
|
631
631
|
}
|
|
632
|
-
.
|
|
632
|
+
.awsui_container_hyvsj_1oix2_612.awsui_disable-content-paddings_hyvsj_1oix2_546:not(#\9) {
|
|
633
633
|
grid-column: 1/6;
|
|
634
634
|
padding-block: 0;
|
|
635
635
|
padding-inline: 0;
|
|
636
636
|
}
|
|
637
637
|
@media (min-width: 689px) {
|
|
638
|
-
.
|
|
638
|
+
.awsui_container_hyvsj_1oix2_612.awsui_disable-content-paddings_hyvsj_1oix2_546.awsui_is-navigation-open_hyvsj_1oix2_638:not(#\9) {
|
|
639
639
|
grid-column-start: 2;
|
|
640
640
|
}
|
|
641
|
-
.
|
|
641
|
+
.awsui_container_hyvsj_1oix2_612.awsui_disable-content-paddings_hyvsj_1oix2_546.awsui_is-tools-open_hyvsj_1oix2_641:not(#\9), .awsui_container_hyvsj_1oix2_612.awsui_disable-content-paddings_hyvsj_1oix2_546.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_split-panel-position-side_hyvsj_1oix2_641:not(#\9), .awsui_container_hyvsj_1oix2_612.awsui_disable-content-paddings_hyvsj_1oix2_546.awsui_has-active-drawer_hyvsj_1oix2_641:not(#\9) {
|
|
642
642
|
grid-column-end: 5;
|
|
643
643
|
}
|
|
644
644
|
}
|
|
@@ -651,13 +651,13 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
651
651
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
652
652
|
SPDX-License-Identifier: Apache-2.0
|
|
653
653
|
*/
|
|
654
|
-
section.awsui_mobile-
|
|
654
|
+
section.awsui_mobile-toolbar_hyvsj_1oix2_654:not(#\9) {
|
|
655
655
|
align-items: center;
|
|
656
656
|
background-color: var(--color-background-layout-main-05m5y6, #f2f3f3);
|
|
657
657
|
border-block-end: 1px solid var(--color-border-divider-default-ipvpev, #eaeded);
|
|
658
658
|
box-shadow: var(--shadow-sticky-50bkab, 0px 1px 4px -2px rgba(0, 28, 36, 0.5));
|
|
659
659
|
box-sizing: border-box;
|
|
660
|
-
block-size: var(--awsui-mobile-bar-height-
|
|
660
|
+
block-size: var(--awsui-mobile-bar-height-4hh3rt);
|
|
661
661
|
display: grid;
|
|
662
662
|
grid-area: mobileToolbar;
|
|
663
663
|
grid-column: 1/span 5;
|
|
@@ -665,22 +665,22 @@ section.awsui_mobile-toolbar_hyvsj_1f2m7_654:not(#\9) {
|
|
|
665
665
|
padding-block: 0;
|
|
666
666
|
padding-inline: var(--space-m-n2lypl, 16px);
|
|
667
667
|
position: sticky;
|
|
668
|
-
inset-block-start: var(--awsui-offset-top-
|
|
668
|
+
inset-block-start: var(--awsui-offset-top-4hh3rt);
|
|
669
669
|
z-index: 1000;
|
|
670
670
|
}
|
|
671
|
-
section.awsui_mobile-
|
|
671
|
+
section.awsui_mobile-toolbar_hyvsj_1oix2_654:not(#\9):not(.awsui_remove-high-contrast-header_hyvsj_1oix2_671) {
|
|
672
672
|
background-color: var(--color-background-layout-main-05m5y6, #f2f3f3);
|
|
673
673
|
box-shadow: var(--shadow-panel-toggle-rswlot, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
|
|
674
674
|
}
|
|
675
|
-
section.awsui_mobile-
|
|
675
|
+
section.awsui_mobile-toolbar_hyvsj_1oix2_654 > .awsui_mobile-toolbar-nav_hyvsj_1oix2_675:not(#\9) {
|
|
676
676
|
grid-column: 1;
|
|
677
677
|
margin-inline-end: var(--space-m-n2lypl, 16px);
|
|
678
678
|
}
|
|
679
|
-
section.awsui_mobile-
|
|
679
|
+
section.awsui_mobile-toolbar_hyvsj_1oix2_654 > .awsui_mobile-toolbar-breadcrumbs_hyvsj_1oix2_679:not(#\9) {
|
|
680
680
|
grid-column: 2;
|
|
681
681
|
background-color: var(--color-background-layout-main-05m5y6, #f2f3f3);
|
|
682
682
|
}
|
|
683
|
-
section.awsui_mobile-
|
|
683
|
+
section.awsui_mobile-toolbar_hyvsj_1oix2_654 > .awsui_mobile-toolbar-tools_hyvsj_1oix2_683:not(#\9) {
|
|
684
684
|
grid-column: 3;
|
|
685
685
|
margin-inline-start: var(--space-m-n2lypl, 16px);
|
|
686
686
|
}
|
|
@@ -689,13 +689,13 @@ section.awsui_mobile-toolbar_hyvsj_1f2m7_654 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
689
689
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
690
690
|
SPDX-License-Identifier: Apache-2.0
|
|
691
691
|
*/
|
|
692
|
-
.awsui_navigation-
|
|
692
|
+
.awsui_navigation-container_hyvsj_1oix2_692:not(#\9) {
|
|
693
693
|
display: flex;
|
|
694
694
|
grid-column: 1;
|
|
695
695
|
grid-row: 1/span 9;
|
|
696
|
-
block-size: var(--awsui-content-height-
|
|
696
|
+
block-size: var(--awsui-content-height-4hh3rt);
|
|
697
697
|
position: sticky;
|
|
698
|
-
inset-block-start: var(--awsui-offset-top-
|
|
698
|
+
inset-block-start: var(--awsui-offset-top-4hh3rt);
|
|
699
699
|
z-index: 830;
|
|
700
700
|
/*
|
|
701
701
|
The navigation and tools containers (that contain the toggle buttons)
|
|
@@ -710,7 +710,7 @@ section.awsui_mobile-toolbar_hyvsj_1f2m7_654 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
710
710
|
pointer-events: none;
|
|
711
711
|
}
|
|
712
712
|
@media (max-width: 688px) {
|
|
713
|
-
.awsui_navigation-
|
|
713
|
+
.awsui_navigation-container_hyvsj_1oix2_692:not(#\9) {
|
|
714
714
|
inset-inline-start: 0;
|
|
715
715
|
position: fixed;
|
|
716
716
|
z-index: 1001;
|
|
@@ -722,12 +722,12 @@ section.awsui_mobile-toolbar_hyvsj_1f2m7_654 > .awsui_mobile-toolbar-tools_hyvsj
|
|
|
722
722
|
relative to the body.
|
|
723
723
|
*/
|
|
724
724
|
}
|
|
725
|
-
.awsui_navigation-
|
|
726
|
-
inset-block-start: var(--awsui-header-height-
|
|
725
|
+
.awsui_navigation-container_hyvsj_1oix2_692.awsui_disable-body-scroll_hyvsj_1oix2_208:not(#\9) {
|
|
726
|
+
inset-block-start: var(--awsui-header-height-4hh3rt);
|
|
727
727
|
}
|
|
728
728
|
}
|
|
729
729
|
|
|
730
|
-
nav.awsui_show-
|
|
730
|
+
nav.awsui_show-navigation_hyvsj_1oix2_730:not(#\9) {
|
|
731
731
|
padding-block: var(--space-scaled-s-gjhvjd, 12px);
|
|
732
732
|
padding-inline: var(--space-layout-toggle-padding-quc8b2, 12px);
|
|
733
733
|
/*
|
|
@@ -735,7 +735,7 @@ nav.awsui_show-navigation_hyvsj_1f2m7_730:not(#\9) {
|
|
|
735
735
|
take control in responsive viewports.
|
|
736
736
|
*/
|
|
737
737
|
}
|
|
738
|
-
@keyframes
|
|
738
|
+
@keyframes awsui_showButtons_hyvsj_1oix2_1 {
|
|
739
739
|
0% {
|
|
740
740
|
opacity: 0;
|
|
741
741
|
}
|
|
@@ -743,31 +743,31 @@ nav.awsui_show-navigation_hyvsj_1f2m7_730:not(#\9) {
|
|
|
743
743
|
opacity: 1;
|
|
744
744
|
}
|
|
745
745
|
}
|
|
746
|
-
nav.awsui_show-
|
|
746
|
+
nav.awsui_show-navigation_hyvsj_1oix2_730.awsui_is-navigation-open_hyvsj_1oix2_638:not(#\9) {
|
|
747
747
|
display: none;
|
|
748
748
|
}
|
|
749
749
|
@media (min-width: 689px) {
|
|
750
|
-
nav.awsui_show-
|
|
750
|
+
nav.awsui_show-navigation_hyvsj_1oix2_730:not(#\9):not(.awsui_is-navigation-open_hyvsj_1oix2_638) {
|
|
751
751
|
display: block;
|
|
752
752
|
}
|
|
753
|
-
nav.awsui_show-
|
|
754
|
-
animation:
|
|
753
|
+
nav.awsui_show-navigation_hyvsj_1oix2_730:not(#\9):not(.awsui_is-navigation-open_hyvsj_1oix2_638).awsui_animating_hyvsj_1oix2_753 {
|
|
754
|
+
animation: awsui_showButtons_hyvsj_1oix2_1 var(--motion-duration-refresh-only-fast-v9rk6z, 0ms);
|
|
755
755
|
}
|
|
756
756
|
}
|
|
757
757
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
758
|
-
nav.awsui_show-
|
|
758
|
+
nav.awsui_show-navigation_hyvsj_1oix2_730:not(#\9):not(.awsui_is-navigation-open_hyvsj_1oix2_638).awsui_animating_hyvsj_1oix2_753 {
|
|
759
759
|
animation: none;
|
|
760
760
|
transition: none;
|
|
761
761
|
}
|
|
762
762
|
}
|
|
763
763
|
@media (min-width: 689px) {
|
|
764
|
-
.awsui-motion-disabled nav.awsui_show-
|
|
764
|
+
.awsui-motion-disabled nav.awsui_show-navigation_hyvsj_1oix2_730:not(#\9):not(.awsui_is-navigation-open_hyvsj_1oix2_638).awsui_animating_hyvsj_1oix2_753, .awsui-mode-entering nav.awsui_show-navigation_hyvsj_1oix2_730:not(#\9):not(.awsui_is-navigation-open_hyvsj_1oix2_638).awsui_animating_hyvsj_1oix2_753 {
|
|
765
765
|
animation: none;
|
|
766
766
|
transition: none;
|
|
767
767
|
}
|
|
768
768
|
}
|
|
769
769
|
|
|
770
|
-
nav.
|
|
770
|
+
nav.awsui_navigation_hyvsj_1oix2_692:not(#\9) {
|
|
771
771
|
background-color: var(--color-background-container-content-aemn43, #ffffff);
|
|
772
772
|
inset-block-end: 0;
|
|
773
773
|
block-size: 100%;
|
|
@@ -787,46 +787,46 @@ nav.awsui_navigation_hyvsj_1f2m7_692:not(#\9) {
|
|
|
787
787
|
prevent unwanted text wrapping.
|
|
788
788
|
*/
|
|
789
789
|
}
|
|
790
|
-
@keyframes
|
|
790
|
+
@keyframes awsui_openNavigation_hyvsj_1oix2_1 {
|
|
791
791
|
from {
|
|
792
792
|
opacity: 0;
|
|
793
793
|
inline-size: calc(var(--space-layout-toggle-padding-quc8b2, 12px) * 2 + var(--space-layout-toggle-diameter-vount6, 36px));
|
|
794
794
|
}
|
|
795
795
|
to {
|
|
796
796
|
opacity: 1;
|
|
797
|
-
inline-size: var(--awsui-navigation-width-
|
|
797
|
+
inline-size: var(--awsui-navigation-width-4hh3rt);
|
|
798
798
|
}
|
|
799
799
|
}
|
|
800
|
-
nav.
|
|
800
|
+
nav.awsui_navigation_hyvsj_1oix2_692:not(#\9):not(.awsui_is-navigation-open_hyvsj_1oix2_638) {
|
|
801
801
|
inline-size: 0;
|
|
802
802
|
display: none;
|
|
803
803
|
}
|
|
804
|
-
nav.
|
|
805
|
-
animation:
|
|
804
|
+
nav.awsui_navigation_hyvsj_1oix2_692.awsui_is-navigation-open_hyvsj_1oix2_638.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
805
|
+
animation: awsui_openNavigation_hyvsj_1oix2_1 var(--motion-duration-refresh-only-fast-v9rk6z, 0ms);
|
|
806
806
|
}
|
|
807
807
|
@media (prefers-reduced-motion: reduce) {
|
|
808
|
-
nav.
|
|
808
|
+
nav.awsui_navigation_hyvsj_1oix2_692.awsui_is-navigation-open_hyvsj_1oix2_638.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
809
809
|
animation: none;
|
|
810
810
|
transition: none;
|
|
811
811
|
}
|
|
812
812
|
}
|
|
813
|
-
.awsui-motion-disabled nav.
|
|
813
|
+
.awsui-motion-disabled nav.awsui_navigation_hyvsj_1oix2_692.awsui_is-navigation-open_hyvsj_1oix2_638.awsui_animating_hyvsj_1oix2_753:not(#\9), .awsui-mode-entering nav.awsui_navigation_hyvsj_1oix2_692.awsui_is-navigation-open_hyvsj_1oix2_638.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
814
814
|
animation: none;
|
|
815
815
|
transition: none;
|
|
816
816
|
}
|
|
817
|
-
nav.
|
|
818
|
-
inline-size: var(--awsui-navigation-width-
|
|
817
|
+
nav.awsui_navigation_hyvsj_1oix2_692 > .awsui_animated-content_hyvsj_1oix2_817:not(#\9) {
|
|
818
|
+
inline-size: var(--awsui-navigation-width-4hh3rt);
|
|
819
819
|
}
|
|
820
|
-
nav.
|
|
820
|
+
nav.awsui_navigation_hyvsj_1oix2_692 > .awsui_content-container_hyvsj_1oix2_820:not(#\9) {
|
|
821
821
|
flex-grow: 1;
|
|
822
822
|
}
|
|
823
823
|
@media (max-width: 688px) {
|
|
824
|
-
nav.
|
|
825
|
-
--awsui-navigation-width-
|
|
824
|
+
nav.awsui_navigation_hyvsj_1oix2_692:not(#\9) {
|
|
825
|
+
--awsui-navigation-width-4hh3rt: 100vw;
|
|
826
826
|
}
|
|
827
827
|
}
|
|
828
828
|
|
|
829
|
-
.awsui_hide-
|
|
829
|
+
.awsui_hide-navigation_hyvsj_1oix2_829:not(#\9) {
|
|
830
830
|
position: absolute;
|
|
831
831
|
inset-inline-end: var(--space-m-n2lypl, 16px);
|
|
832
832
|
inset-block-start: var(--size-vertical-panel-icon-offset-1tiizm, 15px);
|
|
@@ -836,24 +836,24 @@ nav.awsui_navigation_hyvsj_1f2m7_692 > .awsui_content-container_hyvsj_1f2m7_820:
|
|
|
836
836
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
837
837
|
SPDX-License-Identifier: Apache-2.0
|
|
838
838
|
*/
|
|
839
|
-
.
|
|
839
|
+
.awsui_notifications_hyvsj_1oix2_839:not(#\9) {
|
|
840
840
|
color: var(--color-text-body-default-5qid0u, #16191f);
|
|
841
841
|
grid-area: notifications;
|
|
842
842
|
z-index: 850;
|
|
843
843
|
}
|
|
844
|
-
.
|
|
844
|
+
.awsui_notifications_hyvsj_1oix2_839.awsui_has-notification-content_hyvsj_1oix2_844:not(#\9) {
|
|
845
845
|
padding-block-start: var(--space-scaled-s-gjhvjd, 12px);
|
|
846
846
|
}
|
|
847
847
|
@media (min-width: 689px) {
|
|
848
|
-
.
|
|
849
|
-
--awsui-flashbar-sticky-bottom-margin-
|
|
848
|
+
.awsui_notifications_hyvsj_1oix2_839.awsui_sticky-notifications_hyvsj_1oix2_848:not(#\9) {
|
|
849
|
+
--awsui-flashbar-sticky-bottom-margin-4hh3rt: var(--space-xxl-q0lyvp, 32px);
|
|
850
850
|
position: sticky;
|
|
851
|
-
inset-block-start: var(--awsui-offset-top-
|
|
851
|
+
inset-block-start: var(--awsui-offset-top-4hh3rt);
|
|
852
852
|
}
|
|
853
|
-
.
|
|
853
|
+
.awsui_notifications_hyvsj_1oix2_839.awsui_sticky-notifications_hyvsj_1oix2_848:not(#\9):not(.awsui_high-contrast_hyvsj_1oix2_853) {
|
|
854
854
|
background-color: var(--color-background-layout-main-05m5y6, #f2f3f3);
|
|
855
855
|
}
|
|
856
|
-
.
|
|
856
|
+
.awsui_notifications_hyvsj_1oix2_839.awsui_has-notification-content_hyvsj_1oix2_844:not(#\9) {
|
|
857
857
|
padding-block-start: var(--space-xs-kw7k3v, 8px);
|
|
858
858
|
}
|
|
859
859
|
}
|
|
@@ -868,13 +868,13 @@ as the content area. This row is defined as 1 fractional unit which will
|
|
|
868
868
|
consume the remaining vertical space in the grid after the notifications
|
|
869
869
|
and breadcrumbs.
|
|
870
870
|
*/
|
|
871
|
-
section.awsui_split-panel-
|
|
871
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871:not(#\9) {
|
|
872
872
|
/*
|
|
873
873
|
The align self property will position the split panel at the bottom of the grid row.
|
|
874
874
|
This could be off the viewport if the content area has enough content to be scrollable.
|
|
875
875
|
*/
|
|
876
876
|
align-self: end;
|
|
877
|
-
inset-block-end: var(--awsui-footer-height-
|
|
877
|
+
inset-block-end: var(--awsui-footer-height-4hh3rt);
|
|
878
878
|
display: none;
|
|
879
879
|
grid-column: 1/6;
|
|
880
880
|
grid-row: 9;
|
|
@@ -904,47 +904,47 @@ section.awsui_split-panel-bottom_hyvsj_1f2m7_871:not(#\9) {
|
|
|
904
904
|
apply the animation to the height property.
|
|
905
905
|
*/
|
|
906
906
|
}
|
|
907
|
-
@keyframes
|
|
907
|
+
@keyframes awsui_openSplitPanelBottom_hyvsj_1oix2_1 {
|
|
908
908
|
from {
|
|
909
|
-
block-size: var(--awsui-split-panel-reported-header-size-
|
|
909
|
+
block-size: var(--awsui-split-panel-reported-header-size-4hh3rt, 0);
|
|
910
910
|
}
|
|
911
911
|
to {
|
|
912
|
-
block-size: var(--awsui-split-panel-reported-size-
|
|
912
|
+
block-size: var(--awsui-split-panel-reported-size-4hh3rt);
|
|
913
913
|
}
|
|
914
914
|
}
|
|
915
|
-
section.awsui_split-panel-
|
|
915
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_disable-body-scroll_hyvsj_1oix2_208:not(#\9) {
|
|
916
916
|
inset-block-end: 0;
|
|
917
917
|
}
|
|
918
|
-
section.awsui_split-panel-
|
|
918
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_is-navigation-open_hyvsj_1oix2_638.awsui_position-bottom_hyvsj_1oix2_918:not(#\9) {
|
|
919
919
|
grid-column-start: 2;
|
|
920
920
|
}
|
|
921
|
-
section.awsui_split-panel-
|
|
921
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_has-open-drawer_hyvsj_1oix2_187.awsui_position-bottom_hyvsj_1oix2_918:not(#\9) {
|
|
922
922
|
grid-column-end: 5;
|
|
923
923
|
}
|
|
924
|
-
section.awsui_split-panel-
|
|
924
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_position-bottom_hyvsj_1oix2_918:not(#\9) {
|
|
925
925
|
display: block;
|
|
926
926
|
}
|
|
927
|
-
section.awsui_split-panel-
|
|
927
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1oix2_641).awsui_position-bottom_hyvsj_1oix2_918 {
|
|
928
928
|
box-shadow: rgba(0, 7, 22, 0.1) 0px -32px 32px -24px;
|
|
929
929
|
}
|
|
930
|
-
section.awsui_split-panel-
|
|
930
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_position-bottom_hyvsj_1oix2_918:not(#\9) {
|
|
931
931
|
box-shadow: var(--shadow-split-bottom-0ncj9i, 0 -2px 1px -1px rgba(0, 28, 36, 0.15), 0 -1px 1px -1px rgba(0, 28, 36, 0.3));
|
|
932
932
|
}
|
|
933
|
-
section.awsui_split-panel-
|
|
934
|
-
animation:
|
|
933
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_position-bottom_hyvsj_1oix2_918.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
934
|
+
animation: awsui_openSplitPanelBottom_hyvsj_1oix2_1 var(--motion-duration-refresh-only-fast-v9rk6z, 0ms);
|
|
935
935
|
}
|
|
936
936
|
@media (prefers-reduced-motion: reduce) {
|
|
937
|
-
section.awsui_split-panel-
|
|
937
|
+
section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_position-bottom_hyvsj_1oix2_918.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
938
938
|
animation: none;
|
|
939
939
|
transition: none;
|
|
940
940
|
}
|
|
941
941
|
}
|
|
942
|
-
.awsui-motion-disabled section.awsui_split-panel-
|
|
942
|
+
.awsui-motion-disabled section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_position-bottom_hyvsj_1oix2_918.awsui_animating_hyvsj_1oix2_753:not(#\9), .awsui-mode-entering section.awsui_split-panel-bottom_hyvsj_1oix2_871.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_position-bottom_hyvsj_1oix2_918.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
943
943
|
animation: none;
|
|
944
944
|
transition: none;
|
|
945
945
|
}
|
|
946
946
|
|
|
947
|
-
section.awsui_split-panel-
|
|
947
|
+
section.awsui_split-panel-side_hyvsj_1oix2_947:not(#\9) {
|
|
948
948
|
block-size: 100%;
|
|
949
949
|
overflow-x: hidden;
|
|
950
950
|
pointer-events: auto;
|
|
@@ -954,15 +954,15 @@ section.awsui_split-panel-side_hyvsj_1f2m7_947:not(#\9) {
|
|
|
954
954
|
be persistent in the DOM when closed.
|
|
955
955
|
*/
|
|
956
956
|
}
|
|
957
|
-
section.awsui_split-panel-
|
|
957
|
+
section.awsui_split-panel-side_hyvsj_1oix2_947:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1oix2_641), section.awsui_split-panel-side_hyvsj_1oix2_947.awsui_position-bottom_hyvsj_1oix2_918:not(#\9) {
|
|
958
958
|
inline-size: 0;
|
|
959
959
|
}
|
|
960
|
-
section.awsui_split-panel-
|
|
961
|
-
max-inline-size: var(--awsui-split-panel-max-width-
|
|
962
|
-
min-inline-size: var(--awsui-split-panel-min-width-
|
|
960
|
+
section.awsui_split-panel-side_hyvsj_1oix2_947.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_position-side_hyvsj_1oix2_960:not(#\9) {
|
|
961
|
+
max-inline-size: var(--awsui-split-panel-max-width-4hh3rt, 280px);
|
|
962
|
+
min-inline-size: var(--awsui-split-panel-min-width-4hh3rt, 280px);
|
|
963
963
|
border-inline-start: solid var(--border-divider-section-width-sznrdy, 1px) var(--color-border-divider-default-ipvpev, #eaeded);
|
|
964
964
|
}
|
|
965
|
-
section.awsui_split-panel-
|
|
965
|
+
section.awsui_split-panel-side_hyvsj_1oix2_947.awsui_is-split-panel-open_hyvsj_1oix2_641.awsui_position-side_hyvsj_1oix2_960:not(#\9):not(.awsui_has-open-drawer_hyvsj_1oix2_187) {
|
|
966
966
|
border-inline-end: var(--border-divider-section-width-sznrdy, 1px) solid var(--color-border-divider-panel-side-cxdqom, transparent);
|
|
967
967
|
}
|
|
968
968
|
|
|
@@ -979,22 +979,22 @@ content width has a default value that can be set directly with the minContentWi
|
|
|
979
979
|
property. The content gap right is computed in the Layout styles based on the
|
|
980
980
|
viewport size and state of the Tools drawer.
|
|
981
981
|
*/
|
|
982
|
-
.awsui_tools-
|
|
983
|
-
--awsui-tools-max-width-
|
|
982
|
+
.awsui_tools-container_hyvsj_1oix2_982:not(#\9) {
|
|
983
|
+
--awsui-tools-max-width-4hh3rt: calc(var(--awsui-layout-width-4hh3rt) - var(--awsui-main-offset-left-4hh3rt) - var(--awsui-default-min-content-width-4hh3rt) - var(--awsui-content-gap-right-4hh3rt));
|
|
984
984
|
display: flex;
|
|
985
985
|
grid-column: 5;
|
|
986
986
|
grid-row: 1/span 9;
|
|
987
|
-
block-size: var(--awsui-content-height-
|
|
988
|
-
max-inline-size: var(--awsui-tools-max-width-
|
|
987
|
+
block-size: var(--awsui-content-height-4hh3rt);
|
|
988
|
+
max-inline-size: var(--awsui-tools-max-width-4hh3rt);
|
|
989
989
|
position: sticky;
|
|
990
|
-
inset-block-start: var(--awsui-offset-top-
|
|
990
|
+
inset-block-start: var(--awsui-offset-top-4hh3rt);
|
|
991
991
|
z-index: 830;
|
|
992
992
|
pointer-events: none;
|
|
993
993
|
}
|
|
994
994
|
@media (max-width: 688px) {
|
|
995
|
-
.awsui_tools-
|
|
996
|
-
--awsui-tools-max-width-
|
|
997
|
-
--awsui-tools-width-
|
|
995
|
+
.awsui_tools-container_hyvsj_1oix2_982:not(#\9) {
|
|
996
|
+
--awsui-tools-max-width-4hh3rt: none;
|
|
997
|
+
--awsui-tools-width-4hh3rt: auto;
|
|
998
998
|
position: fixed;
|
|
999
999
|
inset-inline-end: 0;
|
|
1000
1000
|
z-index: 1001;
|
|
@@ -1006,12 +1006,12 @@ viewport size and state of the Tools drawer.
|
|
|
1006
1006
|
relative to the body.
|
|
1007
1007
|
*/
|
|
1008
1008
|
}
|
|
1009
|
-
.awsui_tools-
|
|
1010
|
-
inset-block-start: var(--awsui-header-height-
|
|
1009
|
+
.awsui_tools-container_hyvsj_1oix2_982.awsui_disable-body-scroll_hyvsj_1oix2_208:not(#\9) {
|
|
1010
|
+
inset-block-start: var(--awsui-header-height-4hh3rt);
|
|
1011
1011
|
}
|
|
1012
1012
|
}
|
|
1013
1013
|
|
|
1014
|
-
.
|
|
1014
|
+
.awsui_tools_hyvsj_1oix2_982:not(#\9) {
|
|
1015
1015
|
background-color: var(--color-background-container-content-aemn43, #ffffff);
|
|
1016
1016
|
flex-shrink: 0;
|
|
1017
1017
|
block-size: 100%;
|
|
@@ -1034,51 +1034,51 @@ viewport size and state of the Tools drawer.
|
|
|
1034
1034
|
in the side position.
|
|
1035
1035
|
*/
|
|
1036
1036
|
}
|
|
1037
|
-
@keyframes
|
|
1037
|
+
@keyframes awsui_openTools_hyvsj_1oix2_1 {
|
|
1038
1038
|
from {
|
|
1039
|
-
opacity: var(--awsui-tools-animation-starting-opacity-
|
|
1039
|
+
opacity: var(--awsui-tools-animation-starting-opacity-4hh3rt, 0);
|
|
1040
1040
|
inline-size: calc(var(--space-layout-toggle-padding-quc8b2, 12px) * 2 + var(--space-layout-toggle-diameter-vount6, 36px));
|
|
1041
1041
|
}
|
|
1042
1042
|
to {
|
|
1043
1043
|
opacity: 1;
|
|
1044
|
-
inline-size: var(--awsui-tools-width-
|
|
1044
|
+
inline-size: var(--awsui-tools-width-4hh3rt);
|
|
1045
1045
|
}
|
|
1046
1046
|
}
|
|
1047
|
-
.
|
|
1047
|
+
.awsui_tools_hyvsj_1oix2_982:not(#\9):not(.awsui_is-tools-open_hyvsj_1oix2_641) {
|
|
1048
1048
|
inline-size: 0;
|
|
1049
1049
|
display: none;
|
|
1050
1050
|
}
|
|
1051
|
-
.
|
|
1051
|
+
.awsui_tools_hyvsj_1oix2_982.awsui_is-tools-open_hyvsj_1oix2_641:not(#\9) {
|
|
1052
1052
|
border-inline-start: solid var(--border-divider-section-width-sznrdy, 1px) var(--color-border-divider-default-ipvpev, #eaeded);
|
|
1053
1053
|
}
|
|
1054
|
-
.
|
|
1055
|
-
animation:
|
|
1054
|
+
.awsui_tools_hyvsj_1oix2_982.awsui_is-tools-open_hyvsj_1oix2_641.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
1055
|
+
animation: awsui_openTools_hyvsj_1oix2_1 var(--motion-duration-refresh-only-fast-v9rk6z, 0ms);
|
|
1056
1056
|
}
|
|
1057
1057
|
@media (prefers-reduced-motion: reduce) {
|
|
1058
|
-
.
|
|
1058
|
+
.awsui_tools_hyvsj_1oix2_982.awsui_is-tools-open_hyvsj_1oix2_641.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
1059
1059
|
animation: none;
|
|
1060
1060
|
transition: none;
|
|
1061
1061
|
}
|
|
1062
1062
|
}
|
|
1063
|
-
.awsui-motion-disabled .
|
|
1063
|
+
.awsui-motion-disabled .awsui_tools_hyvsj_1oix2_982.awsui_is-tools-open_hyvsj_1oix2_641.awsui_animating_hyvsj_1oix2_753:not(#\9), .awsui-mode-entering .awsui_tools_hyvsj_1oix2_982.awsui_is-tools-open_hyvsj_1oix2_641.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
1064
1064
|
animation: none;
|
|
1065
1065
|
transition: none;
|
|
1066
1066
|
}
|
|
1067
|
-
.
|
|
1068
|
-
inline-size: var(--awsui-tools-width-
|
|
1067
|
+
.awsui_tools_hyvsj_1oix2_982 > .awsui_animated-content_hyvsj_1oix2_817:not(#\9) {
|
|
1068
|
+
inline-size: var(--awsui-tools-width-4hh3rt);
|
|
1069
1069
|
}
|
|
1070
1070
|
@media (min-width: 689px) {
|
|
1071
|
-
.
|
|
1071
|
+
.awsui_tools_hyvsj_1oix2_982.awsui_is-tools-open_hyvsj_1oix2_641.awsui_has-tools-form-persistence_hyvsj_1oix2_1071:not(#\9) {
|
|
1072
1072
|
border-inline-end: var(--border-divider-section-width-sznrdy, 1px) solid var(--color-border-divider-default-ipvpev, #eaeded);
|
|
1073
1073
|
}
|
|
1074
1074
|
}
|
|
1075
1075
|
@media (max-width: 688px) {
|
|
1076
|
-
.
|
|
1077
|
-
--awsui-tools-width-
|
|
1076
|
+
.awsui_tools_hyvsj_1oix2_982:not(#\9) {
|
|
1077
|
+
--awsui-tools-width-4hh3rt: 100vw;
|
|
1078
1078
|
}
|
|
1079
1079
|
}
|
|
1080
1080
|
|
|
1081
|
-
.awsui_hide-
|
|
1081
|
+
.awsui_hide-tools_hyvsj_1oix2_1081:not(#\9) {
|
|
1082
1082
|
position: absolute;
|
|
1083
1083
|
inset-inline-end: var(--space-m-n2lypl, 16px);
|
|
1084
1084
|
inset-block-start: var(--size-vertical-panel-icon-offset-1tiizm, 15px);
|
|
@@ -1090,7 +1090,7 @@ Warning! If these design tokens for padding change it will adversely impact
|
|
|
1090
1090
|
the calculation used to determine the Split Panel maximum width in the
|
|
1091
1091
|
handleSplitPanelMaxWidth function in the context.
|
|
1092
1092
|
*/
|
|
1093
|
-
.awsui_show-
|
|
1093
|
+
.awsui_show-tools_hyvsj_1oix2_1093:not(#\9) {
|
|
1094
1094
|
border-collapse: separate;
|
|
1095
1095
|
border-spacing: 0;
|
|
1096
1096
|
box-sizing: border-box;
|
|
@@ -1128,7 +1128,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1128
1128
|
take control in responsive viewports.
|
|
1129
1129
|
*/
|
|
1130
1130
|
}
|
|
1131
|
-
@keyframes
|
|
1131
|
+
@keyframes awsui_showButtons_hyvsj_1oix2_1 {
|
|
1132
1132
|
0% {
|
|
1133
1133
|
opacity: 0;
|
|
1134
1134
|
}
|
|
@@ -1136,31 +1136,31 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1136
1136
|
opacity: 1;
|
|
1137
1137
|
}
|
|
1138
1138
|
}
|
|
1139
|
-
.awsui_show-
|
|
1139
|
+
.awsui_show-tools_hyvsj_1oix2_1093:not(#\9):not(.awsui_has-tools-form_hyvsj_1oix2_1071) {
|
|
1140
1140
|
display: none;
|
|
1141
1141
|
}
|
|
1142
1142
|
@media (min-width: 689px) {
|
|
1143
|
-
.awsui_show-
|
|
1143
|
+
.awsui_show-tools_hyvsj_1oix2_1093.awsui_has-tools-form_hyvsj_1oix2_1071:not(#\9) {
|
|
1144
1144
|
display: flex;
|
|
1145
1145
|
flex-direction: column;
|
|
1146
1146
|
gap: var(--space-xs-kw7k3v, 8px);
|
|
1147
1147
|
}
|
|
1148
|
-
.awsui_show-
|
|
1149
|
-
animation:
|
|
1148
|
+
.awsui_show-tools_hyvsj_1oix2_1093.awsui_has-tools-form_hyvsj_1oix2_1071.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
1149
|
+
animation: awsui_showButtons_hyvsj_1oix2_1 var(--motion-duration-refresh-only-fast-v9rk6z, 0ms);
|
|
1150
1150
|
}
|
|
1151
1151
|
}
|
|
1152
1152
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
1153
|
-
.awsui_show-
|
|
1153
|
+
.awsui_show-tools_hyvsj_1oix2_1093.awsui_has-tools-form_hyvsj_1oix2_1071.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
1154
1154
|
animation: none;
|
|
1155
1155
|
transition: none;
|
|
1156
1156
|
}
|
|
1157
1157
|
}
|
|
1158
1158
|
@media (min-width: 689px) {
|
|
1159
|
-
.awsui-motion-disabled .awsui_show-
|
|
1159
|
+
.awsui-motion-disabled .awsui_show-tools_hyvsj_1oix2_1093.awsui_has-tools-form_hyvsj_1oix2_1071.awsui_animating_hyvsj_1oix2_753:not(#\9), .awsui-mode-entering .awsui_show-tools_hyvsj_1oix2_1093.awsui_has-tools-form_hyvsj_1oix2_1071.awsui_animating_hyvsj_1oix2_753:not(#\9) {
|
|
1160
1160
|
animation: none;
|
|
1161
1161
|
transition: none;
|
|
1162
1162
|
}
|
|
1163
|
-
.awsui_show-
|
|
1163
|
+
.awsui_show-tools_hyvsj_1oix2_1093.awsui_has-tools-form-persistence_hyvsj_1oix2_1071:not(#\9) {
|
|
1164
1164
|
background-color: var(--color-background-container-content-aemn43, #ffffff);
|
|
1165
1165
|
z-index: 1;
|
|
1166
1166
|
}
|
|
@@ -1170,7 +1170,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1170
1170
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
1171
1171
|
SPDX-License-Identifier: Apache-2.0
|
|
1172
1172
|
*/
|
|
1173
|
-
.awsui_trigger-button-
|
|
1173
|
+
.awsui_trigger-button-styles_hyvsj_1oix2_1173:not(#\9) {
|
|
1174
1174
|
background: var(--color-background-layout-toggle-default-q2nv0b, transparent);
|
|
1175
1175
|
border-start-start-radius: 50%;
|
|
1176
1176
|
border-start-end-radius: 50%;
|
|
@@ -1179,14 +1179,14 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1179
1179
|
block-size: var(--space-layout-toggle-diameter-vount6, 36px);
|
|
1180
1180
|
inline-size: var(--space-layout-toggle-diameter-vount6, 36px);
|
|
1181
1181
|
}
|
|
1182
|
-
.awsui_trigger-button-
|
|
1182
|
+
.awsui_trigger-button-styles_hyvsj_1oix2_1173:not(#\9):hover {
|
|
1183
1183
|
background: var(--color-background-layout-toggle-hover-t77zty, #545b64);
|
|
1184
1184
|
}
|
|
1185
|
-
.awsui_trigger-button-
|
|
1185
|
+
.awsui_trigger-button-styles_hyvsj_1oix2_1173:not(#\9):active {
|
|
1186
1186
|
background: var(--color-background-layout-toggle-active-ovmpb9, #2a2e33);
|
|
1187
1187
|
}
|
|
1188
1188
|
|
|
1189
|
-
.awsui_trigger-badge-
|
|
1189
|
+
.awsui_trigger-badge-wrapper_hyvsj_1oix2_1189:not(#\9) {
|
|
1190
1190
|
position: absolute;
|
|
1191
1191
|
inset-block-start: 0;
|
|
1192
1192
|
inset-inline-start: 0;
|
|
@@ -1196,7 +1196,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1196
1196
|
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");
|
|
1197
1197
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
1198
1198
|
}
|
|
1199
|
-
.awsui_trigger-badge-
|
|
1199
|
+
.awsui_trigger-badge-wrapper_hyvsj_1oix2_1189:not(#\9):dir(rtl) {
|
|
1200
1200
|
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");
|
|
1201
1201
|
}
|
|
1202
1202
|
|
|
@@ -1205,7 +1205,7 @@ Warning! If these design tokens for width change it will adversely impact
|
|
|
1205
1205
|
the calculation used to determine the Split Panel maximum width in the
|
|
1206
1206
|
handleSplitPanelMaxWidth function in the context.
|
|
1207
1207
|
*/
|
|
1208
|
-
.
|
|
1208
|
+
.awsui_trigger_hyvsj_1oix2_1173:not(#\9) {
|
|
1209
1209
|
border-block: none;
|
|
1210
1210
|
border-inline: none;
|
|
1211
1211
|
padding-inline: 0;
|
|
@@ -1214,14 +1214,14 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1214
1214
|
pointer-events: auto;
|
|
1215
1215
|
position: relative;
|
|
1216
1216
|
}
|
|
1217
|
-
body[data-awsui-focus-visible=true] .
|
|
1217
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1oix2_1173:not(#\9):focus {
|
|
1218
1218
|
position: relative;
|
|
1219
1219
|
}
|
|
1220
|
-
body[data-awsui-focus-visible=true] .
|
|
1220
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1oix2_1173:not(#\9):focus {
|
|
1221
1221
|
outline: 2px dotted transparent;
|
|
1222
1222
|
outline-offset: calc(3px - 1px);
|
|
1223
1223
|
}
|
|
1224
|
-
body[data-awsui-focus-visible=true] .
|
|
1224
|
+
body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1oix2_1173:not(#\9):focus::before {
|
|
1225
1225
|
content: " ";
|
|
1226
1226
|
display: block;
|
|
1227
1227
|
position: absolute;
|
|
@@ -1235,49 +1235,49 @@ body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1f2m7_1173:not(#\9):foc
|
|
|
1235
1235
|
border-end-end-radius: var(--border-radius-control-default-focus-ring-9xsko1, 2px);
|
|
1236
1236
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-r5f6xl, #0073bb);
|
|
1237
1237
|
}
|
|
1238
|
-
.
|
|
1238
|
+
.awsui_trigger_hyvsj_1oix2_1173:not(#\9):focus {
|
|
1239
1239
|
outline: none;
|
|
1240
1240
|
}
|
|
1241
|
-
.
|
|
1241
|
+
.awsui_trigger_hyvsj_1oix2_1173.awsui_selected_hyvsj_1oix2_1241:not(#\9) {
|
|
1242
1242
|
background: var(--color-background-layout-toggle-selected-default-o4my1h, #0073bb);
|
|
1243
1243
|
color: var(--color-text-layout-toggle-selected-ofhd1q, #ffffff);
|
|
1244
1244
|
}
|
|
1245
|
-
.
|
|
1245
|
+
.awsui_trigger_hyvsj_1oix2_1173.awsui_selected_hyvsj_1oix2_1241:not(#\9):hover {
|
|
1246
1246
|
background: var(--color-background-layout-toggle-selected-hover-yuaxel, #0a4a74);
|
|
1247
1247
|
}
|
|
1248
|
-
.
|
|
1248
|
+
.awsui_trigger_hyvsj_1oix2_1173.awsui_selected_hyvsj_1oix2_1241:not(#\9):active {
|
|
1249
1249
|
background: var(--color-background-layout-toggle-selected-active-wfv72o, #0073bb);
|
|
1250
1250
|
}
|
|
1251
|
-
.
|
|
1251
|
+
.awsui_trigger_hyvsj_1oix2_1173.awsui_selected_hyvsj_1oix2_1241 > .awsui_trigger-badge-wrapper_hyvsj_1oix2_1189:not(#\9) {
|
|
1252
1252
|
background: var(--color-background-layout-toggle-selected-default-o4my1h, #0073bb);
|
|
1253
1253
|
color: var(--color-text-layout-toggle-selected-ofhd1q, #ffffff);
|
|
1254
1254
|
}
|
|
1255
|
-
.
|
|
1255
|
+
.awsui_trigger_hyvsj_1oix2_1173.awsui_selected_hyvsj_1oix2_1241 > .awsui_trigger-badge-wrapper_hyvsj_1oix2_1189:not(#\9):hover {
|
|
1256
1256
|
background: var(--color-background-layout-toggle-selected-hover-yuaxel, #0a4a74);
|
|
1257
1257
|
}
|
|
1258
|
-
.
|
|
1258
|
+
.awsui_trigger_hyvsj_1oix2_1173.awsui_selected_hyvsj_1oix2_1241 > .awsui_trigger-badge-wrapper_hyvsj_1oix2_1189:not(#\9):active {
|
|
1259
1259
|
background: var(--color-background-layout-toggle-selected-active-wfv72o, #0073bb);
|
|
1260
1260
|
}
|
|
1261
|
-
.
|
|
1261
|
+
.awsui_trigger_hyvsj_1oix2_1173.awsui_badge_hyvsj_1oix2_1261:not(#\9), .awsui_trigger_hyvsj_1oix2_1173.awsui_badge_hyvsj_1oix2_1261:not(#\9):hover, .awsui_trigger_hyvsj_1oix2_1173.awsui_badge_hyvsj_1oix2_1261:not(#\9):active {
|
|
1262
1262
|
background: transparent;
|
|
1263
1263
|
}
|
|
1264
1264
|
|
|
1265
|
-
.awsui_trigger-
|
|
1265
|
+
.awsui_trigger-wrapper_hyvsj_1oix2_1265:not(#\9) {
|
|
1266
1266
|
position: relative;
|
|
1267
1267
|
border-start-start-radius: 50%;
|
|
1268
1268
|
border-start-end-radius: 50%;
|
|
1269
1269
|
border-end-start-radius: 50%;
|
|
1270
1270
|
border-end-end-radius: 50%;
|
|
1271
1271
|
}
|
|
1272
|
-
.awsui_trigger-
|
|
1272
|
+
.awsui_trigger-wrapper_hyvsj_1oix2_1265:not(#\9):not(.awsui_remove-high-contrast-header_hyvsj_1oix2_671) {
|
|
1273
1273
|
box-shadow: var(--shadow-panel-toggle-rswlot, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
|
|
1274
1274
|
}
|
|
1275
1275
|
|
|
1276
|
-
.awsui_trigger-wrapper-tooltip-
|
|
1276
|
+
.awsui_trigger-wrapper-tooltip-visible_hyvsj_1oix2_1276:not(#\9) {
|
|
1277
1277
|
/* used in test-utils*/
|
|
1278
1278
|
}
|
|
1279
1279
|
|
|
1280
|
-
.
|
|
1280
|
+
.awsui_dot_hyvsj_1oix2_1280:not(#\9) {
|
|
1281
1281
|
position: absolute;
|
|
1282
1282
|
inline-size: 9px;
|
|
1283
1283
|
block-size: 9px;
|
|
@@ -1290,6 +1290,6 @@ body[data-awsui-focus-visible=true] .awsui_trigger_hyvsj_1f2m7_1173:not(#\9):foc
|
|
|
1290
1290
|
inset-inline-end: 0;
|
|
1291
1291
|
}
|
|
1292
1292
|
|
|
1293
|
-
.awsui_trigger-
|
|
1293
|
+
.awsui_trigger-tooltip_hyvsj_1oix2_1293:not(#\9) {
|
|
1294
1294
|
/* used in test-utils */
|
|
1295
1295
|
}
|