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

Jump to bottom

feat(components): Update Alert component styles #2160

Merged
merged 4 commits into from
Aug 20, 2022
Merged

feat(components): Update Alert component styles #2160

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
0df20d8
test: Update snapshots
flacial Aug 6, 2022
006dad2
feat(components): Update Alert component styles
flacial Aug 6, 2022
4fe391c
Merge branch 'master' into 2145-broken-urgent-alert-message-background
flacial Aug 19, 2022
31d6653
Merge branch 'master' into 2145-broken-urgent-alert-message-background
flacial Aug 20, 2022
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
134 changes: 82 additions & 52 deletions __tests__/__snapshots__/storyshots.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -908,40 +908,48 @@ exports[`Storyshots Components/AdminLessonSideNav Basic 1`] = `

exports[`Storyshots Components/Alert Info 1`] = `
<div
className="alert d-flex justify-content-between mt-3 bg-primary text-white"
className="alert d-flex justify-content-between mt-3 alert alert-primary"
role="alert"
>
<div
className="d-flex gap-3"
className="d-flex align-items-center gap-3"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/icon-tip.svg"
width={24}
/>
<div
className="info_image"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/icon-tip.svg"
width={24}
/>
</div>
Set up your computer to submit challenges.
</div>
</div>
`;

exports[`Storyshots Components/Alert Info With Link And Dismiss 1`] = `
<div
className="alert d-flex justify-content-between mt-3 bg-primary text-white"
className="alert d-flex justify-content-between mt-3 alert alert-primary"
role="alert"
>
<div
className="d-flex gap-3"
className="d-flex align-items-center gap-3"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/icon-tip.svg"
width={24}
/>
<div
className="info_image"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/icon-tip.svg"
width={24}
/>
</div>
Set up your computer to submit challenges.
<a
className="text-white noUnderline"
className="alert-link noUnderline"
href="https://www.notion.so/JS-0-Foundations-a43ca620e54945b2b620bcda5f3cf672#b45ed85a95e24c9d9fb784afb7a46bcc"
rel="noopener noreferrer"
target="_blank"
Expand All @@ -950,54 +958,65 @@ exports[`Storyshots Components/Alert Info With Link And Dismiss 1`] = `
</a>
</div>
<button
className="alert-dismiss"
className="info_image alert-dismiss"
data-testid="dismiss-info"
onClick={[Function]}
role="dismiss"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/dismiss-info.svg"
width={24}
/>
</button>
</div>
`;

exports[`Storyshots Components/Alert Urgent 1`] = `
<div
className="alert d-flex justify-content-between mt-3 alert-danger"
className="alert d-flex justify-content-between mt-3 alert alert-danger"
role="alert"
>
<div
className="d-flex gap-3"
className="d-flex align-items-center gap-3"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
<div
className=""
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
</div>
Invalid password
</div>
</div>
`;

exports[`Storyshots Components/Alert Urgent With Icon And Dismiss 1`] = `
<div
className="alert d-flex justify-content-between mt-3 alert-danger"
className="alert d-flex justify-content-between mt-3 alert alert-danger"
role="alert"
>
<div
className="d-flex gap-3"
className="d-flex align-items-center gap-3"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
<div
className=""
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
</div>
Please upgrade your CLI client by running npm update c0d3.
<a
className="text-danger noUnderline"
className="alert-link noUnderline"
href="https://www.npmjs.com/package/c0d3"
rel="noopener noreferrer"
target="_blank"
Expand All @@ -1006,13 +1025,16 @@ exports[`Storyshots Components/Alert Urgent With Icon And Dismiss 1`] = `
</a>
</div>
<button
className="alert-dismiss"
className=" alert-dismiss"
data-testid="dismiss-urgent"
onClick={[Function]}
role="dismiss"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/dismiss-urgent.svg"
width={24}
/>
</button>
</div>
Expand Down Expand Up @@ -28058,18 +28080,22 @@ exports[`Storyshots Pages/Login Login Error 1`] = `
className="form-group"
>
<div
className="alert d-flex justify-content-between mt-3 alert-danger"
className="alert d-flex justify-content-between mt-3 alert alert-danger"
role="alert"
>
<div
className="d-flex gap-3"
className="d-flex align-items-center gap-3"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
<div
className=""
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
</div>
Please try again!
</div>
</div>
Expand Down Expand Up @@ -28531,18 +28557,22 @@ exports[`Storyshots Pages/Signup Signup Errors 1`] = `
className="card-text"
/>
<div
className="alert d-flex justify-content-between mt-3 alert-danger"
className="alert d-flex justify-content-between mt-3 alert alert-danger"
role="alert"
>
<div
className="d-flex gap-3"
className="d-flex align-items-center gap-3"
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
<div
className=""
>
<img
className="img-fluid"
height={24}
src="/assets/curriculum/icons/exclamation.svg"
width={24}
/>
</div>
UserInput Error: User does not exist
</div>
</div>
Expand Down
18 changes: 11 additions & 7 deletions __tests__/pages/__snapshots__/login.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,17 +27,21 @@ exports[`Login Page Should set alert visible on invalid credentials 1`] = `
class="form-group"
>
<div
class="alert d-flex justify-content-between mt-3 alert-danger"
class="alert d-flex justify-content-between mt-3 alert alert-danger"
role="alert"
>
<div
class="d-flex gap-3"
class="d-flex align-items-center gap-3"
>
<img
height="24"
src="/assets/curriculum/icons/exclamation.svg"
width="24"
/>
<div
class=""
>
<img
height="24"
src="/assets/curriculum/icons/exclamation.svg"
width="24"
/>
</div>
User does not exist!
</div>
</div>
Expand Down
18 changes: 11 additions & 7 deletions __tests__/pages/__snapshots__/signup.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,17 +20,21 @@ exports[`Signup Page Should render errors on fail 1`] = `
class="card-text"
/>
<div
class="alert d-flex justify-content-between mt-3 alert-danger"
class="alert d-flex justify-content-between mt-3 alert alert-danger"
role="alert"
>
<div
class="d-flex gap-3"
class="d-flex align-items-center gap-3"
>
<img
height="24"
src="/assets/curriculum/icons/exclamation.svg"
width="24"
/>
<div
class=""
>
<img
height="24"
src="/assets/curriculum/icons/exclamation.svg"
width="24"
/>
</div>
Server Error: Server cannot be reached. Please try again. If this problem persists, please send an email to support@c0d3.com
</div>
</div>
Expand Down
Loading