Recently I've been working on implementing a Blacklight-based catalog for Penn State University Libraries. We are mostly through with mapping the MARC data from the catalog via Traject and integrating availability information, so we are at a point where we can start worrying about look-and-feel.
And then today Jonathan Rochkind asked "Can we stop redefining base bootstrap?" Considering my current working in theming-land, this got me thinking about markup and styling in general on a Blacklight application. There are a few different ways styles and their necessary markup are handled in the Blacklight engine, for example
- Adding special classes without styling to serve as hooks (see this PR)
- Also, there are a lot of places that have camel case
idattributes, which probably made sense at the time, but now is probably not very useful (being that
idtargets are too brittle for JS and slower than
classes for CSS).
- Additionally with Bootstrap 4 there is an abundance of utility classes for modifying alignment, border, padding, margin, etc. And it becomes even blurrier in terms of where and how an element should be styled. There are a few places this is used too.
FWIW (spoiler: not a lot) to me what makes sense is
- Rely on Bootstrap 4 as much as possible
- Don't override Bootstrap classes (as Rochkind suggests)
- Eliminate any
classthat is not currently in use
- Override Bootstrap via modifying Bootstrap set variables.
- If you just need to nudge an element a little, like modifying a bit padding, then just use the utility class (i.e.,
pb-1). IMO, these should be used sparingly - mainly because I think it is a little messy to look at and can feel a bit too much like the old inline style attributes of yore.
- If you need to make a lot of style changes to an element because of a real custom need, make a class and hang it on the element. This is a last resort. And use built-in Bootstrap mixins and variables whenever possible in these classes.
P.S. Just to be clear, the Blacklight community is amazing and the engine and its related family gems are fantastic.