Skip to content

Commit

Permalink
Merge pull request #2160 from flacial/2145-broken-urgent-alert-messag…
Browse files Browse the repository at this point in the history 
…e-background

feat(components): Update Alert component styles
  • Loading branch information
@flacial
flacial authored Aug 20, 2022
2 parents 06cb15d + 31d6653 commit 14b9a56
Show file tree
Hide file tree
Showing 7 changed files with 221 additions and 133 deletions.
134 changes: 82 additions & 52 deletions __tests__/__snapshots__/storyshots.test.js.snap
View file
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
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
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

1 comment on commit 14b9a56

@vercel
Copy link

@vercel vercel bot commented on 14b9a56 Aug 20, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

c0d3-app – ./

c0d3-app-git-master-c0d3-prod.vercel.app
c0d3-app-c0d3-prod.vercel.app
v2.c0d3.app
c0d3-app.vercel.app
www.c0d3.com

Please sign in to comment.