Make the New Primo UI more CSS friendly
While the new Primo interface gave us more power to extend functionality via JavaScript it does not do the same for modifications via CSS due to the lack of properly marked up content.
In some parts of the New UI the content is well described, often with custom HTML elements, but there are also many places, often in the higher levels in the DOM tree, where better described selectors (preferably through classes) are needed.
For example, there is currently no selector that show the current system that is being displayed. The <prm-explore>-element could have the current system being shown as a class (search, fulldisplay, openurl, jsearch, account, login etc).
In the search results the <div.list-item-wrapper> element is used on the parent level. Here the markup would be greatly improved by adding the media-type such as article, book, text_resource etc. Allowing us to style based on media-type.
It's the same with facets. There's currently no way to target a specific Facet Group with CSS. The first real identifying selector is on the span[translate="facets.facet.facet_XXX"] that is several children down. Having this as a class or other attribute on either the repeating parent <div> or the <prm-facet-group> would help.
In My Account the <md-tab-content> could use the same treatment. Here the section could be added as an attribute, e.g. overview, fines, blocks_messages etc.
These are just a few examples where better selectors would be helpful. The best would be if the entire UI got the treatment with better selectors and modifications via CSS in mind. While JavaScript is powerful it is not the correct tool for everything.
-
Manu Schwendener commented
-
Manu Schwendener commented
+1