From 22445dd991cb52835c4728332f4ce1e2de04b21f Mon Sep 17 00:00:00 2001
From: Abhishek Reddy <62020972+AbhishekReddy1127@users.noreply.github.com>
Date: Sun, 26 Feb 2023 17:48:03 -0600
Subject: [PATCH] Updated the content and Icons in the section
 CssUtilityClasses (#368)

Signed-off-by: AbhishekReddy1127 <nallamsa@amazon.com>
---
 .../utility_classes_overflow.js               | 59 +++++++++++--------
 .../utility_classes/utility_classes_text.js   |  2 +-
 .../utility_classes_vert_align.js             | 38 +++---------
 3 files changed, 42 insertions(+), 57 deletions(-)

diff --git a/src-docs/src/views/utility_classes/utility_classes_overflow.js b/src-docs/src/views/utility_classes/utility_classes_overflow.js
index 1c7a3b8b53..02ef2141c8 100644
--- a/src-docs/src/views/utility_classes/utility_classes_overflow.js
+++ b/src-docs/src/views/utility_classes/utility_classes_overflow.js
@@ -61,22 +61,25 @@ export default () => (
             size="s"
             style={{ padding: 16 }}>
             <p>
-              Orbiting this at a distance of roughly ninety-two million miles is
-              an utterly insignificant little blue green planet whose
-              ape-descended life forms are so amazingly primitive that they
-              still think digital watches are a pretty neat idea.
+              Vestibulum ipsum ipsum, dapibus iaculis rutrum sed, ullamcorper
+              eget nibh. Donec ligula orci, vestibulum eget lacus eget, luctus
+              feugiat sapien. Aliquam et elementum ante. Donec malesuada tellus
+              sit amet lorem convallis, et convallis massa suscipit. Nullam
+              dolor libero, placerat ac mi at, ultrices scelerisque neque
             </p>
             <p>
-              Orbiting this at a distance of roughly ninety-two million miles is
-              an utterly insignificant little blue green planet whose
-              ape-descended life forms are so amazingly primitive that they
-              still think digital watches are a pretty neat idea.
+              Vestibulum ipsum ipsum, dapibus iaculis rutrum sed, ullamcorper
+              eget nibh. Donec ligula orci, vestibulum eget lacus eget, luctus
+              feugiat sapien. Aliquam et elementum ante. Donec malesuada tellus
+              sit amet lorem convallis, et convallis massa suscipit. Nullam
+              dolor libero, placerat ac mi at, ultrices scelerisque neque
             </p>
             <p>
-              Orbiting this at a distance of roughly ninety-two million miles is
-              an utterly insignificant little blue green planet whose
-              ape-descended life forms are so amazingly primitive that they
-              still think digital watches are a pretty neat idea.
+              Vestibulum ipsum ipsum, dapibus iaculis rutrum sed, ullamcorper
+              eget nibh. Donec ligula orci, vestibulum eget lacus eget, luctus
+              feugiat sapien. Aliquam et elementum ante. Donec malesuada tellus
+              sit amet lorem convallis, et convallis massa suscipit. Nullam
+              dolor libero, placerat ac mi at, ultrices scelerisque neque
             </p>
           </OuiText>
         </OuiPanel>
@@ -117,10 +120,12 @@ export default () => (
           <div tabIndex={0} className="oui-xScrollWithShadows">
             <OuiText size="s" style={{ width: '150%', padding: 16 }}>
               <p>
-                Orbiting this at a distance of roughly ninety-two million miles
-                is an utterly insignificant little blue green planet whose
-                ape-descended life forms are so amazingly primitive that they
-                still think digital watches are a pretty neat idea.
+                Vestibulum ipsum ipsum, dapibus iaculis rutrum sed, ullamcorper
+                eget nibh. Donec ligula orci, vestibulum eget lacus eget, luctus
+                feugiat sapien. Aliquam et elementum ante. Donec malesuada
+                tellus sit amet lorem convallis, et convallis massa suscipit.
+                Nullam dolor libero, placerat ac mi at, ultrices scelerisque
+                neque.
               </p>
             </OuiText>
           </div>
@@ -166,11 +171,12 @@ export default () => (
               <OuiPanel className="oui-yScroll" color="warning" tabIndex="0">
                 <OuiText size="s">
                   <p>
-                    Orbiting this at a distance of roughly ninety-two million
-                    miles is an utterly insignificant little blue green planet
-                    whose ape-descended life forms are so amazingly primitive
-                    that they still think digital watches are a pretty neat
-                    idea.
+                    Vestibulum ipsum ipsum, dapibus iaculis rutrum sed,
+                    ullamcorper eget nibh. Donec ligula orci, vestibulum eget
+                    lacus eget, luctus feugiat sapien. Aliquam et elementum
+                    ante. Donec malesuada tellus sit amet lorem convallis, et
+                    convallis massa suscipit. Nullam dolor libero, placerat ac
+                    mi at, ultrices scelerisque neque.
                   </p>
                 </OuiText>
               </OuiPanel>
@@ -179,11 +185,12 @@ export default () => (
               <OuiPanel className="oui-yScroll" color="warning" tabIndex="0">
                 <OuiText size="s">
                   <p>
-                    Orbiting this at a distance of roughly ninety-two million
-                    miles is an utterly insignificant little blue green planet
-                    whose ape-descended life forms are so amazingly primitive
-                    that they still think digital watches are a pretty neat
-                    idea.
+                    Vestibulum ipsum ipsum, dapibus iaculis rutrum sed,
+                    ullamcorper eget nibh. Donec ligula orci, vestibulum eget
+                    lacus eget, luctus feugiat sapien. Aliquam et elementum
+                    ante. Donec malesuada tellus sit amet lorem convallis, et
+                    convallis massa suscipit. Nullam dolor libero, placerat ac
+                    mi at, ultrices scelerisque neque.
                   </p>
                 </OuiText>
               </OuiPanel>
diff --git a/src-docs/src/views/utility_classes/utility_classes_text.js b/src-docs/src/views/utility_classes/utility_classes_text.js
index 49b1857f78..ec2deefa53 100644
--- a/src-docs/src/views/utility_classes/utility_classes_text.js
+++ b/src-docs/src/views/utility_classes/utility_classes_text.js
@@ -20,7 +20,7 @@ import {
 import { UtilityClassesSection } from './utility_classes_section';
 
 const longLink =
-  'http://www.hithereimalongurl.com/dave_will_just_ramble_on_in_a_long_sentence_like_this/?ok=cool';
+  'https://playground.opensearch.org/app/dashboards#/list?_g=(filters:!(),refreshInterval:(pause:!t,value:0),time:(from:now-15m,to:now))';
 
 const wrappingExampleStyle = {
   background: 'rgba(254, 228, 181, 0.5)',
diff --git a/src-docs/src/views/utility_classes/utility_classes_vert_align.js b/src-docs/src/views/utility_classes/utility_classes_vert_align.js
index 135775c19e..16956a6435 100644
--- a/src-docs/src/views/utility_classes/utility_classes_vert_align.js
+++ b/src-docs/src/views/utility_classes/utility_classes_vert_align.js
@@ -26,15 +26,11 @@ export default () => (
       }
       example={
         <p>
-          <OuiIcon
-            type="logoElasticStack"
-            size="xxl"
-            className="oui-alignTop"
-          />
+          <OuiIcon type="grid" size="xxl" className="oui-alignTop" />
           &emsp; Icon is aligned to the top of the text
         </p>
       }
-      snippet={'<OuiIcon className="oui-alignTop" type="logoElasticStack" />'}
+      snippet={'<OuiIcon className="oui-alignTop" type="grid" />'}
     />
     <OuiSpacer />
     <UtilityClassesSection
@@ -47,17 +43,11 @@ export default () => (
       }
       example={
         <p>
-          <OuiIcon
-            type="logoElasticStack"
-            size="xxl"
-            className="oui-alignMiddle"
-          />
+          <OuiIcon type="grid" size="xxl" className="oui-alignMiddle" />
           &emsp; Icon is aligned to the middle of the text
         </p>
       }
-      snippet={
-        '<OuiIcon className="oui-alignMiddle" type="logoElasticStack" />'
-      }
+      snippet={'<OuiIcon className="oui-alignMiddle" type="grid" />'}
     />
     <OuiSpacer />
     <UtilityClassesSection
@@ -70,17 +60,11 @@ export default () => (
       }
       example={
         <p>
-          <OuiIcon
-            type="logoElasticStack"
-            size="xxl"
-            className="oui-alignBottom"
-          />
+          <OuiIcon type="grid" size="xxl" className="oui-alignBottom" />
           &emsp; Icon is aligned to the bottom of the text
         </p>
       }
-      snippet={
-        '<OuiIcon className="oui-alignBottom" type="logoElasticStack" />'
-      }
+      snippet={'<OuiIcon className="oui-alignBottom" type="grid" />'}
     />
     <OuiSpacer />
     <UtilityClassesSection
@@ -93,17 +77,11 @@ export default () => (
       }
       example={
         <p>
-          <OuiIcon
-            type="logoElasticStack"
-            size="xxl"
-            className="oui-alignBaseline"
-          />
+          <OuiIcon type="grid" size="xxl" className="oui-alignBaseline" />
           &emsp; Icon is aligned to the baseline of the text
         </p>
       }
-      snippet={
-        '<OuiIcon className="oui-alignBaseline" type="logoElasticStack" />'
-      }
+      snippet={'<OuiIcon className="oui-alignBaseline" type="grid" />'}
     />
   </>
 );