Skip to content

fix/remove the data-centered attribute in toastDetails #836

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

fix/remove the data-centered attribute in toastDetails #836

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
56a4e8c
fix(toastDetails): remove data-centered property
zheng-xiaoyang Jul 29, 2025
98fdcb7
fix(toastDetails): remove data-centered property
zheng-xiaoyang Jul 29, 2025
112b47e
fix(toastDetails): remove data-centered property
zheng-xiaoyang Jul 29, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 0 additions & 9 deletions src/components/Toast/Toast.unit.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -134,7 +134,6 @@ exports[`<Toast /> snapshot should match snapshot 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -664,7 +663,6 @@ exports[`<Toast /> snapshot should match snapshot with aria-live 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -1193,7 +1191,6 @@ exports[`<Toast /> snapshot should match snapshot with className 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -1678,7 +1675,6 @@ exports[`<Toast /> snapshot should match snapshot with content children and deta
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -2151,7 +2147,6 @@ exports[`<Toast /> snapshot should match snapshot with details and content child
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -2667,7 +2662,6 @@ exports[`<Toast /> snapshot should match snapshot with details children and cont
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -3197,7 +3191,6 @@ exports[`<Toast /> snapshot should match snapshot with id 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -3735,7 +3728,6 @@ exports[`<Toast /> snapshot should match snapshot with style 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down Expand Up @@ -4451,7 +4443,6 @@ exports[`<Toast /> snapshot should match snapshot with title 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
>
Details Title
</div>
Expand Down
12 changes: 6 additions & 6 deletions src/components/ToastDetails/ToastDetails.style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,12 @@
> .md-toast-details-title {
font-size: 1rem;
margin-bottom: 0;

&[data-centered='true'] {
align-items: center;
display: flex;
height: 2rem;
}
display: inline-block;
width: 100%;
height: 1.5rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

> .md-toast-details-subject {
Expand Down
4 changes: 1 addition & 3 deletions src/components/ToastDetails/ToastDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,9 +47,7 @@ const ToastDetails: FC<Props> = (props: Props) => {

const contentComponent = (
<div className={STYLE.content}>
<div className={STYLE.title} data-centered={!(badges || info || subject)}>
{title || children}
</div>
<div className={STYLE.title}>{title || children}</div>
{subject ? <div className={STYLE.subject}>{subject}</div> : null}
{info || badges ? infoComponent : null}
</div>
Expand Down
13 changes: 0 additions & 13 deletions src/components/ToastDetails/ToastDetails.unit.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,6 @@ exports[`<ToastDetails /> snapshot should match snapshot 1`] = `
>
<div
className="md-toast-details-title"
data-centered={true}
/>
</div>
</div>
Expand Down Expand Up @@ -100,7 +99,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with badges 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
/>
<div
className="md-toast-details-badges"
Expand Down Expand Up @@ -172,7 +170,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with children 1`] = `
>
<div
className="md-toast-details-title"
data-centered={true}
>
Children
</div>
Expand Down Expand Up @@ -225,7 +222,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with className 1`] = `
>
<div
className="md-toast-details-title"
data-centered={true}
/>
</div>
</div>
Expand Down Expand Up @@ -292,7 +288,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with complete props 1`]
>
<div
className="md-toast-details-title"
data-centered={false}
>
Title
</div>
Expand Down Expand Up @@ -574,7 +569,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with complete props and
>
<div
className="md-toast-details-title"
data-centered={false}
>
Title
</div>
Expand Down Expand Up @@ -856,7 +850,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with controls 1`] = `
>
<div
className="md-toast-details-title"
data-centered={true}
/>
</div>
<div
Expand Down Expand Up @@ -1104,7 +1097,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with id 1`] = `
>
<div
className="md-toast-details-title"
data-centered={true}
/>
</div>
</div>
Expand Down Expand Up @@ -1155,7 +1147,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with info 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
/>
<div
className="md-toast-details-info"
Expand Down Expand Up @@ -1212,7 +1203,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with infoColor 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
/>
<div
className="md-toast-details-info"
Expand Down Expand Up @@ -1278,7 +1268,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with style 1`] = `
>
<div
className="md-toast-details-title"
data-centered={true}
/>
</div>
</div>
Expand Down Expand Up @@ -1329,7 +1318,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with subject 1`] = `
>
<div
className="md-toast-details-title"
data-centered={false}
/>
<div
className="md-toast-details-subject"
Expand Down Expand Up @@ -1385,7 +1373,6 @@ exports[`<ToastDetails /> snapshot should match snapshot with title 1`] = `
>
<div
className="md-toast-details-title"
data-centered={true}
>
Title
</div>
Expand Down
Loading