Addressing a ton of things in one massive PR around our utilities. We've already broken each group of utilities out into new pages with #20068, and now I'm cleaning things up to make utilities more granular, easier to use, and more flexible to a multitude of use cases.
-
Changed syntax of spacing utilities to help avoid collision with Microformats (see #20185 (closed)). This doesn't completely resolve the problem, however, because I want to move from
.pa-*
/.ma-*
to just.p-*
and.m-*
to avoid a weird and unclear abbreviation of "all" there. -
Revamps the text and background color utilities. Background utilities no longer set a
color
; you now apply that with a separate utility for more control. Also new is a.text-white
for those common cases where you just want white text on dark background. -
Renames
.img-rounded
an.img-circle
to.rounded
and.rounded-circle
. Also, add new utilities for rounding a complete side of an element (e.g.,.rounded-top
or.rounded-right
). (Pulls in commits from #20363 to fix #20266 (closed).) -
Removes
display: block;
from.img-fluid
. Responsive image behavior is not dependent ondisplay: block;
, so we can safely remove it on our end. Should you need block level, you can easily override that in the source or with a utility class.
Still to do:
-
Rename the .pull-*
classes to reflect their CSS property,.float-*
. -
Update all instances of background utilities to ensure color contrast.Punting. -
Consider reorganizing these new utility docs a bit more (e.g., combine display and responsive display, combine floats and clearfix, or something to that effect).Punting. -
Update all URLs that link to and within the new utility docs. -
Audit and make consistent use of !important
. -
Add vertical alignment utilitiesPunting to 4.1 ideas in #20866 (closed)
Am I missing anything else major?