diff --git a/modules/shared/auth/ui/home.php b/modules/shared/auth/ui/home.php index 582e1f6..698af14 100644 --- a/modules/shared/auth/ui/home.php +++ b/modules/shared/auth/ui/home.php @@ -1212,20 +1212,28 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $otcM return; } - const header = existingCard.querySelector(':scope > .sg-object-card__header'); - const actions = header?.querySelector(':scope > .sg-component-row'); - if (!header || !actions) { - return; - } - const stage = document.createElement('div'); stage.className = 'sg-delete-confirmation-pattern__stage sg-delete-confirmation-pattern__host'; stage.dataset.pattern = 'overlay-card'; stage.dataset.dialogOpen = 'false'; - existingCard.classList.add('sg-delete-confirmation-pattern__target'); - existingCard.dataset.sharedEditableDeleteToken = 'DELETE'; - existingCard.dataset.marketDefinitionDeleteId = ''; + const target = document.createElement('div'); + target.className = 'sg-delete-confirmation-pattern__target'; + target.dataset.sharedEditableActionCard = ''; + target.dataset.sharedEditableDeleteToken = 'DELETE'; + target.dataset.marketDefinitionDeleteId = ''; + target.dataset.marketDefinitionCard = ''; + const titleCard = document.createElement('article'); + titleCard.className = 'sg-card sg-card--content-card market-delete-confirmation-card'; + const header = document.createElement('header'); + header.className = 'sg-card-segment sg-card-segment--header sg-card-segment--gray sg-object-card__header'; + const heading = document.createElement('h2'); + heading.className = 'sg-heading-h2 market-delete-confirmation-card__title'; + heading.dataset.marketDefinitionReadTitle = ''; + heading.dataset.marketDefinitionDrawerTitle = ''; + heading.textContent = 'Markt'; + const actions = document.createElement('div'); + actions.className = 'sg-component-row'; const deleteButton = document.createElement('button'); deleteButton.className = 'sg-interaction-element sg-button sg-button--warning'; deleteButton.type = 'button'; @@ -1233,6 +1241,10 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $otcM deleteButton.dataset.marketDefinitionDelete = ''; deleteButton.textContent = 'Löschen'; actions.append(deleteButton); + header.append(heading, actions); + titleCard.append(header); + existingCard.querySelector('[data-market-definition-read-title]')?.remove(); + existingCard.removeAttribute('data-shared-editable-action-card'); const confirmation = document.createElement('article'); confirmation.className = 'sg-card sg-card--overlay-host sg-delete-confirmation-pattern__floating-card'; @@ -1243,8 +1255,8 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $otcM confirmation.dataset.sharedEditableCardDeleteConfirmation = ''; confirmation.hidden = true; confirmation.innerHTML = '

Möchtest du diesen Markt wirklich löschen?

Du kannst das nicht rückgängig machen. Bestätige durch Eingabe von DELETE.

'; - existingCard.append(confirmation); - stage.append(existingCard); + target.append(titleCard, existingCard, confirmation); + stage.append(target); drawer.querySelector('[data-market-definition-drawer-content]')?.append(stage); }; JS; diff --git a/public/assets/styles.portal.css b/public/assets/styles.portal.css index a072ab3..2c5307a 100644 --- a/public/assets/styles.portal.css +++ b/public/assets/styles.portal.css @@ -362,6 +362,10 @@ body.sg-lager-mobile-detail-open > :not([data-lager-mobile-detail-host]) { display: none; } +.sg-card-list-page-drawer [data-market-definition-card] .sg-object-card__header > .sg-component-row { + margin-left: auto; +} + .sg-card-list-page-drawer [data-market-delete-occurrence-id], .sg-card-list-page-drawer [data-market-definition-delete-id] { display: flex;