From 8448cbfae06e2b637bfeae83cac8b8d9beccd46e Mon Sep 17 00:00:00 2001
From: JC Franco <jfranco@esri.com>
Date: Mon, 18 Nov 2024 12:04:34 -0800
Subject: [PATCH] fix(dialog, panel): restore relative positioning in content
 area (#10749)

**Related Issue:** #10095

## Summary

Fixes layout issues in dialog and panel content area.

This reverts commit 239f4da406920fcb3c4019573ccf3605903f954a.
---
 .../src/components/dialog/dialog.stories.ts          | 12 ++----------
 .../src/components/panel/panel.scss                  |  3 ++-
 2 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/packages/calcite-components/src/components/dialog/dialog.stories.ts b/packages/calcite-components/src/components/dialog/dialog.stories.ts
index 77cb5bef9a2..9a0ba8d918d 100644
--- a/packages/calcite-components/src/components/dialog/dialog.stories.ts
+++ b/packages/calcite-components/src/components/dialog/dialog.stories.ts
@@ -376,16 +376,8 @@ const themedStyle = html`--calcite-dialog-scrim-background-color: purple; --calc
 --calcite-dialog-content-space: 50px; --calcite-dialog-offset-x: 50px; --calcite-dialog-offset-y: -30px;`;
 
 export const withShellInside = (): string =>
-  html`<calcite-dialog
-    open
-    modal
-    heading="heading"
-    description="description"
-    scale="m"
-    width-scale="l"
-    style="--calcite-dialog-content-space: 0;"
-  >
-    <calcite-shell style="position:relative">
+  html`<calcite-dialog open modal heading="heading" description="description" scale="m" width-scale="l">
+    <calcite-shell>
       <calcite-shell-panel slot="panel-start">
         <calcite-action-bar slot="action-bar" expanded>
           <calcite-action-group>
diff --git a/packages/calcite-components/src/components/panel/panel.scss b/packages/calcite-components/src/components/panel/panel.scss
index 29b7cf7c45f..4d40f90da8c 100644
--- a/packages/calcite-components/src/components/panel/panel.scss
+++ b/packages/calcite-components/src/components/panel/panel.scss
@@ -164,7 +164,8 @@
   items-stretch
   overflow-auto
   h-full
-  focus-base;
+  focus-base
+  relative;
   padding: var(--calcite-panel-content-space, 0);
   background: var(--calcite-panel-background-color, var(--calcite-color-background));
 }