Skip to content
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

fix: Replace old colors on Alerts page & stories #156

Merged
merged 1 commit into from
May 26, 2022
Merged

fix: Replace old colors on Alerts page & stories #156

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
14 changes: 7 additions & 7 deletions src/docs/pages/AlertsPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,20 +14,20 @@ const AlertsPage: FC = () => {
const examples: CodeExample[] = [
{
title: 'Default alert',
code: <Alert color="blue">{alertText}</Alert>,
code: <Alert color="info">{alertText}</Alert>,
},
{
title: 'Alerts with icon',
code: (
<Alert color="red" icon={HiInformationCircle}>
<Alert color="failure" icon={HiInformationCircle}>
{alertText}
</Alert>
),
},
{
title: 'Dismissible alerts',
code: (
<Alert color="green" onDismiss={() => alert('Alert dismissed!')}>
<Alert color="success" onDismiss={() => alert('Alert dismissed!')}>
{alertText}
</Alert>
),
Expand All @@ -36,15 +36,15 @@ const AlertsPage: FC = () => {
{
title: 'Rounded',
code: (
<Alert color="yellow" rounded={false}>
<Alert color="warning" rounded={false}>
{alertText}
</Alert>
),
},
{
title: 'Border accent',
code: (
<Alert color="yellow" withBorderAccent>
<Alert color="warning" withBorderAccent>
{alertText}
</Alert>
),
Expand All @@ -53,7 +53,7 @@ const AlertsPage: FC = () => {
title: 'Additional content',
code: (
<Alert
color="blue"
color="info"
additionalContent={
<>
<div className="mt-2 mb-4 text-sm text-blue-700 dark:text-blue-800">
Expand Down Expand Up @@ -87,7 +87,7 @@ const AlertsPage: FC = () => {
title: 'All options',
code: (
<Alert
color="green"
color="success"
rounded={false}
withBorderAccent
onDismiss={() => alert('Alert dismissed!')}
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/Alert/Alert.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ const TestAlert = (): JSX.Element => {
</div>
</>
}
color="blue"
color="info"
icon={HiInformationCircle}
onDismiss={() => setDismissed(!isDismissed)}
>
Expand Down
10 changes: 5 additions & 5 deletions src/lib/components/Alert/Alert.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,15 +38,15 @@ AlertWithIcons.args = {
export const AlertDismissible = Template.bind({});
AlertDismissible.storyName = 'Dismissible';
AlertDismissible.args = {
color: 'green',
color: 'success',
onDismiss: () => alert('Alert dismissed!'),
children: <>Info alert! Change a few things up and try submitting again.</>,
};

export const AlertRounded = Template.bind({});
AlertRounded.storyName = 'Not rounded';
AlertRounded.args = {
color: 'yellow',
color: 'warning',
rounded: false,
onDismiss: false,
children: <>Info alert! Change a few things up and try submitting again.</>,
Expand All @@ -55,7 +55,7 @@ AlertRounded.args = {
export const AlertWithBorderAccent = Template.bind({});
AlertWithBorderAccent.storyName = 'Border accent';
AlertWithBorderAccent.args = {
color: 'yellow',
color: 'warning',
onDismiss: false,
withBorderAccent: true,
children: <>Info alert! Change a few things up and try submitting again.</>,
Expand All @@ -64,7 +64,7 @@ AlertWithBorderAccent.args = {
export const AlertWithAdditionalContent = Template.bind({});
AlertWithAdditionalContent.storyName = 'Additional content';
AlertWithAdditionalContent.args = {
color: 'blue',
color: 'info',
icon: HiInformationCircle,
onDismiss: false,
withBorderAccent: true,
Expand Down Expand Up @@ -101,7 +101,7 @@ AlertWithAdditionalContent.args = {
export const AlertWithAllOptions = Template.bind({});
AlertWithAllOptions.storyName = 'All options';
AlertWithAllOptions.args = {
color: 'green',
color: 'success',
rounded: false,
withBorderAccent: true,
onDismiss: () => alert('Alert dismissed!'),
Expand Down