-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Deploying to gh-pages from @ 7a39ef6 🚀
- Loading branch information
1 parent
f924971
commit ec697e5
Showing
19 changed files
with
2,014 additions
and
1,843 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -31,110 +31,122 @@ | |
| <section class="docs-Section"> | ||
| <h2 class="docs-Heading">Alert Colors</h2> | ||
|
|
||
| <div class="Alert Alert--success mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#check-plain" /> | ||
| </svg> | ||
| <div>We sent you an activation link to email <strong>[email protected]</strong>. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| <div class="docs-Stack docs-Stack--stretch"> | ||
|
|
||
| <div class="Alert Alert--informative mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#info" /> | ||
| </svg> | ||
| <div> | ||
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia | ||
| perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis | ||
| provident unde. Eveniet, iste, molestiae? See <a href="#" class="link-underlined">FAQ</a> for more info. | ||
| <div class="Alert Alert--success" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#check-plain" /> | ||
| </svg> | ||
| <div>We sent you an activation link to email <strong>[email protected]</strong>. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--warning mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div><strong>Warning!</strong> Data update failed due to missing internet connection. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| <div class="Alert Alert--informative" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#info" /> | ||
| </svg> | ||
| <div> | ||
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia | ||
| perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis | ||
| provident unde. Eveniet, iste, molestiae? See <a href="./" class="link-underlined">FAQ</a> for more info. | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--warning" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div><strong>Warning!</strong> Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--danger" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div>Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--danger mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div>Data update failed due to missing internet connection. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| </section> | ||
|
|
||
| <section class="docs-Section"> | ||
| <h2 class="docs-Heading">Alert Centered</h2> | ||
|
|
||
| <div class="Alert Alert--success Alert--center mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#check-plain" /> | ||
| </svg> | ||
| <div>We sent you an activation link to email <strong>[email protected]</strong>. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| <div class="docs-Stack docs-Stack--stretch"> | ||
|
|
||
| <div class="Alert Alert--informative Alert--center mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#info" /> | ||
| </svg> | ||
| <div> | ||
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia | ||
| perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis | ||
| provident unde. Eveniet, iste, molestiae? See <a href="#" class="link-underlined">FAQ</a> for more info. | ||
| <div class="Alert Alert--success Alert--center" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#check-plain" /> | ||
| </svg> | ||
| <div>We sent you an activation link to email <strong>[email protected]</strong>. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--warning Alert--center mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div><strong>Warning!</strong> Data update failed due to missing internet connection. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| <div class="Alert Alert--informative Alert--center" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#info" /> | ||
| </svg> | ||
| <div> | ||
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia | ||
| perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis | ||
| provident unde. Eveniet, iste, molestiae? See <a href="./" class="link-underlined">FAQ</a> for more info. | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--warning Alert--center" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div><strong>Warning!</strong> Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--danger Alert--center" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div>Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--danger Alert--center" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div>Data update failed due to missing internet connection. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| </section> | ||
|
|
||
| <section class="docs-Section"> | ||
| <h2 class="docs-Heading">Alert Icons</h2> | ||
|
|
||
| <div class="Alert Alert--success mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#profile" /> | ||
| </svg> | ||
| <div>We sent you an activation link to email <strong>[email protected]</strong>. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| <div class="docs-Stack docs-Stack--stretch"> | ||
|
|
||
| <div class="Alert Alert--informative mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#info" /> | ||
| </svg> | ||
| <div> | ||
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia | ||
| perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis | ||
| provident unde. Eveniet, iste, molestiae? See <a href="#" class="link-underlined">FAQ</a> for more info. | ||
| <div class="Alert Alert--success" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#profile" /> | ||
| </svg> | ||
| <div>We sent you an activation link to email <strong>[email protected]</strong>. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--warning mb-600" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div><strong>Warning!</strong> Data update failed due to missing internet connection. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
| <div class="Alert Alert--informative" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#info" /> | ||
| </svg> | ||
| <div> | ||
| Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia | ||
| perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis | ||
| provident unde. Eveniet, iste, molestiae? See <a href="./" class="link-underlined">FAQ</a> for more info. | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--warning" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#warning" /> | ||
| </svg> | ||
| <div><strong>Warning!</strong> Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--danger" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#close" /> | ||
| </svg> | ||
| <div>Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| <div class="Alert Alert--danger" role="alert"> | ||
| <svg class="Icon" width="24" height="24"> | ||
| <use xlink:href="/spirit-design-system/icons/svg/sprite.svg#close" /> | ||
| </svg> | ||
| <div>Data update failed due to missing internet connection. See <a href="#" class="link-underlined">FAQ</a> for more info.</div> | ||
| </div> | ||
|
|
||
| </section> | ||
|
|
||
Oops, something went wrong.