Skip to content

Commit 8b79f9a

Browse files
chore(dialog,modal): creates changeset
1 parent de8c5ef commit 8b79f9a

File tree

2 files changed

+19
-2
lines changed

2 files changed

+19
-2
lines changed

.changeset/modern-chairs-sit.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
---
2+
"@spectrum-css/dialog": major
3+
"@spectrum-css/modal": minor
4+
---
5+
6+
S2 Takeover dialog
7+
8+
This is the migration for the fullscreen/fullscreenTakeover dialog stories (in Figma, these stories are called "takeover dialog"). The Divider component support was removed in S2 standard dialog migration ([#2860](https://github.com/adobe/spectrum-css/pull/2860)). New and updated tokens are in place to update dialog corner rounding, some font sizes, spacing/padding, and maximum/minimum widths. Fullscreen/fullscreenTakeover dialogs do not support additional footer content or checkboxes (in comparison to the standard dialog).
9+
10+
_New Mods_
11+
`--mod-takeover-dialog-spacing-grid-padding`
12+
`--mod-takeover-dialog-spacing-header-gap`
13+
`--mod-takeover-dialog-title-font-size`
14+
15+
Modal updates
16+
17+
- Modal component now uses the updated margin (window-to-edge) found in the takeover dialog design specs.

components/dialog/stories/dialog.stories.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -257,7 +257,7 @@ WithScroll.parameters = {
257257
that are imported above, but commented out.
258258
*/
259259
/**
260-
* The full screen variant shows a large dialog background, only revealing a small portion of the page around the outside of the dialog, behind an overlay. The size of the dialog varies with the size of the screen, in both width and height.
260+
* The fullscreen variant shows a large dialog background, only revealing a small portion of the page around the outside of the dialog, behind an overlay. The size of the dialog varies with the size of the screen, in both width and height.
261261
*/
262262
export const Fullscreen = Template.bind({});
263263
Fullscreen.argTypes = {
@@ -273,7 +273,7 @@ Fullscreen.parameters = {
273273
};
274274

275275
/**
276-
* The full screen takeover variant is similar to the full screen variant except that the background covers the entire screen. The page behind the dialog is not visible. This variant should be reserved for workflows where displaying a second dialog on top of the first one is to be expected.
276+
* The fullscreen takeover variant is similar to the full screen variant except that the background covers the entire screen. The page behind the dialog is not visible. This variant should be reserved for workflows where displaying a second dialog on top of the first one is to be expected.
277277
*/
278278
export const FullscreenTakeover = Template.bind({});
279279
FullscreenTakeover.storyName = "Fullscreen takeover";

0 commit comments

Comments
 (0)