diff --git a/css/views_filters_summary.css b/css/views_filters_summary.css index cff4dc7722c7e8ff702cacad94f064f4e7b64f95..355523bec7013e112eb0c3629eb08f335943b614 100644 --- a/css/views_filters_summary.css +++ b/css/views_filters_summary.css @@ -1,8 +1,17 @@ -.views-filters-summary .value { +.views-filters-summary .value-container { + margin-right: 0.5em; + white-space: nowrap; +} + +.views-filters-summary .label { display: inline-block; margin-right: 0.5em; +} + +.views-filters-summary .value { + display: inline-block; margin-bottom: 6px; - padding: 0 1px 0 6px; + padding: 0 6px 0 6px; border: 1px solid #8c1515; -webkit-border-radius: 3px; -moz-border-radius: 3px; @@ -10,6 +19,10 @@ font-weight: 500; } +.views-filters-summary .value-container:last-of-type { + margin-right: 0; +} + .views-filters-summary a.remove-filter { margin-left: 4px; padding: 1px 8px 0 8px; @@ -22,3 +35,7 @@ background-color: #ededed; font-size: 18px; } + +.views-filters-summary a.reset { + margin-left: 0.5em; +} diff --git a/templates/views-filters-summary.html.twig b/templates/views-filters-summary.html.twig index 5f98efbf7d760f94507bd61336225d9855525f99..ffdc05e230035c54e0ece2eee9ee2e4b0f0b9f9d 100644 --- a/templates/views-filters-summary.html.twig +++ b/templates/views-filters-summary.html.twig @@ -43,30 +43,32 @@ {% if options.has_group_values %} <span class="values"> {%- for value in item.groups -%} - <strong class="value">{{ value.value }}</strong> - {% if value.link and options.show_remove_link %} + <span class="value-container"> + <strong class="value">{{ value.value }}</strong> + {% if value.link and options.show_remove_link %} {{ value.link }} - {% endif %} + {% endif %} + </span> {% endfor %} </span> {% else %} - <strong class="value">{{ item.value }}</strong> - {% if item.link and options.show_remove_link %} - {{ item.link }} - {% endif %} + <span class="value-container"> + <strong class="value">{{ item.value }}</strong> + {% if item.link and options.show_remove_link %} + {{ item.link }} + {% endif %} + </span> {% endif %} {% if loop.last == false %} - {{- options.filters_summary.separator -}} + {{- options.filters_summary.separator -}} {% endif %} </span> {%- endfor -%} </span> {% if summary and options.show_reset_link and options.reset_link.title %} - <a class="reset" href='/'> - {{ options.reset_link.title }} - </a> + <a class="reset" href='/'>{{ options.reset_link.title }}</a> {% endif %} </div> {% endapply %}