update crud-header display on mobile

This commit is contained in:
Simon Vieille 2022-05-17 09:22:22 +02:00
parent 79817a4e92
commit af98f7bfea
Signed by: deblan
GPG key ID: 579388D585F70417
10 changed files with 54 additions and 23 deletions

View file

@ -538,13 +538,42 @@ fieldset.form-group {
}
.crud-header {
padding: 30px;
.btn-group:empty {
display: none;
}
@media screen and (max-width: 769px) {
padding: 10px;
.btn {
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
}
}
&-title {
font-size: 2em;
@media screen and (max-width: 769px) {
font-size: 1.5em;
text-align: center;
margin-bottom: 30px;
}
}
&-filter {
padding-right: 30px;
padding-bottom: 30px;
@media screen and (max-width: 769px) {
padding-right: 10px;
padding-bottom: 10px;
}
}
&-actions {
text-align: right;
margin-bottom: 10px;
}
@media screen and (min-width: 770px) {

View file

@ -5,7 +5,7 @@
{% block title %}{{ 'My account'|trans }} - {{ parent() }}{% endblock %}
{% block body %}
<div class="bg-light pl-5 pr-4 pt-5 pb-5">
<div class="bg-light">
<div class="crud-header">
<h1 class="crud-header-title">{{ 'My account'|trans }}</h1>
</div>

View file

@ -8,7 +8,7 @@
{% block body %}
{% block header %}
<div class="bg-light pl-5 pr-4 pt-5 pb-5">
<div class="bg-light">
<div class="crud-header">
{% block header_title %}
<h1 class="crud-header-title">{{ configuration.pageTitle(context)|trans|build_string(entity) }}</h1>

View file

@ -18,34 +18,34 @@
{% endif %}
{%- endset -%}
<div class="bg-light pl-5 pr-4 pt-5 {{ pb }}">
<div class="bg-light">
<div class="crud-header">
{% block header_title %}
<h1 class="crud-header-title">{{ configuration.pageTitle(context)|trans }}</h1>
{% endblock %}
{% block header_actions %}
{%- block header_actions %}
<div class="crud-header-actions">
<div class="btn-group">
{% block header_actions_before %}{% endblock %}
{%- block header_actions_before %}{% endblock -%}
{% if configuration.action(context, 'new', true) %}
{%- if configuration.action(context, 'new', true) %}
<a href="{{ path(configuration.pageRoute('new'), configuration.pageRouteParams('new')) }}" class="btn btn-primary">
<span class="fa fa-plus pr-1"></span>
<span class="d-none d-md-inline">
{{ configuration.actionTitle(context, 'new', 'New')|trans }}
</span>
</a>
{% endif %}
{% endif -%}
{% if header_actions_dropdown_menu is not defined %}
{%- if header_actions_dropdown_menu is not defined %}
{% set header_actions_dropdown_menu = '' %}
{% endif %}
{% endif -%}
{% block header_actions_after %}{% endblock %}
{%- block header_actions_after %}{% endblock -%}
{% block header_actions_dropdown %}
{% if header_actions_dropdown_menu %}
{%- block header_actions_dropdown %}
{%- if header_actions_dropdown_menu %}
<button type="button" class="btn btn-white dropdown-toggle dropdown-toggle-hide-after" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="font-weight-bold">
⋅⋅⋅
@ -55,8 +55,8 @@
<div class="dropdown-menu dropdown-menu-right">
{{ header_actions_dropdown_menu|raw }}
</div>
{% endif %}
{% endblock %}
{% endif -%}
{% endblock -%}
</div>
</div>
{% endblock %}
@ -64,7 +64,7 @@
{% block header_filter_pager %}
{% if filters.show %}
<div class="row pb-3">
<div class="row crud-header-filter">
<div class="col-auto ml-auto {% if pager.getPaginationData.pageCount > 1 %}mr-3{% endif %}">
<button data-modal="{{ path(configuration.pageRoute('filter'), configuration.pageRouteParams('filter')) }}" class="btn btn-sm btn-secondary">
{{ 'Filter'|trans }} {% if not filters.isEmpty %}({{ 'yes'|trans }}){% endif %}
@ -75,7 +75,9 @@
</div>
</div>
{% else %}
{{ knp_pagination_render(pager) }}
<div class="crud-header-filter">
{{ knp_pagination_render(pager) }}
</div>
{% endif %}
{% endblock %}
</div>

View file

@ -8,7 +8,7 @@
{% block body %}
{% block header %}
<div class="bg-light pl-5 pr-4 pt-5 pb-5">
<div class="bg-light">
<div class="crud-header">
{% block header_title %}
<h1 class="crud-header-title">{{ configuration.pageTitle(context)|trans|build_string(entity) }}</h1>

View file

@ -6,7 +6,7 @@
{% block body %}
{% block header %}
<div class="bg-light pl-5 pr-4 pt-5 pb-5">
<div class="bg-light">
<div class="crud-header">
{% block header_title %}
<h1 class="crud-header-title">{{ configuration.pageTitle(context)|trans|build_string(entity) }}</h1>

View file

@ -1,7 +1,7 @@
{% extends '@Core/admin/layout.html.twig' %}
{% block body %}
<div class="bg-light pl-5 pr-4 pt-5 pb-5">
<div class="bg-light">
<div class="d-flex">
<div class="mr-auto w-50">
<h1 class="display-5">

View file

@ -3,7 +3,7 @@
{% block title %}{{ 'Settings'|trans }} - {{ parent() }}{% endblock %}
{% block body %}
<div class="bg-light pl-5 pr-4 pt-5 {% if pager.paginationData.pageCount < 2 %}pb-5{% endif %}">
<div class="bg-light">
<div class="crud-header">
<h1 class="crud-header-title">{{ 'Settings'|trans }}</h1>
</div>

View file

@ -3,7 +3,7 @@
{% block title %}{{ 'Tree'|trans }} - {{ parent() }}{% endblock %}
{% block body %}
<div class="bg-light pl-5 pr-4 pt-5 pb-5">
<div class="bg-light">
<div class="crud-header">
<div class="crud-header-title">
<button type="button" class="btn btn-outline-dark dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

View file

@ -3,7 +3,7 @@
{% block title %}{{ 'Tasks'|trans }} - {{ parent() }}{% endblock %}
{% block body %}
<div class="bg-light pl-5 pr-4 pt-5 pb-5">
<div class="bg-light">
<div class="crud-header">
<h1 class="crud-header-title">{{ 'Tasks'|trans }}</h1>
</div>