diff --git a/css/builder.css b/css/builder.css
index 29e97ae7dda0b3be50a5fabe54b3e6dd992a65a2..7286d3788bf2d54ffe8fef1f6dd0ecc0ee4ec6e1 100644
--- a/css/builder.css
+++ b/css/builder.css
@@ -237,47 +237,12 @@
mask-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14 8H16C16.5523 8 17 8.44772 17 9H21V11H9V9H13C13 8.44772 13.4477 8 14 8ZM10 12H20L19.09 21.0995C19.0389 21.6107 18.6088 22 18.095 22H11.905C11.3912 22 10.9611 21.6107 10.91 21.0995L10 12Z' fill='%23000000'/%3E%3C/svg%3E%0A");
-webkit-mask-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14 8H16C16.5523 8 17 8.44772 17 9H21V11H9V9H13C13 8.44772 13.4477 8 14 8ZM10 12H20L19.09 21.0995C19.0389 21.6107 18.6088 22 18.095 22H11.905C11.3912 22 10.9611 21.6107 10.91 21.0995L10 12Z' fill='%23000000'/%3E%3C/svg%3E%0A");
}
-.lpb-btn {
- position: absolute;
- z-index: 80;
- left: 50%;
- display: inline-block;
- padding: 0 10px;
- transition: all 0.15s linear;
- transform: translateX(-50%);
- border-radius: 4px;
- background: var(--lp-btn-bg-color);
- color: var(--lp-btn-fg-color);
- text-decoration: none;
- text-transform: uppercase;
- font-size: .7em;
- font-weight: bold;
- letter-spacing: 2px;
- line-height: 30px;
-}
-.lpb-btn.before {
- top: -17px;
-}
-.lpb-btn.after {
- bottom: -15px;
-}
-.lpb-btn.center {
- top: 50%;
- transform: translate(-50%, -50%);
-}
.js-lpb-region:has(.js-lpb-component) .lpb-btn--add.center {
display: none;
}
.js-lpb-region:not(:has(.js-lpb-component)) .lpb-btn--add.center {
display: inline-block;
}
-.js-lpb-component > .lpb-btn {
- opacity: 0;
-}
-.lp-builder:not(.is-navigating) .js-lpb-component:hover > .lpb-btn,
-.lp-builder:not(.is-navigating) .js-lpb-component:focus-within > .lpb-btn {
- opacity: 1;
-}
.lpb-btn--add {
position: absolute;
z-index: 80;
@@ -293,13 +258,10 @@
background-size: cover;
}
.lpb-btn--add:hover,
-.lpb-btn:hover,
-.lpb-btn--add:focus-within,
-.lpb-btn:focus-within {
+.lpb-btn--add:focus-within {
z-index: 90;
color: var(--lp-btn-fg-color);
text-decoration: underline;
-
}
.js-lpb-component .lpb-btn--add,
.js-lpb-region .lpb-btn--add {
diff --git a/js/builder.js b/js/builder.js
index 5f9f3e04e74e710107a6206e28b1782d56fee0d9..697d2af83dc9502251058c7e3a7cb884944c6df8 100644
--- a/js/builder.js
+++ b/js/builder.js
@@ -251,23 +251,6 @@
});
}
- /**
- * Hides the add content button in regions that contain components.
- * @param {HTMLElement} element The builder element.
- */
- function hideEmptyRegionButtons(element) {
- element
- .querySelectorAll('.lpb-btn--add.center')
- .forEach((buttonElement) => {
- const regionElement = buttonElement.closest('.js-lpb-region');
- if (regionElement?.querySelector('.js-lpb-component')) {
- // buttonElement.style.display = 'none';
- } else {
- // buttonElement.style.display = 'block';
- }
- });
- }
-
/**
* Updates the UI based on currently state.
* @param {HTMLElement} element The builder element.
@@ -275,7 +258,6 @@
function updateUi(element) {
reorderComponents(element);
updateMoveButtons(element);
- hideEmptyRegionButtons(element);
}
/**
diff --git a/src/Element/LayoutParagraphsBuilder.php b/src/Element/LayoutParagraphsBuilder.php
index f18841a8287491b879ef4047b4a31eef909e009e..03bd6869ad631b23bf329a22cbc6e4ef7d6fb305 100644
--- a/src/Element/LayoutParagraphsBuilder.php
+++ b/src/Element/LayoutParagraphsBuilder.php
@@ -210,20 +210,11 @@ class LayoutParagraphsBuilder extends RenderElementBase implements ContainerFact
$element['#attributes']['class'][] = 'has-components';
}
else {
- if ($this->layoutParagraphsLayout->getSetting('require_layouts', FALSE)) {
- $this->addJsUiElement(
- $element,
- $this->doRender($this->insertSectionButton(['layout_paragraphs_layout' => $this->layoutParagraphsLayout->id()], [], 0, ['center'])),
- 'insert'
- );
- }
- else {
- $this->addJsUiElement(
- $element,
- $this->doRender($this->insertComponentButton(['layout_paragraphs_layout' => $this->layoutParagraphsLayout->id()], [], 0, ['center'])),
- 'insert'
- );
- }
+ $this->addJsUiElement(
+ $element,
+ $this->doRender($this->insertComponentButton(['layout_paragraphs_layout' => $this->layoutParagraphsLayout->id()], [], 0, ['center'])),
+ 'insert'
+ );
}
return $element;
}
@@ -286,34 +277,18 @@ class LayoutParagraphsBuilder extends RenderElementBase implements ContainerFact
$this->addJsUiElement($build, $this->doRender($controls), 'controls', 'prepend');
if ($this->createAccess() && $this->checkCardinality()) {
- if (!$component->getParentUuid() && $this->layoutParagraphsLayout->getSetting('require_layouts')) {
- $this->addJsUiElement(
- $build,
- $this->doRender($this->insertSectionButton($url_params, $query_params + ['placement' => 'before'], -10000, ['before'])),
- 'insert_before',
- 'prepend'
- );
- $this->addJsUiElement(
- $build,
- $this->doRender($this->insertSectionButton($url_params, $query_params + ['placement' => 'after'], 10000, ['after'])),
- 'insert_after',
- 'append'
- );
- }
- else {
- $this->addJsUiElement(
- $build,
- $this->doRender($this->insertComponentButton($url_params, $query_params + ['placement' => 'before'], -10000, ['before'])),
- 'insert_before',
- 'prepend'
- );
- $this->addJsUiElement(
- $build,
- $this->doRender($this->insertComponentButton($url_params, $query_params + ['placement' => 'after'], -10000, ['after'])),
- 'insert_after',
- 'append'
- );
- }
+ $this->addJsUiElement(
+ $build,
+ $this->doRender($this->insertComponentButton($url_params, $query_params + ['placement' => 'before'], -10000, ['before'])),
+ 'insert_before',
+ 'prepend'
+ );
+ $this->addJsUiElement(
+ $build,
+ $this->doRender($this->insertComponentButton($url_params, $query_params + ['placement' => 'after'], -10000, ['after'])),
+ 'insert_after',
+ 'append'
+ );
}
if ($component->isLayout()) {
@@ -425,36 +400,6 @@ class LayoutParagraphsBuilder extends RenderElementBase implements ContainerFact
];
}
- /**
- * Returns the render array for a create section button.
- *
- * @param array[] $route_params
- * The route parameters for the link.
- * @param array[] $query_params
- * The query parameters for the link.
- * @param int $weight
- * The weight of the button element.
- * @param array[] $classes
- * A list of classes to append to the container.
- *
- * @return array
- * The render array.
- */
- protected function insertSectionButton(array $route_params = [], array $query_params = [], int $weight = 0, array $classes = []) {
- return [
- '#theme' => 'layout_paragraphs_insert_component_btn',
- '#title' => Markup::create($this->t('Add section')),
- '#attributes' => [
- 'class' => array_merge(['lpb-btn', 'use-ajax'], $classes),
- 'data-dialog-type' => 'dialog',
- 'data-dialog-options' => Json::encode(Dialog::dialogSettings($this->layoutParagraphsLayout)),
- 'drupalAutoButtons' => FALSE,
- 'dialogClass' => 'lpb-dialog',
- ],
- '#url' => Url::fromRoute('layout_paragraphs.builder.choose_component', $route_params, ['query' => $query_params]),
- ];
- }
-
/**
* Returns an array of dialog options.
*/