Closed (fixed)
Project:
Drupal core
Version:
9.3.x-dev
Component:
Olivero theme
Priority:
Normal
Category:
Bug report
Assigned:
Unassigned
Issue tags:
Reporter:
Created:
22 Jul 2021 at 18:52 UTC
Updated:
27 Sep 2021 at 13:29 UTC
Jump to comment: Most recent, Most recent file



Comments
Comment #2
djsagar commentedComment #3
djsagar commentedHi @mherchel,
I create patch for Views exposed filters to making inline.
Please review.
Thanks!
Comment #4
djsagar commentedComment #5
mherchelI like the idea of adding specific
.form--inlinestyles. I wasn't initially considering it, but it makes sense.I'm attaching an updated patch that adds that class directly onto the Views exposed filters form, and I'm also using
display: inline-blockto handle the inline elements instead offloat. This will handle RTL a bit better, and is more what we're trying to do.Comment #6
cindytwilliams commentedPath #5 applies cleanly, and displays the Views exposed filters inline using the form--inline class. Marking RTBC.
Before:

After:

Comment #8
mherchelLast test failure is unrelated.
Comment #9
lauriiiHow do we expect this to look when the form element has a description?
Comment #10
mherchelNot like that!
Comment #11
mherchelFix attached!
Comment #12
andy-blumThis all looks good! Moving to RTBC.
Comment #14
mherchelTest failure is unrelated.
Comment #16
mherchelAnother unrelated Layout Builder test failure:
Comment #17
mherchelComment #18
mherchelOpened followup #3232665: 'forms-inline' class should ensure all direct descendants are inline
Comment #20
lauriiiTested this manually in various use cases and it worked as expected!
Something that caught my attention was that
form--inlineisn't implementing BEM properly. However, it seems to be a pre-existing issue. Discussed with @mherchel and we agreed that this is something that should be handled globally, for example in #2417111: Replace container-inline with form--inline to display forms horizontally..Our pre-existing use cases are using
.form--inline .form-itemas a selector. I like the approach here because I think it's fair to assume that inside.form--inlineall elements are inline, regardless of whether they have.form-itemclass or not. The approach on this patch also seems potentially more compatible with BEM because the approach currently taken by core, adds a dependency between block level elements. Discussed with @mherchel and he said he'd open a follow-up for refactoring other themes to use this pattern.Committed 8c35867 and pushed to 9.3.x. Thanks!
Didn't backport to 9.2.x because of the new hook implementation.