diff --git a/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.js b/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.js index 5fac04470..4ca7b7c25 100644 --- a/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.js +++ b/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.js @@ -155,11 +155,13 @@ export class DeleteObjectModal extends Component {
-
-
Name
-
Disk space
-
Node count
-
Row count
+
+
+
Name
+
Disk space
+
Node count
+
Row count
+
{map_(multipleInfo, ({path, resourceUsage}, index) => { const {type, titleUnquoted, rows, unmergedRows} = item[index]; @@ -265,6 +267,7 @@ export class DeleteObjectModal extends Component { confirmText="Delete" content={this.content} footerContent={helpLink} + contentClassName={block('content')} onCancel={closeDeleteModal} onConfirm={this.handleDeleteClick} /> diff --git a/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.scss b/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.scss index 00b039344..978450cd7 100644 --- a/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.scss +++ b/packages/ui/src/ui/pages/navigation/Navigation/PathEditorModal/DeleteObjectModal/DeleteObjectModal.scss @@ -7,14 +7,29 @@ font-weight: bold; } + &__content { + padding: 0 30px; + } + &__table { display: grid; grid-template-columns: 10px 1fr 70px 80px 75px; - grid-template-rows: 20px; + grid-template-rows: auto 20px; grid-gap: 12px 20px; align-items: center; } + &__table-header { + display: grid; + grid-template-columns: subgrid; + grid-column: 1 / -1; + position: sticky; + top: 0; + padding-top: 15px; + background-color: var(--g-color-base-modal); + z-index: 1; + } + &__object { margin-bottom: 15px; display: flex; @@ -38,8 +53,12 @@ } &__delete { + position: sticky; + bottom: 0; + padding: 16px 0; margin: 0; - margin-top: 30px; + margin-top: 14px; + background: var(--g-color-base-modal); display: flex; justify-content: space-between;