diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index f90e967a..fd7c31b7 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -682,4 +682,8 @@ a.black { @extend .align-items-center; @extend .w-100; @extend .mb-3; +} + +.btn-sm-queries { + @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-line-height, $btn-border-radius-sm); } \ No newline at end of file diff --git a/app/views/sites/_header.haml b/app/views/sites/_header.haml index 01b76083..87dd06b8 100644 --- a/app/views/sites/_header.haml +++ b/app/views/sites/_header.haml @@ -9,7 +9,7 @@ %input{ type: 'hidden', name: values.is_a?(Array) ? "#{param}[]" : param, value: value } - .form-group.flex-grow-0.m-0 + .form-group.flex-grow-0.m-0.mb-1 %label.h3{ for: 'q' }= t('posts.index.search') .input-group %input.form-control.border.border-magenta.border-right-0#q{ type: 'search', @@ -19,14 +19,17 @@ %span.input-group-text.background-white.magenta.border.border-magenta.border-top.border-left-0.border-right.border-bottom %i.fa.fa-fw.fa-search %input.sr-only{ type: 'submit' } + - filter_params.each do |param, values| - - [values].flatten.each do |value| - = link_to site_posts_path(site, **filter_params_by(filter_params, param, value)), - class: 'btn btn-secondary btn-sm', - title: t('posts.remove_filter_help', filter: value), - aria: { labelledby: "help-filter-#{param}" } do - - if param == :layout - = site.layouts[value.to_sym].humanized_name - - else - = value - × + .d-flex.flex-wrap + - [values].flatten.each do |value| + - humanized_name = site.layouts[value.to_sym].humanized_name + = link_to site_posts_path(site, **filter_params_by(filter_params, param, value)), + class: 'btn btn-secondary btn-sm-queries', + title: humanized_name, + aria: { labelledby: "help-filter-#{param}" } do + - if param == :layout + %span= humanized_name + - else + = value + %span ×