Docs(web): The alert role has been removed for Alert component #DS-1175

lmc-eu · May 10, 2024 · a1e56f5 · a1e56f5
1 parent b0e83cf
commit a1e56f5
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 20 deletions.
diff --git a/packages/web/src/scss/components/Alert/README.md b/packages/web/src/scss/components/Alert/README.md
@@ -3,14 +3,14 @@
 Variants:
 
 ```html
-<div class="Alert Alert--success mb-600" role="alert">
+<div class="Alert Alert--success mb-600">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#info" />
   </svg>
   <div>We sent you an activation link to email <strong>spirit@lmc.eu</strong>.</div>
 </div>
 
-<div class="Alert Alert--informative mb-600" role="alert">
+<div class="Alert Alert--informative mb-600">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#info" />
   </svg>
@@ -21,28 +21,28 @@ Variants:
   </div>
 </div>
 
-<div class="Alert Alert--warning mb-600" role="alert">
+<div class="Alert Alert--warning mb-600">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#warning" />
   </svg>
   <div><strong>Warning!</strong> Data update failed due to missing internet connection</div>
 </div>
 
-<div class="Alert Alert--danger mb-600" role="alert">
+<div class="Alert Alert--danger mb-600">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#close" />
   </svg>
   <div>Data update failed due to missing internet connection</div>
 </div>
 
-<div class="Alert Alert--success Alert--center mb-600" role="alert">
+<div class="Alert Alert--success Alert--center mb-600">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#info" />
   </svg>
   <div>We sent you an activation link to email <strong>spirit@lmc.eu</strong>.</div>
 </div>
 
-<div class="Alert Alert--informative Alert--center" role="alert">
+<div class="Alert Alert--informative Alert--center">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#info" />
   </svg>
@@ -53,14 +53,14 @@ Variants:
   </div>
 </div>
 
-<div class="Alert Alert--warning Alert--center mb-600" role="alert">
+<div class="Alert Alert--warning Alert--center mb-600">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#warning" />
   </svg>
   <div><strong>Warning!</strong> Data update failed due to missing internet connection</div>
 </div>
 
-<div class="Alert Alert--danger Alert--center mb-600" role="alert">
+<div class="Alert Alert--danger Alert--center mb-600">
   <svg width="24" height="24">
     <use xlink:href="/icons/svg/sprite.svg#close" />
   </svg>

diff --git a/packages/web/src/scss/components/Alert/index.html b/packages/web/src/scss/components/Alert/index.html
@@ -5,14 +5,14 @@ <h2 class="docs-Heading">Alert Colors</h2>
 
   <div class="docs-Stack docs-Stack--stretch">
 
-    <div class="Alert Alert--success" role="alert">
+    <div class="Alert Alert--success">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#check-plain" />
       </svg>
       <div>We sent you an activation link to email <strong>spirit@lmc.eu</strong>. See <a href="./" class="link-underlined">FAQ</a> for more info.</div>
     </div>
 
-    <div class="Alert Alert--informative" role="alert">
+    <div class="Alert Alert--informative">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#info" />
       </svg>
@@ -23,14 +23,14 @@ <h2 class="docs-Heading">Alert Colors</h2>
       </div>
     </div>
 
-    <div class="Alert Alert--warning" role="alert">
+    <div class="Alert Alert--warning">
       <svg width="24" height="24">
         <use xlink:href="/assets/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">
+    <div class="Alert Alert--danger">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#danger" />
       </svg>
@@ -46,14 +46,14 @@ <h2 class="docs-Heading">Alert Centered</h2>
 
   <div class="docs-Stack docs-Stack--stretch">
 
-    <div class="Alert Alert--success Alert--center" role="alert">
+    <div class="Alert Alert--success Alert--center">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#check-plain" />
       </svg>
       <div>We sent you an activation link to email <strong>spirit@lmc.eu</strong>. See <a href="./" class="link-underlined">FAQ</a> for more info.</div>
     </div>
 
-    <div class="Alert Alert--informative Alert--center" role="alert">
+    <div class="Alert Alert--informative Alert--center">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#info" />
       </svg>
@@ -64,14 +64,14 @@ <h2 class="docs-Heading">Alert Centered</h2>
       </div>
     </div>
 
-    <div class="Alert Alert--warning Alert--center" role="alert">
+    <div class="Alert Alert--warning Alert--center">
       <svg width="24" height="24">
         <use xlink:href="/assets/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">
+    <div class="Alert Alert--danger Alert--center">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#danger" />
       </svg>
@@ -87,14 +87,14 @@ <h2 class="docs-Heading">Alert Icons</h2>
 
   <div class="docs-Stack docs-Stack--stretch">
 
-    <div class="Alert Alert--success" role="alert">
+    <div class="Alert Alert--success">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#profile" />
       </svg>
       <div>We sent you an activation link to email <strong>spirit@lmc.eu</strong>. See <a href="./" class="link-underlined">FAQ</a> for more info.</div>
     </div>
 
-    <div class="Alert Alert--informative" role="alert">
+    <div class="Alert Alert--informative">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#info" />
       </svg>
@@ -105,14 +105,14 @@ <h2 class="docs-Heading">Alert Icons</h2>
       </div>
     </div>
 
-    <div class="Alert Alert--warning" role="alert">
+    <div class="Alert Alert--warning">
       <svg width="24" height="24">
         <use xlink:href="/assets/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">
+    <div class="Alert Alert--danger">
       <svg width="24" height="24">
         <use xlink:href="/assets/icons/svg/sprite.svg#close" />
       </svg>