Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DROOP-1043 Divider is not visible when there is no header and content #866

Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 24 additions & 13 deletions themes/custom/droopler_theme/src/components/d-p-form/d-p-form.twig
Original file line number Diff line number Diff line change
Expand Up @@ -32,22 +32,33 @@
</div>
</div>

<div {{ bem('content', [], base_class, ['container']) }}>
<div {{ bem('content-wrapper', [], base_class, ['row']) }}>
<div {{ bem('content-column', ['header'], base_class, [content_classes]) }}>
{% block header %}
{% endblock %}
<div {{ bem('content', [], base_class, ['container']) }}>
<div {{ bem('content-wrapper', [], base_class, ['row']) }}>

{% include '@droopler_theme/base/divider/divider.twig' %}
{% set has_header = block('header')|render|striptags('<img>')|trim is not empty %}
{% set has_content = block('content')|render|striptags|trim is not empty %}

{% block content %}
{% endblock %}
</div>
{% if has_header or has_content %}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this condition needed? Is there a possibility of not having both blocks?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, there is such possibility. In this case, there's a big empty space next to the form, which looks strange. If this condition is not met, the empty space will not be rendered and the form will be centered.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see, content - header content, not form ;) Get it

<div {{ bem('content-column', ['header'], base_class, [content_classes]) }}>

{% if has_header %}
{% block header %}
{% endblock %}

{% if has_content %}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this condition needed? Is there a possibility of having a header without content in this component?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, because these fields are not set as required.

{% include '@droopler_theme/base/divider/divider.twig' %}
{% endif %}
{% endif %}

<div {{ bem('content-column', ['form'], base_class, [form_classes]) }}>
{% block form %}
{% endblock %}
{% block content %}
{% endblock %}
</div>
{% endif %}

<div {{ bem('content-column', ['form'], base_class, [form_classes]) }}>
{% block form %}
{% endblock %}
</div>
</div>
</div>
</div>
</section>