fix(docs): fix dialog markup on dialog text content and button intendation (#6206)

## 📄 Description

- Added `<p>`-tag around dialog content in stories, required for
accessibility.
- Separated `<button>`-tags to be on two different lines.

---------

Co-authored-by: Alona Zherdetska <[email protected]>

Author: bucknatt

.changeset/four-monkeys-buy.md

@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-documentation': patch
+---
+
+Improved `dialog` component accessibility by adding proper paragraph markup around text content.

packages/documentation/src/stories/components/dialog/dialog.stories.ts

@@ -120,8 +120,10 @@ const getCloseButton = () => {
 };
 
 const getControls = () => {
-  return html`<button class="btn btn-primary">OK</button>
-    <button class="btn btn-secondary">Cancel</button>`;
+  return html`
+    <button class="btn btn-primary">OK</button>
+    <button class="btn btn-secondary">Cancel</button>
+  `;
 };
 
 const Template = {
@@ -148,7 +150,7 @@ const Template = {
         <form method="dialog" class="dialog-grid">
           ${postDialogIcon}
           <h3 class="dialog-header">${args.title}</h3>
-          <div class="dialog-body">${args.content}</div>
+          <div class="dialog-body"><p>${args.content}</p></div>
           <div class="dialog-controls">${getControls()}</div>
           ${postDialogCloseButton}
         </form>