diff --git a/src/stories/charts/sentiment/index.tsx b/src/stories/charts/sentiment/index.tsx
index 853d8f04..01f58334 100644
--- a/src/stories/charts/sentiment/index.tsx
+++ b/src/stories/charts/sentiment/index.tsx
@@ -21,6 +21,7 @@ const Point = styled.g`
 const ScrollingContainer = styled.div`
   width: 100%;
   overflow-x: scroll;
+  -webkit-overflow-scrolling: touch;
 `;
 
 const SentimentContainer = styled(ChartContainer)`
@@ -93,7 +94,7 @@ const formatAxisX = (value: DatumValue) => {
   //Print only the first 10 characters
   return (
     <>
-      {value.toString().length > 15 ? value.toString().substring(0, 15) + "..." : value.toString()}
+      {value.toString().length > 20 ? value.toString().substring(0, 20) + "..." : value.toString()}
       <title>{value as string}</title>
     </>
   );
diff --git a/src/stories/modals/index.tsx b/src/stories/modals/index.tsx
index 2e39249f..0a0cd537 100644
--- a/src/stories/modals/index.tsx
+++ b/src/stories/modals/index.tsx
@@ -16,6 +16,12 @@ const UgModalBody = styled(ModalBody)`
 
 const UgModal = styled(ZendeskModal)<ModalArgs>`
   ${({ isExtraLarge }) => isExtraLarge && "height: 90%; width: 90%;"}
+
+  @media (max-width: ${({ theme }) => theme.breakpoints.sm}) {
+    top: 0;
+    height: 100%;
+    width: 100%;
+  }
 `;
 
 const ModalComponent = forwardRef<HTMLDivElement, ModalArgs>((props, ref) => (
diff --git a/src/stories/notifications/index.tsx b/src/stories/notifications/index.tsx
index 71fafc73..edbe7f92 100644
--- a/src/stories/notifications/index.tsx
+++ b/src/stories/notifications/index.tsx
@@ -45,6 +45,7 @@ const UgNotification = styled(ZendeskNotification)<NotificationArgs>`
   align-items: center;
   justify-content: space-between;
   padding-right: ${({ theme }) => theme.space.md};
+  white-space: pre;
 
   ${UgAnchor} {
     flex-shrink: 0;