I recently implemented a view in my new D8 site, which exposes a lot of choice filters.
What I expected is just a bunch of select lists or checkboxes to filter the results on the table generated by the view.
What I got instead is the bunch of select lists, but the first select list looks suspiciously like a search box:
So I checked the CSS and oh, surprise!, the CERN BASE theme assumes that every time one adds exposed filters to a view, the first one will necessarily be a search box!
/* Some align and display specifics here */
.cern-page-display-page .views-exposed-form .form-inline .form-item:first-child,
.cern-view-display-page:not(.view-general-search):not(.cern-view-display-resources):not(.resources-mosaic):not(.cern-view-display-feature_events):not(.cern-view-display-past_events):not(.cern-view-display-all_news):not(.cern-view-display-faq_page):not(.cern-view-display-page_taxonomies) .views-exposed-form .form-inline .form-item:first-child {
display: block;
text-align: center;
position: relative;
}
/* Here goes the lens icon! */
.cern-page-display-page .views-exposed-form .form-inline .form-item:first-child:before,
.cern-view-display-page:not(.view-general-search):not(.cern-view-display-resources):not(.resources-mosaic):not(.cern-view-display-feature_events):not(.cern-view-display-past_events):not(.cern-view-display-all_news):not(.cern-view-display-faq_page):not(.cern-view-display-page_taxonomies) .views-exposed-form .form-inline .form-item:first-child:before {
content: 'O';
font-family: "cern-icons";
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
position: absolute;
left: 8px;
width: 25px;
height: 25px;
top: 8px;
text-align: center;
line-height: 21px;
font-weight: 500;
padding-right: 2px;
font-size: 46px;
color: #0855a0;
}
Except of course, for a few very specific and exclusive views which need to match the class names in the super-long selectors…
I think this needs to be checked and fixed. Also, patching it via an override theme requires rewriting the full chain of selectors, so it’s not a good permanent solution.
When I have time, I will fix it on the CERN BASE theme myself, and submit a pull request (can we actually do this? )
In the mean time, a workaround can be to write the same rules on an override theme setting each property to default
, unset
, or whatever the value is on the general styles defined for exposed filters, or simply add a search box as the first exposed filter
Let me know what you think!