使用 PrimeNG 将对话框弹出窗口定位为侧边栏

Question

我想要一个侧边栏，其中包含一些 Header-Content-Footer 样式的内容。目的是我需要一个特定的标题、背景颜色等 header 和页脚中的操作按钮，中间有动态内容。但是，p-sidebar 不提供这些模板，因此我尝试为此使用弹出窗口并使其看起来像侧边栏。我能够使用弹出窗口实现 header 和我需要的页脚样式，但我无法将其作为侧边栏放置在右侧。

所以我需要的是这里显示的弹出窗口：

看起来像这样 :

我不是 CSS 方面的专家，因此非常期待任何意见。

Answer 1

试试这个代码：

body .ui-widget-overlay{
  justify-content: flex-end;
}

body .ui-dialog{
  width: 50vw;
  z-index: 11008;
  height: 100%;
  background-color: white;
  max-height: 100%;
}