Add common styling for tabular fields for review requests.

Review Request #10385 — Created Jan. 17, 2019 and submitted

Information

Review Board
release-4.0.x

Reviewers

This introduces new styles for representing tabular data on a review
request in a field, along the lines of the Issue Summary Table. This
will allow us to provide consistency with some of the new bits of
tabular data we're introducing (the commits list, primarily).

The styles support displaying filtering tabs (like the issue states) and
other filtering widgets above the table. It's up to consumers to
actually hook any of this up, though.

This is the first new set of styles that make use of a proposed internal
standard for improving the organization of both the LessCSS rules and
CSS class names. Each of the CSS classes has a namespaced name, starting
with rb-c-review-request-field-tabular, which indicates 1) that it's
a Review Board CSS class and 2) that it's a component (c). All
classes within that use this prefix to ensure we don't run into any
namespace collisions within the product or with extensions.

On top of this, we use a -modifier-name format for CSS classes that
affect the presentation/behavior of a style, helping differentiate these
sorts of modifier rules from standard, independent rules.

LessCSS variables are also now namespaced and stored along with the new
rules in a new file. The namespacing gives us a cleaner way of defining
and organizing variables. Splitting these off into a new file helps us
organize the rules, which shouldn't have much of a penalty with the
modern way we generate and bundle files.

Upcoming changes will move the Issue Summary Table and Commit List to
use these styles as a base.

Tested this along with an upcoming change that makes use of the new
styling. This was tested with all functionality provided by the style,
in desktop and mobile modes.

Summary ID
Add common styling for tabular fields for review requests.
This introduces new styles for representing tabular data on a review request in a field, along the lines of the Issue Summary Table. This will allow us to provide consistency with some of the new bits of tabular data we're introducing (the commits list, primarily). The styles support displaying filtering tabs (like the issue states) and other filtering widgets above the table. It's up to consumers to actually hook any of this up, though. This is the first new set of styles that make use of a proposed internal standard for improving the organization of both the LessCSS rules and CSS class names. Each of the CSS classes has a namespaced name, starting with `rb-c-review-request-field-tabular`, which indicates 1) that it's a Review Board CSS class and 2) that it's a component (`c`). All classes within that use this prefix to ensure we don't run into any namespace collisions within the product or with extensions. On top of this, we use a `-modifier-name` format for CSS classes that affect the presentation/behavior of a style, helping differentiate these sorts of modifier rules from standard, independent rules. LessCSS variables are also now namespaced and stored along with the new rules in a new file. The namespacing gives us a cleaner way of defining and organizing variables. Splitting these off into a new file helps us organize the rules, which shouldn't have much of a penalty with the modern way we generate and bundle files. Upcoming changes will move the Issue Summary Table and Commit List to use these styles as a base.
a2d757407e71b63f40589b2542cb59b2cffe525d
chipx86
david
  1. Ship It!

  2. 
      
chipx86
david
  1. Ship It!
  2. 
      
chipx86
Review request changed
Status:
Completed
Change Summary:
Pushed to release-4.0.x (03f2c44)