@cloudscape-design/components 3.0.127 → 3.0.128
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/annotation-popover.d.ts.map +1 -1
- package/annotation-context/annotation/annotation-popover.js +2 -8
- package/annotation-context/annotation/annotation-popover.js.map +1 -1
- package/annotation-context/annotation/annotation-trigger.d.ts +0 -2
- package/annotation-context/annotation/annotation-trigger.d.ts.map +1 -1
- package/annotation-context/annotation/annotation-trigger.js +2 -2
- package/annotation-context/annotation/annotation-trigger.js.map +1 -1
- package/annotation-context/annotation/closed-annotation.d.ts +1 -3
- package/annotation-context/annotation/closed-annotation.d.ts.map +1 -1
- package/annotation-context/annotation/closed-annotation.js +2 -2
- package/annotation-context/annotation/closed-annotation.js.map +1 -1
- package/annotation-context/annotation/open-annotation.d.ts.map +1 -1
- package/annotation-context/annotation/open-annotation.js +1 -1
- package/annotation-context/annotation/open-annotation.js.map +1 -1
- 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/annotation-context/index.d.ts.map +1 -1
- package/annotation-context/index.js +1 -3
- package/annotation-context/index.js.map +1 -1
- package/annotation-context/interfaces.d.ts +1 -1
- package/annotation-context/interfaces.d.ts.map +1 -1
- package/annotation-context/interfaces.js.map +1 -1
- package/app-layout/visual-refresh/main.d.ts.map +1 -1
- package/app-layout/visual-refresh/main.js +3 -8
- package/app-layout/visual-refresh/main.js.map +1 -1
- package/app-layout/visual-refresh/styles.css.js +60 -60
- package/app-layout/visual-refresh/styles.scoped.css +237 -255
- package/app-layout/visual-refresh/styles.selectors.js +60 -60
- package/area-chart/internal.d.ts.map +1 -1
- package/area-chart/internal.js +0 -5
- package/area-chart/internal.js.map +1 -1
- package/area-chart/model/index.d.ts +0 -1
- package/area-chart/model/index.d.ts.map +1 -1
- package/area-chart/model/index.js.map +1 -1
- package/area-chart/model/use-chart-model.d.ts.map +1 -1
- package/area-chart/model/use-chart-model.js +1 -8
- package/area-chart/model/use-chart-model.js.map +1 -1
- package/attribute-editor/row.d.ts.map +1 -1
- package/attribute-editor/row.js +3 -4
- package/attribute-editor/row.js.map +1 -1
- package/attribute-editor/styles.css.js +12 -13
- package/attribute-editor/styles.scoped.css +23 -27
- package/attribute-editor/styles.selectors.js +12 -13
- package/breadcrumb-group/interfaces.d.ts +0 -1
- package/breadcrumb-group/interfaces.d.ts.map +1 -1
- package/breadcrumb-group/interfaces.js.map +1 -1
- package/breadcrumb-group/internal.d.ts.map +1 -1
- package/breadcrumb-group/internal.js +1 -1
- package/breadcrumb-group/internal.js.map +1 -1
- package/breadcrumb-group/item/item.d.ts +1 -1
- package/breadcrumb-group/item/item.d.ts.map +1 -1
- package/breadcrumb-group/item/item.js +8 -68
- package/breadcrumb-group/item/item.js.map +1 -1
- package/breadcrumb-group/item/styles.css.js +7 -9
- package/breadcrumb-group/item/styles.scoped.css +16 -26
- package/breadcrumb-group/item/styles.selectors.js +7 -9
- package/code-editor/index.d.ts.map +1 -1
- package/code-editor/index.js +16 -11
- package/code-editor/index.js.map +1 -1
- package/code-editor/interfaces.d.ts +1 -12
- package/code-editor/interfaces.d.ts.map +1 -1
- package/code-editor/interfaces.js.map +1 -1
- package/code-editor/status-bar.d.ts.map +1 -1
- package/code-editor/status-bar.js +1 -7
- package/code-editor/status-bar.js.map +1 -1
- package/code-editor/util.js +1 -1
- package/code-editor/util.js.map +1 -1
- package/container/internal.d.ts.map +1 -1
- package/container/internal.js +4 -7
- package/container/internal.js.map +1 -1
- package/date-range-picker/calendar/grids/index.d.ts +1 -0
- package/date-range-picker/calendar/grids/index.d.ts.map +1 -1
- package/date-range-picker/calendar/grids/index.js +14 -2
- package/date-range-picker/calendar/grids/index.js.map +1 -1
- package/date-range-picker/calendar/index.d.ts +4 -6
- package/date-range-picker/calendar/index.d.ts.map +1 -1
- package/date-range-picker/calendar/index.js +123 -111
- package/date-range-picker/calendar/index.js.map +1 -1
- package/date-range-picker/calendar/use-date-time.d.ts +9 -0
- package/date-range-picker/calendar/use-date-time.d.ts.map +1 -0
- package/date-range-picker/calendar/use-date-time.js +16 -0
- package/date-range-picker/calendar/use-date-time.js.map +1 -0
- package/date-range-picker/dropdown.d.ts +1 -2
- package/date-range-picker/dropdown.d.ts.map +1 -1
- package/date-range-picker/dropdown.js +6 -8
- package/date-range-picker/dropdown.js.map +1 -1
- package/date-range-picker/index.d.ts.map +1 -1
- package/date-range-picker/index.js +2 -2
- package/date-range-picker/index.js.map +1 -1
- package/date-range-picker/interfaces.d.ts +4 -14
- package/date-range-picker/interfaces.d.ts.map +1 -1
- package/date-range-picker/interfaces.js.map +1 -1
- package/date-range-picker/styles.css.js +38 -38
- package/date-range-picker/styles.scoped.css +50 -45
- package/date-range-picker/styles.selectors.js +38 -38
- package/date-range-picker/utils.d.ts +8 -2
- package/date-range-picker/utils.d.ts.map +1 -1
- package/date-range-picker/utils.js +12 -17
- package/date-range-picker/utils.js.map +1 -1
- package/flashbar/styles.css.js +33 -33
- package/flashbar/styles.scoped.css +121 -121
- package/flashbar/styles.selectors.js +33 -33
- package/internal/components/dropdown/index.d.ts.map +1 -1
- package/internal/components/dropdown/index.js +9 -2
- package/internal/components/dropdown/index.js.map +1 -1
- package/internal/components/dropdown-status/index.d.ts +4 -1
- package/internal/components/dropdown-status/index.d.ts.map +1 -1
- package/internal/components/dropdown-status/index.js +5 -3
- package/internal/components/dropdown-status/index.js.map +1 -1
- package/internal/components/filtering-token/index.d.ts +1 -2
- package/internal/components/filtering-token/index.d.ts.map +1 -1
- package/internal/components/filtering-token/index.js +2 -2
- package/internal/components/filtering-token/index.js.map +1 -1
- package/internal/components/option/index.js +4 -4
- package/internal/components/option/index.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/generated/custom-css-properties/index.d.ts.map +1 -1
- package/internal/generated/custom-css-properties/index.js +26 -27
- package/internal/generated/custom-css-properties/index.js.map +1 -1
- package/internal/manifest.json +1 -1
- package/internal/utils/date-time/index.d.ts +1 -2
- package/internal/utils/date-time/index.d.ts.map +1 -1
- package/internal/utils/date-time/index.js +1 -2
- package/internal/utils/date-time/index.js.map +1 -1
- package/internal/utils/date-time/join-date-time.d.ts +0 -4
- package/internal/utils/date-time/join-date-time.d.ts.map +1 -1
- package/internal/utils/date-time/join-date-time.js +0 -4
- package/internal/utils/date-time/join-date-time.js.map +1 -1
- package/mixed-line-bar-chart/chart-container.d.ts.map +1 -1
- package/mixed-line-bar-chart/chart-container.js +5 -14
- package/mixed-line-bar-chart/chart-container.js.map +1 -1
- package/package.json +1 -1
- package/pie-chart/pie-chart.d.ts.map +1 -1
- package/pie-chart/pie-chart.js +1 -10
- package/pie-chart/pie-chart.js.map +1 -1
- package/popover/body.d.ts +1 -2
- package/popover/body.d.ts.map +1 -1
- package/popover/body.js +2 -2
- package/popover/body.js.map +1 -1
- package/property-filter/interfaces.d.ts +0 -1
- package/property-filter/interfaces.d.ts.map +1 -1
- package/property-filter/interfaces.js.map +1 -1
- package/property-filter/token.d.ts.map +1 -1
- package/property-filter/token.js +1 -1
- package/property-filter/token.js.map +1 -1
- package/select/parts/filter.d.ts +1 -1
- package/select/utils/use-select.d.ts +7 -1
- package/select/utils/use-select.d.ts.map +1 -1
- package/select/utils/use-select.js +1 -1
- package/select/utils/use-select.js.map +1 -1
- package/table/styles.css.js +34 -34
- package/table/styles.scoped.css +40 -42
- package/table/styles.selectors.js +34 -34
- package/tabs/index.d.ts.map +1 -1
- package/tabs/index.js +11 -9
- package/tabs/index.js.map +1 -1
- package/tabs/styles.css.js +21 -21
- package/tabs/styles.scoped.css +41 -48
- package/tabs/styles.selectors.js +21 -21
- package/tabs/tab-header-bar.d.ts +0 -4
- package/tabs/tab-header-bar.d.ts.map +1 -1
- package/tabs/tab-header-bar.js +1 -5
- package/tabs/tab-header-bar.js.map +1 -1
- package/tag-editor/internal.d.ts.map +1 -1
- package/tag-editor/internal.js +7 -6
- package/tag-editor/internal.js.map +1 -1
- package/test-utils/tsconfig.tsbuildinfo +1 -1
- package/tutorial-panel/components/tutorial-detail-view/index.d.ts.map +1 -1
- package/tutorial-panel/components/tutorial-detail-view/index.js +1 -3
- package/tutorial-panel/components/tutorial-detail-view/index.js.map +1 -1
- package/tutorial-panel/components/tutorial-detail-view/task.d.ts.map +1 -1
- package/tutorial-panel/components/tutorial-detail-view/task.js +1 -2
- package/tutorial-panel/components/tutorial-detail-view/task.js.map +1 -1
- package/tutorial-panel/components/tutorial-list/index.d.ts.map +1 -1
- package/tutorial-panel/components/tutorial-list/index.js +2 -2
- package/tutorial-panel/components/tutorial-list/index.js.map +1 -1
- package/tutorial-panel/interfaces.d.ts +0 -2
- package/tutorial-panel/interfaces.d.ts.map +1 -1
- package/tutorial-panel/interfaces.js.map +1 -1
- package/wizard/index.d.ts.map +1 -1
- package/wizard/index.js +5 -9
- package/wizard/index.js.map +1 -1
- package/wizard/wizard-form.d.ts.map +1 -1
- package/wizard/wizard-form.js +2 -7
- package/wizard/wizard-form.js.map +1 -1
- package/date-range-picker/calendar/utils.d.ts +0 -4
- package/date-range-picker/calendar/utils.d.ts.map +0 -1
- package/date-range-picker/calendar/utils.js +0 -31
- package/date-range-picker/calendar/utils.js.map +0 -1
- package/internal/hooks/use-analytics/index.d.ts +0 -2
- package/internal/hooks/use-analytics/index.d.ts.map +0 -1
- package/internal/hooks/use-analytics/index.js +0 -16
- package/internal/hooks/use-analytics/index.js.map +0 -1
- package/internal/utils/date-time/format-date-time.d.ts +0 -2
- package/internal/utils/date-time/format-date-time.d.ts.map +0 -1
- package/internal/utils/date-time/format-date-time.js +0 -8
- package/internal/utils/date-time/format-date-time.js.map +0 -1
|
@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
90
90
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
91
91
|
SPDX-License-Identifier: Apache-2.0
|
|
92
92
|
*/
|
|
93
|
-
section.
|
|
93
|
+
section.awsui_appbar_hyvsj_8eynx_93:not(#\9) {
|
|
94
94
|
align-items: center;
|
|
95
95
|
box-sizing: border-box;
|
|
96
96
|
display: grid;
|
|
@@ -114,20 +114,20 @@ section.awsui_appbar_hyvsj_1sfal_93:not(#\9) {
|
|
|
114
114
|
span the entire column definition of the Layout grid.
|
|
115
115
|
*/
|
|
116
116
|
}
|
|
117
|
-
section.
|
|
117
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-nav_hyvsj_8eynx_117:not(#\9) {
|
|
118
118
|
grid-column: 1;
|
|
119
119
|
margin-right: var(--space-m-17eucw, 16px);
|
|
120
120
|
}
|
|
121
|
-
section.
|
|
121
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9) {
|
|
122
122
|
grid-column: 2;
|
|
123
123
|
background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
|
|
124
124
|
}
|
|
125
|
-
section.
|
|
125
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-tools_hyvsj_8eynx_125:not(#\9) {
|
|
126
126
|
grid-column: 3;
|
|
127
127
|
margin-left: var(--space-m-17eucw, 16px);
|
|
128
128
|
}
|
|
129
129
|
@media (min-width: 689px) {
|
|
130
|
-
section.
|
|
130
|
+
section.awsui_appbar_hyvsj_8eynx_93:not(#\9) {
|
|
131
131
|
/*
|
|
132
132
|
If Breadcrumbs do not exist then the AppBar should be suppressed
|
|
133
133
|
because in large viewports the triggers are rendered
|
|
@@ -163,33 +163,33 @@ section.awsui_appbar_hyvsj_1sfal_93 > .awsui_appbar-tools_hyvsj_1sfal_125:not(#\
|
|
|
163
163
|
be lifted so it doesn't render behind the background element.
|
|
164
164
|
*/
|
|
165
165
|
}
|
|
166
|
-
section.
|
|
166
|
+
section.awsui_appbar_hyvsj_8eynx_93:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166) {
|
|
167
167
|
display: none;
|
|
168
168
|
}
|
|
169
|
-
section.
|
|
170
|
-
section.
|
|
169
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-nav_hyvsj_8eynx_117:not(#\9),
|
|
170
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-tools_hyvsj_8eynx_125:not(#\9) {
|
|
171
171
|
display: none;
|
|
172
172
|
}
|
|
173
|
-
section.
|
|
173
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173) {
|
|
174
174
|
padding-top: var(--space-scaled-m-pv0fmt, 16px);
|
|
175
175
|
}
|
|
176
|
-
section.
|
|
176
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_has-notifications-content_hyvsj_8eynx_173:not(#\9) {
|
|
177
177
|
padding-top: var(--space-scaled-2x-s-9svxjy, 12px);
|
|
178
178
|
}
|
|
179
|
-
section.
|
|
180
|
-
section.
|
|
179
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179),
|
|
180
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9):not(.awsui_has-header_hyvsj_8eynx_179).awsui_content-type-wizard_hyvsj_8eynx_180 {
|
|
181
181
|
padding-bottom: var(--space-m-17eucw, 16px);
|
|
182
182
|
}
|
|
183
|
-
section.
|
|
184
|
-
section.
|
|
183
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_content-type-cards_hyvsj_8eynx_183:not(#\9),
|
|
184
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_content-type-table_hyvsj_8eynx_184:not(#\9) {
|
|
185
185
|
padding-bottom: var(--space-xxs-ynfts5, 4px);
|
|
186
186
|
}
|
|
187
|
-
section.
|
|
187
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_has-sticky-background_hyvsj_8eynx_187:not(#\9) {
|
|
188
188
|
z-index: 799;
|
|
189
189
|
}
|
|
190
190
|
}
|
|
191
191
|
@media (max-width: 688px) {
|
|
192
|
-
section.
|
|
192
|
+
section.awsui_appbar_hyvsj_8eynx_93:not(#\9) {
|
|
193
193
|
background-color: var(--color-background-home-header-mpq08f, #000716);
|
|
194
194
|
border-bottom: 1px solid var(--color-border-divider-default-7s2wjw, #e9ebed);
|
|
195
195
|
box-shadow: var(--shadow-panel-toggle-3fk0ch, 0px 6px 12px 1px rgba(0, 7, 22, 0.12));
|
|
@@ -198,18 +198,18 @@ section.awsui_appbar_hyvsj_1sfal_93 > .awsui_breadcrumbs_hyvsj_1sfal_121.awsui_c
|
|
|
198
198
|
height: calc(2 * var(--space-m-17eucw, 16px) + var(--space-scaled-xs-6859qs, 8px));
|
|
199
199
|
padding: 0 var(--space-m-17eucw, 16px);
|
|
200
200
|
position: sticky;
|
|
201
|
-
top: var(--awsui-offset-top-
|
|
201
|
+
top: var(--awsui-offset-top-f9jj7p);
|
|
202
202
|
z-index: 1000;
|
|
203
203
|
/*
|
|
204
204
|
Remove any existing top and bottom padding from the Breadcrumbs since
|
|
205
205
|
they are now sticky positioned in the viewport with the AppBar.
|
|
206
206
|
*/
|
|
207
207
|
}
|
|
208
|
-
section.
|
|
209
|
-
section.
|
|
208
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-nav_hyvsj_8eynx_117:not(#\9),
|
|
209
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-tools_hyvsj_8eynx_125:not(#\9) {
|
|
210
210
|
display: block;
|
|
211
211
|
}
|
|
212
|
-
section.
|
|
212
|
+
section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9) {
|
|
213
213
|
padding: 0;
|
|
214
214
|
}
|
|
215
215
|
}
|
|
@@ -218,10 +218,10 @@ section.awsui_appbar_hyvsj_1sfal_93 > .awsui_appbar-tools_hyvsj_1sfal_125:not(#\
|
|
|
218
218
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
219
219
|
SPDX-License-Identifier: Apache-2.0
|
|
220
220
|
*/
|
|
221
|
-
div.
|
|
221
|
+
div.awsui_background_hyvsj_8eynx_221:not(#\9) {
|
|
222
222
|
display: contents;
|
|
223
223
|
}
|
|
224
|
-
div.
|
|
224
|
+
div.awsui_background_hyvsj_8eynx_221 > .awsui_notifications-appbar-header_hyvsj_8eynx_224:not(#\9) {
|
|
225
225
|
background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
|
|
226
226
|
grid-column: 1/span 5;
|
|
227
227
|
grid-row: 1/span 3;
|
|
@@ -233,13 +233,13 @@ div.awsui_background_hyvsj_1sfal_221 > .awsui_notifications-appbar-header_hyvsj_
|
|
|
233
233
|
*/
|
|
234
234
|
}
|
|
235
235
|
@media (min-width: 689px) {
|
|
236
|
-
div.
|
|
236
|
+
div.awsui_background_hyvsj_8eynx_221 > .awsui_notifications-appbar-header_hyvsj_8eynx_224.awsui_has-sticky-background_hyvsj_8eynx_187.awsui_has-notifications-content_hyvsj_8eynx_173.awsui_sticky-notifications_hyvsj_8eynx_236:not(#\9) {
|
|
237
237
|
position: sticky;
|
|
238
|
-
top: var(--awsui-offset-top-
|
|
238
|
+
top: var(--awsui-offset-top-f9jj7p);
|
|
239
239
|
z-index: 799;
|
|
240
240
|
}
|
|
241
241
|
}
|
|
242
|
-
div.
|
|
242
|
+
div.awsui_background_hyvsj_8eynx_221 > .awsui_overlap_hyvsj_8eynx_242:not(#\9) {
|
|
243
243
|
background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
|
|
244
244
|
grid-column: 1/span 5;
|
|
245
245
|
grid-row: 4;
|
|
@@ -251,9 +251,9 @@ div.awsui_background_hyvsj_1sfal_221 > .awsui_overlap_hyvsj_1sfal_242:not(#\9) {
|
|
|
251
251
|
*/
|
|
252
252
|
}
|
|
253
253
|
@media (min-width: 689px) {
|
|
254
|
-
div.
|
|
254
|
+
div.awsui_background_hyvsj_8eynx_221 > .awsui_overlap_hyvsj_8eynx_242.awsui_has-sticky-background_hyvsj_8eynx_187:not(#\9) {
|
|
255
255
|
position: sticky;
|
|
256
|
-
top: var(--awsui-offset-top-with-notifications-
|
|
256
|
+
top: var(--awsui-offset-top-with-notifications-f9jj7p);
|
|
257
257
|
z-index: 799;
|
|
258
258
|
}
|
|
259
259
|
}
|
|
@@ -262,13 +262,13 @@ div.awsui_background_hyvsj_1sfal_221 > .awsui_overlap_hyvsj_1sfal_242:not(#\9) {
|
|
|
262
262
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
263
263
|
SPDX-License-Identifier: Apache-2.0
|
|
264
264
|
*/
|
|
265
|
-
header.
|
|
265
|
+
header.awsui_content_hyvsj_8eynx_180:not(#\9) {
|
|
266
266
|
grid-column: 3;
|
|
267
267
|
grid-row: 3;
|
|
268
268
|
padding-bottom: var(--space-content-header-padding-bottom-nvqytg, 24px);
|
|
269
269
|
}
|
|
270
270
|
@media (min-width: 689px) {
|
|
271
|
-
header.
|
|
271
|
+
header.awsui_content_hyvsj_8eynx_180:not(#\9) {
|
|
272
272
|
/*
|
|
273
273
|
If Notifications exist and Breadcrumbs do not then Notifications
|
|
274
274
|
is the previous adjacent sibling to the Header. Add minimal top padding
|
|
@@ -286,25 +286,25 @@ header.awsui_content_hyvsj_1sfal_180:not(#\9) {
|
|
|
286
286
|
circular buttons.
|
|
287
287
|
*/
|
|
288
288
|
}
|
|
289
|
-
header.
|
|
289
|
+
header.awsui_content_hyvsj_8eynx_180.awsui_has-notifications-content_hyvsj_8eynx_173:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166) {
|
|
290
290
|
padding-top: var(--space-scaled-xs-6859qs, 8px);
|
|
291
291
|
}
|
|
292
|
-
header.
|
|
292
|
+
header.awsui_content_hyvsj_8eynx_180.awsui_has-breadcrumbs_hyvsj_8eynx_166:not(#\9) {
|
|
293
293
|
padding-top: var(--space-xxs-ynfts5, 4px);
|
|
294
294
|
}
|
|
295
|
-
header.
|
|
295
|
+
header.awsui_content_hyvsj_8eynx_180:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166) {
|
|
296
296
|
padding-top: var(--space-scaled-xs-6859qs, 8px);
|
|
297
297
|
}
|
|
298
298
|
}
|
|
299
299
|
@media (max-width: 688px) {
|
|
300
|
-
header.
|
|
300
|
+
header.awsui_content_hyvsj_8eynx_180:not(#\9) {
|
|
301
301
|
padding: var(--space-m-17eucw, 16px) 0 var(--space-content-header-padding-bottom-nvqytg, 24px);
|
|
302
302
|
/*
|
|
303
303
|
Breadcrumbs has moved to first position and sticky so Notifications
|
|
304
304
|
are now the previous adjacent sibling if they exist.
|
|
305
305
|
*/
|
|
306
306
|
}
|
|
307
|
-
header.
|
|
307
|
+
header.awsui_content_hyvsj_8eynx_180.awsui_has-notifications-content_hyvsj_8eynx_173:not(#\9) {
|
|
308
308
|
padding-top: var(--space-scaled-xs-6859qs, 8px);
|
|
309
309
|
}
|
|
310
310
|
}
|
|
@@ -326,26 +326,26 @@ header.awsui_content_hyvsj_1sfal_180:not(#\9) {
|
|
|
326
326
|
circumstances regardless of whether the minContentWidth property is
|
|
327
327
|
explicitly set in script.
|
|
328
328
|
*/
|
|
329
|
-
.
|
|
330
|
-
--awsui-content-gap-left-
|
|
331
|
-
--awsui-content-gap-right-
|
|
332
|
-
--awsui-content-height-
|
|
333
|
-
--awsui-default-max-content-width-
|
|
334
|
-
--awsui-default-min-content-width-
|
|
335
|
-
--awsui-footer-height-
|
|
336
|
-
--awsui-header-height-
|
|
337
|
-
--awsui-layout-width-
|
|
338
|
-
--awsui-main-offset-left-
|
|
339
|
-
--awsui-max-content-width-
|
|
340
|
-
--awsui-min-content-width-
|
|
341
|
-
--awsui-notifications-height-
|
|
342
|
-
--awsui-offset-top-
|
|
343
|
-
--awsui-offset-top-with-notifications-
|
|
344
|
-
--awsui-overlap-height-
|
|
329
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9) {
|
|
330
|
+
--awsui-content-gap-left-f9jj7p: 0px;
|
|
331
|
+
--awsui-content-gap-right-f9jj7p: 0px;
|
|
332
|
+
--awsui-content-height-f9jj7p: calc(100vh - var(--awsui-header-height-f9jj7p) - var(--awsui-footer-height-f9jj7p));
|
|
333
|
+
--awsui-default-max-content-width-f9jj7p: 1280px;
|
|
334
|
+
--awsui-default-min-content-width-f9jj7p: 0px;
|
|
335
|
+
--awsui-footer-height-f9jj7p: 0px;
|
|
336
|
+
--awsui-header-height-f9jj7p: 0px;
|
|
337
|
+
--awsui-layout-width-f9jj7p: 0px;
|
|
338
|
+
--awsui-main-offset-left-f9jj7p: 0px;
|
|
339
|
+
--awsui-max-content-width-f9jj7p: 0px;
|
|
340
|
+
--awsui-min-content-width-f9jj7p: 280px;
|
|
341
|
+
--awsui-notifications-height-f9jj7p: 0px;
|
|
342
|
+
--awsui-offset-top-f9jj7p: 0px;
|
|
343
|
+
--awsui-offset-top-with-notifications-f9jj7p: 0px;
|
|
344
|
+
--awsui-overlap-height-f9jj7p: var(--space-dark-header-overlap-distance-hfejul, 36px);
|
|
345
345
|
background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
|
|
346
346
|
display: grid;
|
|
347
|
-
grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-
|
|
348
|
-
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-
|
|
347
|
+
grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-f9jj7p) 1fr;
|
|
348
|
+
grid-template-columns: min-content minmax(var(--awsui-content-gap-left-f9jj7p), 1fr) minmax(var(--awsui-default-min-content-width-f9jj7p), var(--awsui-default-max-content-width-f9jj7p)) minmax(var(--awsui-content-gap-right-f9jj7p), 1fr) min-content;
|
|
349
349
|
position: relative;
|
|
350
350
|
/*
|
|
351
351
|
Only use the max content width custom property for the middle column definition
|
|
@@ -408,77 +408,77 @@ header.awsui_content_hyvsj_1sfal_180:not(#\9) {
|
|
|
408
408
|
*/
|
|
409
409
|
}
|
|
410
410
|
@media (min-width: 1401px) {
|
|
411
|
-
.
|
|
412
|
-
--awsui-default-max-content-width-
|
|
411
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_has-max-content-width_hyvsj_8eynx_411) {
|
|
412
|
+
--awsui-default-max-content-width-f9jj7p: 1280px;
|
|
413
413
|
}
|
|
414
414
|
}
|
|
415
415
|
@media (min-width: 1921px) {
|
|
416
|
-
.
|
|
417
|
-
--awsui-default-max-content-width-
|
|
416
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_has-max-content-width_hyvsj_8eynx_411) {
|
|
417
|
+
--awsui-default-max-content-width-f9jj7p: 1440px;
|
|
418
418
|
}
|
|
419
419
|
}
|
|
420
420
|
@media (min-width: 2541px) {
|
|
421
|
-
.
|
|
422
|
-
--awsui-default-max-content-width-
|
|
421
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_has-max-content-width_hyvsj_8eynx_411) {
|
|
422
|
+
--awsui-default-max-content-width-f9jj7p: 1620px;
|
|
423
423
|
}
|
|
424
424
|
}
|
|
425
|
-
.
|
|
426
|
-
--awsui-default-max-content-width-
|
|
425
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_has-max-content-width_hyvsj_8eynx_411:not(#\9) {
|
|
426
|
+
--awsui-default-max-content-width-f9jj7p: var(--awsui-max-content-width-f9jj7p);
|
|
427
427
|
}
|
|
428
428
|
@media (min-width: 993px) {
|
|
429
|
-
.
|
|
430
|
-
--awsui-default-min-content-width-
|
|
429
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9) {
|
|
430
|
+
--awsui-default-min-content-width-f9jj7p: var(--awsui-min-content-width-f9jj7p, 280px);
|
|
431
431
|
}
|
|
432
432
|
}
|
|
433
433
|
@media (max-width: 992px) {
|
|
434
|
-
.
|
|
435
|
-
--awsui-default-min-content-width-
|
|
434
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9) {
|
|
435
|
+
--awsui-default-min-content-width-f9jj7p: 0px;
|
|
436
436
|
}
|
|
437
437
|
}
|
|
438
|
-
.
|
|
439
|
-
--awsui-overlap-height-
|
|
438
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_is-overlap-disabled_hyvsj_8eynx_438:not(#\9) {
|
|
439
|
+
--awsui-overlap-height-f9jj7p: 0;
|
|
440
440
|
}
|
|
441
|
-
.
|
|
442
|
-
--awsui-offset-top-
|
|
443
|
-
min-height: var(--awsui-content-height-
|
|
441
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_disable-body-scroll_hyvsj_8eynx_441) {
|
|
442
|
+
--awsui-offset-top-f9jj7p: var(--awsui-header-height-f9jj7p);
|
|
443
|
+
min-height: var(--awsui-content-height-f9jj7p);
|
|
444
444
|
}
|
|
445
|
-
.
|
|
446
|
-
--awsui-offset-top-with-notifications-
|
|
445
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_disable-body-scroll_hyvsj_8eynx_441):not(.awsui_has-sticky-notifications_hyvsj_8eynx_445) {
|
|
446
|
+
--awsui-offset-top-with-notifications-f9jj7p: var(--awsui-header-height-f9jj7p);
|
|
447
447
|
}
|
|
448
|
-
.
|
|
449
|
-
--awsui-offset-top-with-notifications-
|
|
450
|
-
var(--awsui-header-height-
|
|
448
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_disable-body-scroll_hyvsj_8eynx_441).awsui_has-sticky-notifications_hyvsj_8eynx_445 {
|
|
449
|
+
--awsui-offset-top-with-notifications-f9jj7p: calc(
|
|
450
|
+
var(--awsui-header-height-f9jj7p) + var(--awsui-notifications-height-f9jj7p) + var(--space-xs-rsr2qu, 8px) + var(--space-xxxs-k2w98v, 2px)
|
|
451
451
|
);
|
|
452
452
|
}
|
|
453
|
-
.
|
|
454
|
-
--awsui-offset-top-
|
|
455
|
-
grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-
|
|
456
|
-
height: var(--awsui-content-height-
|
|
453
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441:not(#\9) {
|
|
454
|
+
--awsui-offset-top-f9jj7p: 0px;
|
|
455
|
+
grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-f9jj7p) 1fr auto;
|
|
456
|
+
height: var(--awsui-content-height-f9jj7p);
|
|
457
457
|
overflow-y: scroll;
|
|
458
458
|
}
|
|
459
|
-
.
|
|
460
|
-
grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-
|
|
459
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441.awsui_has-split-panel_hyvsj_8eynx_459.awsui_split-panel-position-bottom_hyvsj_8eynx_459:not(#\9) {
|
|
460
|
+
grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-f9jj7p) repeat(2, auto);
|
|
461
461
|
}
|
|
462
|
-
.
|
|
463
|
-
--awsui-offset-top-with-notifications-
|
|
462
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441:not(#\9):not(.awsui_has-sticky-notifications_hyvsj_8eynx_445) {
|
|
463
|
+
--awsui-offset-top-with-notifications-f9jj7p: 0px;
|
|
464
464
|
}
|
|
465
|
-
.
|
|
466
|
-
--awsui-offset-top-with-notifications-
|
|
467
|
-
var(--awsui-notifications-height-
|
|
465
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441.awsui_has-sticky-notifications_hyvsj_8eynx_445:not(#\9) {
|
|
466
|
+
--awsui-offset-top-with-notifications-f9jj7p: calc(
|
|
467
|
+
var(--awsui-notifications-height-f9jj7p) + var(--space-xs-rsr2qu, 8px) + var(--space-xxs-ynfts5, 4px)
|
|
468
468
|
);
|
|
469
469
|
}
|
|
470
470
|
@media (min-width: 689px) {
|
|
471
|
-
.
|
|
472
|
-
--awsui-content-gap-left-
|
|
471
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_has-content-gap-left_hyvsj_8eynx_471:not(#\9) {
|
|
472
|
+
--awsui-content-gap-left-f9jj7p: var(--space-scaled-2x-xxxl-lbp35j, 40px);
|
|
473
473
|
}
|
|
474
|
-
.
|
|
475
|
-
--awsui-content-gap-right-
|
|
474
|
+
.awsui_layout_hyvsj_8eynx_329.awsui_has-content-gap-right_hyvsj_8eynx_474:not(#\9) {
|
|
475
|
+
--awsui-content-gap-right-f9jj7p: var(--space-scaled-2x-xxxl-lbp35j, 40px);
|
|
476
476
|
}
|
|
477
477
|
}
|
|
478
478
|
@media (max-width: 688px) {
|
|
479
|
-
.
|
|
480
|
-
--awsui-content-gap-left-
|
|
481
|
-
--awsui-content-gap-right-
|
|
479
|
+
.awsui_layout_hyvsj_8eynx_329:not(#\9) {
|
|
480
|
+
--awsui-content-gap-left-f9jj7p: var(--space-l-4vl6xu, 20px);
|
|
481
|
+
--awsui-content-gap-right-f9jj7p: var(--space-l-4vl6xu, 20px);
|
|
482
482
|
}
|
|
483
483
|
}
|
|
484
484
|
|
|
@@ -486,7 +486,7 @@ header.awsui_content_hyvsj_1sfal_180:not(#\9) {
|
|
|
486
486
|
This CSS class is applied to the document body to prevent overflow scrolling
|
|
487
487
|
when the navigation or tools drawers are open in responsive viewports.
|
|
488
488
|
*/
|
|
489
|
-
.awsui_block-body-
|
|
489
|
+
.awsui_block-body-scroll_hyvsj_8eynx_489:not(#\9) {
|
|
490
490
|
overflow: hidden;
|
|
491
491
|
}
|
|
492
492
|
|
|
@@ -494,75 +494,66 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
494
494
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
495
495
|
SPDX-License-Identifier: Apache-2.0
|
|
496
496
|
*/
|
|
497
|
-
.
|
|
497
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9) {
|
|
498
498
|
grid-column: 3;
|
|
499
499
|
grid-row: 4/span 2;
|
|
500
500
|
padding-bottom: var(--space-layout-content-bottom-kg9l42, 40px);
|
|
501
501
|
/*
|
|
502
|
-
If
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
*/
|
|
507
|
-
/*
|
|
508
|
-
If disableContentPaddings is enabled then the Main content has a different
|
|
509
|
-
behavior inside the Layout grid. By default it will render across the entire
|
|
510
|
-
grid column span. If the Navigation is open on the left, we increment the
|
|
511
|
-
start column by one. If the Tools or Split Panel (in side position) is open
|
|
502
|
+
If disableContentPaddings is enabled then the Main content has a different
|
|
503
|
+
behavior inside the Layout grid. By default it will render across the entire
|
|
504
|
+
grid column span. If the Navigation is open on the left, we increment the
|
|
505
|
+
start column by one. If the Tools or Split Panel (in side position) is open
|
|
512
506
|
on the right, we decrement the column end by one.
|
|
513
507
|
*/
|
|
514
508
|
/*
|
|
515
|
-
If disableContentPaddings is not enabled (the majority of use cases) then
|
|
516
|
-
the following code block will compute the padding behavior for the Main
|
|
509
|
+
If disableContentPaddings is not enabled (the majority of use cases) then
|
|
510
|
+
the following code block will compute the padding behavior for the Main
|
|
517
511
|
under various circumstances.
|
|
518
512
|
*/
|
|
519
513
|
}
|
|
520
|
-
.
|
|
521
|
-
padding-bottom: calc(var(--awsui-split-panel-height-5mks97) + var(--space-layout-content-bottom-kg9l42, 40px));
|
|
522
|
-
}
|
|
523
|
-
.awsui_container_hyvsj_1sfal_497.awsui_disable-content-paddings_hyvsj_1sfal_523:not(#\9) {
|
|
514
|
+
.awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514:not(#\9) {
|
|
524
515
|
grid-column: 1/6;
|
|
525
516
|
padding: 0;
|
|
526
517
|
}
|
|
527
518
|
@media (min-width: 689px) {
|
|
528
|
-
.
|
|
519
|
+
.awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514.awsui_is-navigation-open_hyvsj_8eynx_519:not(#\9) {
|
|
529
520
|
grid-column-start: 2;
|
|
530
521
|
}
|
|
531
|
-
.
|
|
522
|
+
.awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514.awsui_is-tools-open_hyvsj_8eynx_522:not(#\9), .awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_split-panel-position-side_hyvsj_8eynx_522:not(#\9) {
|
|
532
523
|
grid-column-end: 5;
|
|
533
524
|
}
|
|
534
525
|
}
|
|
535
526
|
@media (min-width: 689px) {
|
|
536
|
-
.
|
|
527
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514) {
|
|
537
528
|
/*
|
|
538
|
-
Notifications is the previous adjacent sibling to the Main in
|
|
529
|
+
Notifications is the previous adjacent sibling to the Main in
|
|
539
530
|
desktop viewports if there are no Breadcrumbs or Header. Use additional
|
|
540
531
|
to padding on the Main.
|
|
541
532
|
*/
|
|
542
533
|
/*
|
|
543
|
-
Main is the only rendered center content if there are no Notifications,
|
|
534
|
+
Main is the only rendered center content if there are no Notifications,
|
|
544
535
|
Breadcrumbs, or Header. Use minimal top padding.
|
|
545
536
|
*/
|
|
546
537
|
/*
|
|
547
|
-
If the Header exists then it is necessarily the previous adjacent
|
|
538
|
+
If the Header exists then it is necessarily the previous adjacent
|
|
548
539
|
sibling to the Main which requires no top padding.
|
|
549
540
|
*/
|
|
550
541
|
}
|
|
551
|
-
.
|
|
542
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
|
|
552
543
|
padding-top: var(--space-scaled-m-pv0fmt, 16px);
|
|
553
544
|
}
|
|
554
|
-
.
|
|
545
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
|
|
555
546
|
padding-top: var(--space-scaled-xs-6859qs, 8px);
|
|
556
547
|
}
|
|
557
|
-
.
|
|
548
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-header_hyvsj_8eynx_179, .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-dynamic-overlap-height_hyvsj_8eynx_179 {
|
|
558
549
|
padding-top: 0;
|
|
559
550
|
}
|
|
560
551
|
}
|
|
561
552
|
@media (max-width: 688px) {
|
|
562
|
-
.
|
|
553
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514) {
|
|
563
554
|
/*
|
|
564
|
-
If the Notifications exist but the Header does not then the
|
|
565
|
-
Notifications is the previous adjacent sibling to the Main
|
|
555
|
+
If the Notifications exist but the Header does not then the
|
|
556
|
+
Notifications is the previous adjacent sibling to the Main
|
|
566
557
|
requiring additional top padding. This is because the Breadcrumbs
|
|
567
558
|
are now rendered first and positioned sticky.
|
|
568
559
|
*/
|
|
@@ -570,26 +561,26 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
570
561
|
Main is the only rendered center content if there are no Notifications or Header.
|
|
571
562
|
*/
|
|
572
563
|
/*
|
|
573
|
-
If the Header exists then it is necessarily the previous adjacent
|
|
564
|
+
If the Header exists then it is necessarily the previous adjacent
|
|
574
565
|
sibling to the Main which requires no top padding.
|
|
575
566
|
*/
|
|
576
567
|
}
|
|
577
|
-
.
|
|
568
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
|
|
578
569
|
padding-top: var(--space-scaled-m-pv0fmt, 16px);
|
|
579
570
|
}
|
|
580
|
-
.
|
|
571
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
|
|
581
572
|
padding-top: var(--space-scaled-m-pv0fmt, 16px);
|
|
582
573
|
}
|
|
583
|
-
.
|
|
574
|
+
.awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-header_hyvsj_8eynx_179, .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-dynamic-overlap-height_hyvsj_8eynx_179 {
|
|
584
575
|
padding-top: 0;
|
|
585
576
|
}
|
|
586
577
|
}
|
|
587
|
-
.
|
|
578
|
+
.awsui_container_hyvsj_8eynx_497.awsui_content-type-cards_hyvsj_8eynx_183:not(#\9), .awsui_container_hyvsj_8eynx_497.awsui_content-type-table_hyvsj_8eynx_184:not(#\9), .awsui_container_hyvsj_8eynx_497.awsui_content-type-wizard_hyvsj_8eynx_180:not(#\9) {
|
|
588
579
|
padding-top: 0;
|
|
589
580
|
}
|
|
590
581
|
|
|
591
582
|
/* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
|
|
592
|
-
.
|
|
583
|
+
.awsui_unfocusable_hyvsj_8eynx_583 *:not(#\9) {
|
|
593
584
|
visibility: hidden !important;
|
|
594
585
|
}
|
|
595
586
|
|
|
@@ -597,14 +588,14 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
597
588
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
598
589
|
SPDX-License-Identifier: Apache-2.0
|
|
599
590
|
*/
|
|
600
|
-
.awsui_navigation-
|
|
601
|
-
--awsui-navigation-width-
|
|
591
|
+
.awsui_navigation-container_hyvsj_8eynx_591:not(#\9) {
|
|
592
|
+
--awsui-navigation-width-f9jj7p: 280px;
|
|
602
593
|
display: flex;
|
|
603
594
|
grid-column: 1;
|
|
604
595
|
grid-row: 1/span 5;
|
|
605
|
-
height: var(--awsui-content-height-
|
|
596
|
+
height: var(--awsui-content-height-f9jj7p);
|
|
606
597
|
position: sticky;
|
|
607
|
-
top: var(--awsui-offset-top-
|
|
598
|
+
top: var(--awsui-offset-top-f9jj7p);
|
|
608
599
|
z-index: 850;
|
|
609
600
|
/*
|
|
610
601
|
The navigation and tools containers (that contain the toggle buttons)
|
|
@@ -619,27 +610,27 @@ when the navigation or tools drawers are open in responsive viewports.
|
|
|
619
610
|
pointer-events: none;
|
|
620
611
|
}
|
|
621
612
|
@media (min-width: 2541px) {
|
|
622
|
-
.awsui_navigation-
|
|
623
|
-
--awsui-navigation-width-
|
|
613
|
+
.awsui_navigation-container_hyvsj_8eynx_591:not(#\9) {
|
|
614
|
+
--awsui-navigation-width-f9jj7p: 320px;
|
|
624
615
|
}
|
|
625
616
|
}
|
|
626
617
|
@media (max-width: 688px) {
|
|
627
|
-
.awsui_navigation-
|
|
618
|
+
.awsui_navigation-container_hyvsj_8eynx_591:not(#\9) {
|
|
628
619
|
left: 0;
|
|
629
620
|
position: fixed;
|
|
630
|
-
top: var(--awsui-offset-top-
|
|
621
|
+
top: var(--awsui-offset-top-f9jj7p);
|
|
631
622
|
z-index: 1001;
|
|
632
623
|
}
|
|
633
624
|
}
|
|
634
625
|
|
|
635
|
-
nav.awsui_show-
|
|
626
|
+
nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9) {
|
|
636
627
|
padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-layout-toggle-padding-axl9jr, 20px);
|
|
637
628
|
/*
|
|
638
629
|
Apply the animation only in desktop viewports because the AppBar will
|
|
639
630
|
take control in responsive viewports.
|
|
640
631
|
*/
|
|
641
632
|
}
|
|
642
|
-
@keyframes
|
|
633
|
+
@keyframes awsui_showButtons_hyvsj_8eynx_1 {
|
|
643
634
|
0% {
|
|
644
635
|
opacity: 0;
|
|
645
636
|
}
|
|
@@ -647,31 +638,31 @@ nav.awsui_show-navigation_hyvsj_1sfal_635:not(#\9) {
|
|
|
647
638
|
opacity: 1;
|
|
648
639
|
}
|
|
649
640
|
}
|
|
650
|
-
nav.awsui_show-
|
|
641
|
+
nav.awsui_show-navigation_hyvsj_8eynx_626.awsui_is-navigation-open_hyvsj_8eynx_519:not(#\9) {
|
|
651
642
|
display: none;
|
|
652
643
|
}
|
|
653
644
|
@media (min-width: 689px) {
|
|
654
|
-
nav.awsui_show-
|
|
645
|
+
nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519) {
|
|
655
646
|
display: block;
|
|
656
647
|
}
|
|
657
|
-
nav.awsui_show-
|
|
658
|
-
animation:
|
|
648
|
+
nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648 {
|
|
649
|
+
animation: awsui_showButtons_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
|
|
659
650
|
}
|
|
660
651
|
}
|
|
661
652
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
662
|
-
nav.awsui_show-
|
|
653
|
+
nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648 {
|
|
663
654
|
animation: none;
|
|
664
655
|
transition: none;
|
|
665
656
|
}
|
|
666
657
|
}
|
|
667
658
|
@media (min-width: 689px) {
|
|
668
|
-
.awsui-motion-disabled nav.awsui_show-
|
|
659
|
+
.awsui-motion-disabled nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648, .awsui-mode-entering nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648 {
|
|
669
660
|
animation: none;
|
|
670
661
|
transition: none;
|
|
671
662
|
}
|
|
672
663
|
}
|
|
673
664
|
|
|
674
|
-
nav.
|
|
665
|
+
nav.awsui_navigation_hyvsj_8eynx_591:not(#\9) {
|
|
675
666
|
background-color: var(--color-background-container-content-i8i4a0, #ffffff);
|
|
676
667
|
box-shadow: var(--shadow-panel-gp3bf2, 0px 1px 1px 1px #e9ebed, 0px 6px 36px rgba(0, 7, 22, 0.1));
|
|
677
668
|
bottom: 0;
|
|
@@ -688,43 +679,43 @@ nav.awsui_navigation_hyvsj_1sfal_600:not(#\9) {
|
|
|
688
679
|
prevent unwanted text wrapping.
|
|
689
680
|
*/
|
|
690
681
|
}
|
|
691
|
-
@keyframes
|
|
682
|
+
@keyframes awsui_openNavigation_hyvsj_8eynx_1 {
|
|
692
683
|
from {
|
|
693
684
|
opacity: 0;
|
|
694
685
|
width: calc(var(--space-layout-toggle-padding-axl9jr, 20px) * 2 + var(--space-layout-toggle-diameter-hzvqtj, 40px));
|
|
695
686
|
}
|
|
696
687
|
to {
|
|
697
688
|
opacity: 1;
|
|
698
|
-
width: var(--awsui-navigation-width-
|
|
689
|
+
width: var(--awsui-navigation-width-f9jj7p);
|
|
699
690
|
}
|
|
700
691
|
}
|
|
701
|
-
nav.
|
|
692
|
+
nav.awsui_navigation_hyvsj_8eynx_591:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519) {
|
|
702
693
|
width: 0;
|
|
703
694
|
display: none;
|
|
704
695
|
}
|
|
705
|
-
nav.
|
|
706
|
-
animation:
|
|
696
|
+
nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
697
|
+
animation: awsui_openNavigation_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
|
|
707
698
|
}
|
|
708
699
|
@media (prefers-reduced-motion: reduce) {
|
|
709
|
-
nav.
|
|
700
|
+
nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
710
701
|
animation: none;
|
|
711
702
|
transition: none;
|
|
712
703
|
}
|
|
713
704
|
}
|
|
714
|
-
.awsui-motion-disabled nav.
|
|
705
|
+
.awsui-motion-disabled nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
715
706
|
animation: none;
|
|
716
707
|
transition: none;
|
|
717
708
|
}
|
|
718
|
-
nav.
|
|
719
|
-
width: var(--awsui-navigation-width-
|
|
709
|
+
nav.awsui_navigation_hyvsj_8eynx_591 > .awsui_animated-content_hyvsj_8eynx_709:not(#\9) {
|
|
710
|
+
width: var(--awsui-navigation-width-f9jj7p);
|
|
720
711
|
}
|
|
721
712
|
@media (max-width: 688px) {
|
|
722
|
-
nav.
|
|
723
|
-
--awsui-navigation-width-
|
|
713
|
+
nav.awsui_navigation_hyvsj_8eynx_591:not(#\9) {
|
|
714
|
+
--awsui-navigation-width-f9jj7p: 100vw;
|
|
724
715
|
}
|
|
725
716
|
}
|
|
726
717
|
|
|
727
|
-
.awsui_hide-
|
|
718
|
+
.awsui_hide-navigation_hyvsj_8eynx_718:not(#\9) {
|
|
728
719
|
position: absolute;
|
|
729
720
|
right: var(--space-m-17eucw, 16px);
|
|
730
721
|
top: var(--size-vertical-panel-icon-offset-ti40n4, 15px);
|
|
@@ -734,7 +725,7 @@ nav.awsui_navigation_hyvsj_1sfal_600 > .awsui_animated-content_hyvsj_1sfal_718:n
|
|
|
734
725
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
735
726
|
SPDX-License-Identifier: Apache-2.0
|
|
736
727
|
*/
|
|
737
|
-
.
|
|
728
|
+
.awsui_notifications_hyvsj_8eynx_224:not(#\9) {
|
|
738
729
|
grid-column: 3;
|
|
739
730
|
grid-row: 1;
|
|
740
731
|
z-index: 825;
|
|
@@ -751,30 +742,30 @@ nav.awsui_navigation_hyvsj_1sfal_600 > .awsui_animated-content_hyvsj_1sfal_718:n
|
|
|
751
742
|
*/
|
|
752
743
|
}
|
|
753
744
|
@media (min-width: 689px) {
|
|
754
|
-
.
|
|
745
|
+
.awsui_notifications_hyvsj_8eynx_224:not(#\9) {
|
|
755
746
|
margin: var(--space-xs-rsr2qu, 8px) 0;
|
|
756
747
|
/*
|
|
757
748
|
var(--space-xs-rsr2qu, 8px) token needs to align with the $offsetTopWithNotifications
|
|
758
749
|
calculation in the layout CSS.
|
|
759
750
|
*/
|
|
760
751
|
}
|
|
761
|
-
.
|
|
752
|
+
.awsui_notifications_hyvsj_8eynx_224.awsui_sticky-notifications_hyvsj_8eynx_236:not(#\9) {
|
|
762
753
|
position: sticky;
|
|
763
|
-
top: calc(var(--awsui-offset-top-
|
|
754
|
+
top: calc(var(--awsui-offset-top-f9jj7p) + var(--space-xs-rsr2qu, 8px));
|
|
764
755
|
}
|
|
765
|
-
.
|
|
756
|
+
.awsui_notifications_hyvsj_8eynx_224:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173) {
|
|
766
757
|
margin: 0;
|
|
767
758
|
}
|
|
768
759
|
}
|
|
769
760
|
@media (max-width: 688px) {
|
|
770
|
-
.
|
|
761
|
+
.awsui_notifications_hyvsj_8eynx_224:not(#\9) {
|
|
771
762
|
grid-row: 2;
|
|
772
763
|
margin: var(--space-scaled-s-cu1hzn, 12px) 0;
|
|
773
764
|
}
|
|
774
|
-
.
|
|
765
|
+
.awsui_notifications_hyvsj_8eynx_224.awsui_sticky-notifications_hyvsj_8eynx_236:not(#\9) {
|
|
775
766
|
position: static;
|
|
776
767
|
}
|
|
777
|
-
.
|
|
768
|
+
.awsui_notifications_hyvsj_8eynx_224:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173) {
|
|
778
769
|
margin: 0;
|
|
779
770
|
}
|
|
780
771
|
}
|
|
@@ -784,27 +775,18 @@ nav.awsui_navigation_hyvsj_1sfal_600 > .awsui_animated-content_hyvsj_1sfal_718:n
|
|
|
784
775
|
SPDX-License-Identifier: Apache-2.0
|
|
785
776
|
*/
|
|
786
777
|
/*
|
|
787
|
-
When the Split Panel is in the bottom position it
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
778
|
+
When the Split Panel is in the bottom position it will be an additional
|
|
779
|
+
row entry in the grid definition within the Layout component. The state of
|
|
780
|
+
the Navigation and Tools components will adjust the start and end column
|
|
781
|
+
within. In the bottom position, the Split Panel is simply a direct child
|
|
782
|
+
of the Tools component flex container and should consume 100% of the
|
|
783
|
+
parent height.
|
|
791
784
|
*/
|
|
792
|
-
section.awsui_split-panel-
|
|
793
|
-
|
|
794
|
-
The align self property will position the split panel at the bottom of the grid row.
|
|
795
|
-
This could be off the viewport if the content area has enough content to be scrollable.
|
|
796
|
-
*/
|
|
797
|
-
align-self: end;
|
|
798
|
-
bottom: var(--awsui-footer-height-5mks97);
|
|
785
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785:not(#\9) {
|
|
786
|
+
bottom: var(--awsui-footer-height-f9jj7p);
|
|
799
787
|
display: none;
|
|
800
788
|
grid-column: 1/6;
|
|
801
|
-
grid-row: 5;
|
|
802
789
|
height: auto;
|
|
803
|
-
/*
|
|
804
|
-
The position sticky will work in conjunction with the align self: end; property.
|
|
805
|
-
If the grid row scrolls beyond the viewport, the sticky bottom position
|
|
806
|
-
will lift it up above the footer so it is always visible.
|
|
807
|
-
*/
|
|
808
790
|
position: sticky;
|
|
809
791
|
z-index: 851;
|
|
810
792
|
/*
|
|
@@ -824,47 +806,47 @@ section.awsui_split-panel-bottom_hyvsj_1sfal_792:not(#\9) {
|
|
|
824
806
|
apply the animation to the height property.
|
|
825
807
|
*/
|
|
826
808
|
}
|
|
827
|
-
@keyframes
|
|
809
|
+
@keyframes awsui_openSplitPanelBottom_hyvsj_8eynx_1 {
|
|
828
810
|
from {
|
|
829
|
-
height: var(--awsui-split-panel-reported-header-size-
|
|
811
|
+
height: var(--awsui-split-panel-reported-header-size-f9jj7p, 0);
|
|
830
812
|
}
|
|
831
813
|
to {
|
|
832
|
-
height: var(--awsui-split-panel-reported-size-
|
|
814
|
+
height: var(--awsui-split-panel-reported-size-f9jj7p);
|
|
833
815
|
}
|
|
834
816
|
}
|
|
835
|
-
section.awsui_split-panel-
|
|
817
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_disable-body-scroll_hyvsj_8eynx_441:not(#\9) {
|
|
836
818
|
bottom: 0;
|
|
837
819
|
}
|
|
838
|
-
section.awsui_split-panel-
|
|
820
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
|
|
839
821
|
grid-column-start: 2;
|
|
840
822
|
}
|
|
841
|
-
section.awsui_split-panel-
|
|
823
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-tools-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
|
|
842
824
|
grid-column-end: 5;
|
|
843
825
|
}
|
|
844
|
-
section.awsui_split-panel-
|
|
826
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
|
|
845
827
|
display: block;
|
|
846
828
|
}
|
|
847
|
-
section.awsui_split-panel-
|
|
829
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785:not(#\9):not(.awsui_is-split-panel-open_hyvsj_8eynx_522).awsui_position-bottom_hyvsj_8eynx_820 {
|
|
848
830
|
box-shadow: rgba(0, 7, 22, 0.1) 0px -32px 32px -24px;
|
|
849
831
|
}
|
|
850
|
-
section.awsui_split-panel-
|
|
832
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
|
|
851
833
|
box-shadow: var(--shadow-split-bottom-otfetg, 0px -36px 36px -36px rgba(0, 7, 22, 0.1));
|
|
852
834
|
}
|
|
853
|
-
section.awsui_split-panel-
|
|
854
|
-
animation:
|
|
835
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
836
|
+
animation: awsui_openSplitPanelBottom_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
|
|
855
837
|
}
|
|
856
838
|
@media (prefers-reduced-motion: reduce) {
|
|
857
|
-
section.awsui_split-panel-
|
|
839
|
+
section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
858
840
|
animation: none;
|
|
859
841
|
transition: none;
|
|
860
842
|
}
|
|
861
843
|
}
|
|
862
|
-
.awsui-motion-disabled section.awsui_split-panel-
|
|
844
|
+
.awsui-motion-disabled section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
863
845
|
animation: none;
|
|
864
846
|
transition: none;
|
|
865
847
|
}
|
|
866
848
|
|
|
867
|
-
section.awsui_split-panel-
|
|
849
|
+
section.awsui_split-panel-side_hyvsj_8eynx_849:not(#\9) {
|
|
868
850
|
height: 100%;
|
|
869
851
|
overflow-x: hidden;
|
|
870
852
|
pointer-events: auto;
|
|
@@ -879,41 +861,41 @@ section.awsui_split-panel-side_hyvsj_1sfal_867:not(#\9) {
|
|
|
879
861
|
prevent unwanted text wrapping.
|
|
880
862
|
*/
|
|
881
863
|
}
|
|
882
|
-
@keyframes
|
|
864
|
+
@keyframes awsui_openSplitPanelSide_hyvsj_8eynx_1 {
|
|
883
865
|
from {
|
|
884
866
|
opacity: 0;
|
|
885
|
-
width: var(--awsui-split-panel-min-width-
|
|
867
|
+
width: var(--awsui-split-panel-min-width-f9jj7p, 280px);
|
|
886
868
|
}
|
|
887
869
|
to {
|
|
888
870
|
opacity: 1;
|
|
889
|
-
width: var(--awsui-split-panel-reported-size-
|
|
871
|
+
width: var(--awsui-split-panel-reported-size-f9jj7p);
|
|
890
872
|
}
|
|
891
873
|
}
|
|
892
|
-
section.awsui_split-panel-
|
|
874
|
+
section.awsui_split-panel-side_hyvsj_8eynx_849:not(#\9):not(.awsui_is-split-panel-open_hyvsj_8eynx_522), section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
|
|
893
875
|
width: 0;
|
|
894
876
|
}
|
|
895
|
-
section.awsui_split-panel-
|
|
877
|
+
section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877:not(#\9) {
|
|
896
878
|
box-shadow: var(--shadow-panel-gp3bf2, 0px 1px 1px 1px #e9ebed, 0px 6px 36px rgba(0, 7, 22, 0.1));
|
|
897
|
-
max-width: var(--awsui-split-panel-max-width-
|
|
898
|
-
min-width: var(--awsui-split-panel-min-width-
|
|
879
|
+
max-width: var(--awsui-split-panel-max-width-f9jj7p, 280px);
|
|
880
|
+
min-width: var(--awsui-split-panel-min-width-f9jj7p, 280px);
|
|
899
881
|
}
|
|
900
|
-
section.awsui_split-panel-
|
|
901
|
-
animation:
|
|
882
|
+
section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
883
|
+
animation: awsui_openSplitPanelSide_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
|
|
902
884
|
}
|
|
903
885
|
@media (prefers-reduced-motion: reduce) {
|
|
904
|
-
section.awsui_split-panel-
|
|
886
|
+
section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
905
887
|
animation: none;
|
|
906
888
|
transition: none;
|
|
907
889
|
}
|
|
908
890
|
}
|
|
909
|
-
.awsui-motion-disabled section.awsui_split-panel-
|
|
891
|
+
.awsui-motion-disabled section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
910
892
|
animation: none;
|
|
911
893
|
transition: none;
|
|
912
894
|
}
|
|
913
|
-
section.awsui_split-panel-
|
|
895
|
+
section.awsui_split-panel-side_hyvsj_8eynx_849 > .awsui_animated-content_hyvsj_8eynx_709:not(#\9) {
|
|
914
896
|
height: 100%;
|
|
915
897
|
max-width: inherit;
|
|
916
|
-
width: var(--awsui-split-panel-reported-size-
|
|
898
|
+
width: var(--awsui-split-panel-reported-size-f9jj7p);
|
|
917
899
|
}
|
|
918
900
|
|
|
919
901
|
/*
|
|
@@ -929,38 +911,38 @@ content width has a default value that can be set directly with the minContentWi
|
|
|
929
911
|
property. The content gap right is computed in the Layout styles based on the
|
|
930
912
|
viewport size and state of the Tools drawer.
|
|
931
913
|
*/
|
|
932
|
-
.awsui_tools-
|
|
914
|
+
.awsui_tools-container_hyvsj_8eynx_914:not(#\9) {
|
|
933
915
|
/* stylelint-disable scss/operator-no-newline-after */
|
|
934
|
-
--awsui-tools-max-width-
|
|
916
|
+
--awsui-tools-max-width-f9jj7p: calc(var(--awsui-layout-width-f9jj7p) - var(--awsui-main-offset-left-f9jj7p) - var(--awsui-default-min-content-width-f9jj7p) - var(--awsui-content-gap-right-f9jj7p));
|
|
935
917
|
/* stylelint-enable scss/operator-no-newline-after */
|
|
936
|
-
--awsui-tools-width-
|
|
918
|
+
--awsui-tools-width-f9jj7p: 290px;
|
|
937
919
|
display: flex;
|
|
938
920
|
grid-column: 5;
|
|
939
921
|
grid-row: 1/span 5;
|
|
940
|
-
height: var(--awsui-content-height-
|
|
941
|
-
max-width: var(--awsui-tools-max-width-
|
|
922
|
+
height: var(--awsui-content-height-f9jj7p);
|
|
923
|
+
max-width: var(--awsui-tools-max-width-f9jj7p);
|
|
942
924
|
position: sticky;
|
|
943
|
-
top: var(--awsui-offset-top-
|
|
925
|
+
top: var(--awsui-offset-top-f9jj7p);
|
|
944
926
|
z-index: 850;
|
|
945
927
|
pointer-events: none;
|
|
946
928
|
}
|
|
947
929
|
@media (min-width: 2541px) {
|
|
948
|
-
.awsui_tools-
|
|
949
|
-
--awsui-tools-width-
|
|
930
|
+
.awsui_tools-container_hyvsj_8eynx_914:not(#\9) {
|
|
931
|
+
--awsui-tools-width-f9jj7p: 360px;
|
|
950
932
|
}
|
|
951
933
|
}
|
|
952
934
|
@media (max-width: 688px) {
|
|
953
|
-
.awsui_tools-
|
|
954
|
-
--awsui-tools-max-width-
|
|
955
|
-
--awsui-tools-width-
|
|
935
|
+
.awsui_tools-container_hyvsj_8eynx_914:not(#\9) {
|
|
936
|
+
--awsui-tools-max-width-f9jj7p: none;
|
|
937
|
+
--awsui-tools-width-f9jj7p: auto;
|
|
956
938
|
position: fixed;
|
|
957
939
|
right: 0;
|
|
958
|
-
top: var(--awsui-offset-top-
|
|
940
|
+
top: var(--awsui-offset-top-f9jj7p);
|
|
959
941
|
z-index: 1001;
|
|
960
942
|
}
|
|
961
943
|
}
|
|
962
944
|
|
|
963
|
-
.
|
|
945
|
+
.awsui_tools_hyvsj_8eynx_914:not(#\9) {
|
|
964
946
|
background-color: var(--color-background-container-content-i8i4a0, #ffffff);
|
|
965
947
|
box-shadow: var(--shadow-panel-gp3bf2, 0px 1px 1px 1px #e9ebed, 0px 6px 36px rgba(0, 7, 22, 0.1));
|
|
966
948
|
flex-shrink: 0;
|
|
@@ -983,48 +965,48 @@ viewport size and state of the Tools drawer.
|
|
|
983
965
|
in the side position.
|
|
984
966
|
*/
|
|
985
967
|
}
|
|
986
|
-
@keyframes
|
|
968
|
+
@keyframes awsui_openTools_hyvsj_8eynx_1 {
|
|
987
969
|
from {
|
|
988
|
-
opacity: var(--awsui-tools-animation-starting-opacity-
|
|
970
|
+
opacity: var(--awsui-tools-animation-starting-opacity-f9jj7p, 0);
|
|
989
971
|
width: calc(var(--space-layout-toggle-padding-axl9jr, 20px) * 2 + var(--space-layout-toggle-diameter-hzvqtj, 40px));
|
|
990
972
|
}
|
|
991
973
|
to {
|
|
992
974
|
opacity: 1;
|
|
993
|
-
width: var(--awsui-tools-width-
|
|
975
|
+
width: var(--awsui-tools-width-f9jj7p);
|
|
994
976
|
}
|
|
995
977
|
}
|
|
996
|
-
.
|
|
978
|
+
.awsui_tools_hyvsj_8eynx_914:not(#\9):not(.awsui_is-tools-open_hyvsj_8eynx_522) {
|
|
997
979
|
width: 0;
|
|
998
980
|
display: none;
|
|
999
981
|
}
|
|
1000
|
-
.
|
|
1001
|
-
animation:
|
|
982
|
+
.awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
983
|
+
animation: awsui_openTools_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
|
|
1002
984
|
}
|
|
1003
985
|
@media (prefers-reduced-motion: reduce) {
|
|
1004
|
-
.
|
|
986
|
+
.awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
1005
987
|
animation: none;
|
|
1006
988
|
transition: none;
|
|
1007
989
|
}
|
|
1008
990
|
}
|
|
1009
|
-
.awsui-motion-disabled .
|
|
991
|
+
.awsui-motion-disabled .awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering .awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
1010
992
|
animation: none;
|
|
1011
993
|
transition: none;
|
|
1012
994
|
}
|
|
1013
|
-
.
|
|
1014
|
-
width: var(--awsui-tools-width-
|
|
995
|
+
.awsui_tools_hyvsj_8eynx_914 > .awsui_animated-content_hyvsj_8eynx_709:not(#\9) {
|
|
996
|
+
width: var(--awsui-tools-width-f9jj7p);
|
|
1015
997
|
}
|
|
1016
998
|
@media (min-width: 689px) {
|
|
1017
|
-
.
|
|
999
|
+
.awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_has-tools-form-persistence_hyvsj_8eynx_999:not(#\9) {
|
|
1018
1000
|
border-right: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
|
|
1019
1001
|
}
|
|
1020
1002
|
}
|
|
1021
1003
|
@media (max-width: 688px) {
|
|
1022
|
-
.
|
|
1023
|
-
--awsui-tools-width-
|
|
1004
|
+
.awsui_tools_hyvsj_8eynx_914:not(#\9) {
|
|
1005
|
+
--awsui-tools-width-f9jj7p: 100vw;
|
|
1024
1006
|
}
|
|
1025
1007
|
}
|
|
1026
1008
|
|
|
1027
|
-
.awsui_hide-
|
|
1009
|
+
.awsui_hide-tools_hyvsj_8eynx_1009:not(#\9) {
|
|
1028
1010
|
position: absolute;
|
|
1029
1011
|
right: var(--space-m-17eucw, 16px);
|
|
1030
1012
|
top: var(--size-vertical-panel-icon-offset-ti40n4, 15px);
|
|
@@ -1036,7 +1018,7 @@ Warning! If these design tokens for padding change it will adversely impact
|
|
|
1036
1018
|
the calculation used to determine the Split Panel maximum width in the
|
|
1037
1019
|
handleSplitPanelMaxWidth function in the context.
|
|
1038
1020
|
*/
|
|
1039
|
-
.awsui_show-
|
|
1021
|
+
.awsui_show-tools_hyvsj_8eynx_1021:not(#\9) {
|
|
1040
1022
|
box-sizing: border-box;
|
|
1041
1023
|
padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-layout-toggle-padding-axl9jr, 20px);
|
|
1042
1024
|
/*
|
|
@@ -1044,7 +1026,7 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1044
1026
|
take control in responsive viewports.
|
|
1045
1027
|
*/
|
|
1046
1028
|
}
|
|
1047
|
-
@keyframes
|
|
1029
|
+
@keyframes awsui_showButtons_hyvsj_8eynx_1 {
|
|
1048
1030
|
0% {
|
|
1049
1031
|
opacity: 0;
|
|
1050
1032
|
}
|
|
@@ -1052,33 +1034,33 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1052
1034
|
opacity: 1;
|
|
1053
1035
|
}
|
|
1054
1036
|
}
|
|
1055
|
-
.awsui_show-
|
|
1037
|
+
.awsui_show-tools_hyvsj_8eynx_1021:not(#\9):not(.awsui_has-tools-form_hyvsj_8eynx_999) {
|
|
1056
1038
|
display: none;
|
|
1057
1039
|
}
|
|
1058
1040
|
@media (min-width: 689px) {
|
|
1059
|
-
.awsui_show-
|
|
1041
|
+
.awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999:not(#\9) {
|
|
1060
1042
|
display: flex;
|
|
1061
1043
|
flex-direction: column;
|
|
1062
1044
|
gap: var(--space-xs-rsr2qu, 8px);
|
|
1063
1045
|
}
|
|
1064
|
-
.awsui_show-
|
|
1065
|
-
animation:
|
|
1046
|
+
.awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
1047
|
+
animation: awsui_showButtons_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
|
|
1066
1048
|
}
|
|
1067
1049
|
}
|
|
1068
1050
|
@media (min-width: 689px) and (prefers-reduced-motion: reduce) {
|
|
1069
|
-
.awsui_show-
|
|
1051
|
+
.awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
1070
1052
|
animation: none;
|
|
1071
1053
|
transition: none;
|
|
1072
1054
|
}
|
|
1073
1055
|
}
|
|
1074
1056
|
@media (min-width: 689px) {
|
|
1075
|
-
.awsui-motion-disabled .awsui_show-
|
|
1057
|
+
.awsui-motion-disabled .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9) {
|
|
1076
1058
|
animation: none;
|
|
1077
1059
|
transition: none;
|
|
1078
1060
|
}
|
|
1079
1061
|
}
|
|
1080
1062
|
@media (min-width: 689px) {
|
|
1081
|
-
.awsui_show-
|
|
1063
|
+
.awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form-persistence_hyvsj_8eynx_999:not(#\9) {
|
|
1082
1064
|
background-color: var(--color-background-container-content-i8i4a0, #ffffff);
|
|
1083
1065
|
z-index: 1;
|
|
1084
1066
|
}
|
|
@@ -1093,7 +1075,7 @@ Warning! If these design tokens for width change it will adversely impact
|
|
|
1093
1075
|
the calculation used to determine the Split Panel maximum width in the
|
|
1094
1076
|
handleSplitPanelMaxWidth function in the context.
|
|
1095
1077
|
*/
|
|
1096
|
-
.
|
|
1078
|
+
.awsui_trigger_hyvsj_8eynx_1078:not(#\9) {
|
|
1097
1079
|
background: var(--color-background-layout-toggle-default-f9hnkv, #192534);
|
|
1098
1080
|
border: none;
|
|
1099
1081
|
border-radius: 50%;
|
|
@@ -1105,14 +1087,14 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1105
1087
|
width: var(--space-layout-toggle-diameter-hzvqtj, 40px);
|
|
1106
1088
|
pointer-events: auto;
|
|
1107
1089
|
}
|
|
1108
|
-
.
|
|
1090
|
+
.awsui_trigger_hyvsj_8eynx_1078[data-awsui-focus-visible=true]:not(#\9):focus {
|
|
1109
1091
|
position: relative;
|
|
1110
1092
|
}
|
|
1111
|
-
.
|
|
1093
|
+
.awsui_trigger_hyvsj_8eynx_1078[data-awsui-focus-visible=true]:not(#\9):focus {
|
|
1112
1094
|
outline: 2px dotted transparent;
|
|
1113
1095
|
outline-offset: calc(3px - 1px);
|
|
1114
1096
|
}
|
|
1115
|
-
.
|
|
1097
|
+
.awsui_trigger_hyvsj_8eynx_1078[data-awsui-focus-visible=true]:not(#\9):focus::before {
|
|
1116
1098
|
content: " ";
|
|
1117
1099
|
display: block;
|
|
1118
1100
|
position: absolute;
|
|
@@ -1123,23 +1105,23 @@ handleSplitPanelMaxWidth function in the context.
|
|
|
1123
1105
|
border-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
|
|
1124
1106
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
|
|
1125
1107
|
}
|
|
1126
|
-
.
|
|
1108
|
+
.awsui_trigger_hyvsj_8eynx_1078:not(#\9):focus {
|
|
1127
1109
|
outline: none;
|
|
1128
1110
|
}
|
|
1129
|
-
.
|
|
1111
|
+
.awsui_trigger_hyvsj_8eynx_1078:not(#\9):hover {
|
|
1130
1112
|
background: var(--color-background-layout-toggle-hover-gi0e0b, #354150);
|
|
1131
1113
|
}
|
|
1132
|
-
.
|
|
1114
|
+
.awsui_trigger_hyvsj_8eynx_1078:not(#\9):active {
|
|
1133
1115
|
background: var(--color-background-layout-toggle-active-d15dki, #354150);
|
|
1134
1116
|
}
|
|
1135
|
-
.
|
|
1117
|
+
.awsui_trigger_hyvsj_8eynx_1078.awsui_selected_hyvsj_8eynx_1117:not(#\9) {
|
|
1136
1118
|
background: var(--color-background-layout-toggle-selected-default-e1giv3, #0972d3);
|
|
1137
1119
|
color: var(--color-text-layout-toggle-selected-tzwifo, #ffffff);
|
|
1138
1120
|
}
|
|
1139
|
-
.
|
|
1121
|
+
.awsui_trigger_hyvsj_8eynx_1078.awsui_selected_hyvsj_8eynx_1117:not(#\9):hover {
|
|
1140
1122
|
background: var(--color-background-layout-toggle-selected-hover-mes33s, #065299);
|
|
1141
1123
|
}
|
|
1142
|
-
.
|
|
1124
|
+
.awsui_trigger_hyvsj_8eynx_1078.awsui_selected_hyvsj_8eynx_1117:not(#\9):active {
|
|
1143
1125
|
background: var(--color-background-layout-toggle-selected-active-9w7pk3, #0972d3);
|
|
1144
1126
|
}
|
|
1145
1127
|
|