From faac62c2961aec7536a57825f91a14117e27c731 Mon Sep 17 00:00:00 2001
From: Federico Iseppon
 <100614752+federicoisepponfincons@users.noreply.github.com>
Date: Mon, 28 Aug 2023 11:31:05 +0200
Subject: [PATCH] fix: subtitles

---
 ...search-overlay-instant-results.stories.tsx | 45 ++++++++++++-------
 .../pages/search-overlay/search-overlay.scss  |  1 +
 2 files changed, 31 insertions(+), 15 deletions(-)

diff --git a/src/storybook/pages/search-overlay/search-overlay-instant-results.stories.tsx b/src/storybook/pages/search-overlay/search-overlay-instant-results.stories.tsx
index 485632eaa5a..237a24df407 100644
--- a/src/storybook/pages/search-overlay/search-overlay-instant-results.stories.tsx
+++ b/src/storybook/pages/search-overlay/search-overlay-instant-results.stories.tsx
@@ -105,24 +105,36 @@ const Template = (args): JSX.Element => (
             </sbb-form-field>
             <div class="search-result__wrapper">
               <a href="http://www.sbb.ch/" class="search-result-item">
-                <sbb-title visual-level="6" negative>
-                  Result title 1<span class="subtitle">Lorem ipsum subtitle</span>
-                </sbb-title>
+                <div>
+                  <sbb-title visual-level="6" negative>
+                    Result title 1
+                  </sbb-title>
+                  <p class="subtitle">Lorem ipsum subtitle</p>
+                </div>
               </a>
               <a href="http://www.sbb.ch/" class="search-result-item">
-                <sbb-title visual-level="6" negative>
-                  Result title 2<span class="subtitle">Lorem ipsum subtitle</span>
-                </sbb-title>
+                <div>
+                  <sbb-title visual-level="6" negative>
+                    Result title 2
+                  </sbb-title>
+                  <p class="subtitle">Lorem ipsum subtitle</p>
+                </div>
               </a>
               <a href="http://www.sbb.ch/" class="search-result-item">
-                <sbb-title visual-level="6" negative>
-                  Result title 3<span class="subtitle">Lorem ipsum subtitle</span>
-                </sbb-title>
+                <div>
+                  <sbb-title visual-level="6" negative>
+                    Result title 3
+                  </sbb-title>
+                  <p class="subtitle">Lorem ipsum subtitle</p>
+                </div>
               </a>
               <a href="http://www.sbb.ch/" class="search-result-item">
-                <sbb-title visual-level="6" negative>
-                  Result title 4<span class="subtitle">Lorem ipsum subtitle</span>
-                </sbb-title>
+                <div>
+                  <sbb-title visual-level="6" negative>
+                    Result title 3
+                  </sbb-title>
+                  <p class="subtitle">Lorem ipsum subtitle</p>
+                </div>
                 <div class="result-image">
                   <img
                     alt="example"
@@ -131,9 +143,12 @@ const Template = (args): JSX.Element => (
                 </div>
               </a>
               <a href="http://www.sbb.ch/" class="search-result-item">
-                <sbb-title visual-level="6" negative>
-                  Result title 5<span class="subtitle">Lorem ipsum subtitle</span>
-                </sbb-title>
+                <div>
+                  <sbb-title visual-level="6" negative>
+                    Result title 5
+                  </sbb-title>
+                  <p class="subtitle">Lorem ipsum subtitle</p>
+                </div>
               </a>
               <div class="show-more">
                 <sbb-button variant="primary">Show all 13 results</sbb-button>
diff --git a/src/storybook/pages/search-overlay/search-overlay.scss b/src/storybook/pages/search-overlay/search-overlay.scss
index 0484b38121d..8965a366790 100644
--- a/src/storybook/pages/search-overlay/search-overlay.scss
+++ b/src/storybook/pages/search-overlay/search-overlay.scss
@@ -55,6 +55,7 @@ $timetable-margin-block: 7vh;
 
     display: block;
     color: var(--sbb-color-smoke-default);
+    margin: 0;
   }
 
   .result-image {