Rename the admin widget classes.

Review Request #10414 — Created Feb. 18, 2019 and submitted

Information

Review Board
release-4.0.x

Reviewers

This change renames the admin widget classes to conform to our new
standard for CSS, and reorganizes a lot of the CSS to match. There's
only one small visual change, switching the background of the "Add Small
Widgets" button to be white to match the appearance of the "Add Large
Widgets" button.

Verified the appearance of the admin dashboard.

Summary ID
Rename the admin widget classes.
This change renames the admin widget classes to conform to our new standard for CSS, and reorganizes a lot of the CSS to match. There's only one small visual change, switching the background of the "Add Small Widgets" button to be white to match the appearance of the "Add Large Widgets" button. Testing done: Verified the appearance of the admin dashboard.
50b306ebf1f18ccf1cf0ac35271f27e504cf6088
Description From Last Updated

Typo in the description: "teh"

chipx86chipx86

Can you document these and the other elements, the way I did with the new CSS I've added? I want …

chipx86chipx86

If this is meant to be a fully-namespaced modifier, it should be &--is-large.

chipx86chipx86

Modifiers should have a - prefix, so -is-collapsable

chipx86chipx86

Same here.

chipx86chipx86

&.-has-actions

chipx86chipx86

-is-hidden

chipx86chipx86

-is-hidden Can you fix up the quoting style of affected lines while you're in here?

chipx86chipx86

Missing second backtick on the end of -is-small.

chipx86chipx86

These should be defined in a Modifiers section, like: /** * ... * * Modifiers: * -is-collapsable: * description... * …

chipx86chipx86

Modifiers are standalone classes. They should be -is-large, rather than rb-c-admin-widget--is-large. Original BEM uses the latter form, but we're not …

chipx86chipx86
david
chipx86
  1. 
      
  2. Show all issues

    Typo in the description: "teh"

  3. Show all issues

    Can you document these and the other elements, the way I did with the new CSS I've added? I want to attempt to have a consistently-document set of stylesheets going forward.

    1. I figure there's going to be a fair amount of surgery here when we do the actual redesign so I'd prefer to wait on that.

    2. There might be, but it's still helpful for that, so it's more clear when doing the work what things were used for and how they were structured before, and seeing how that changes.

  4. Show all issues

    If this is meant to be a fully-namespaced modifier, it should be &--is-large.

  5. Show all issues

    Modifiers should have a - prefix, so -is-collapsable

  6. Show all issues

    Same here.

  7. Show all issues

    &.-has-actions

  8. reviewboard/static/rb/js/admin/admin.js (Diff revision 1)
     
     
    Show all issues

    -is-hidden

  9. reviewboard/static/rb/js/admin/admin.js (Diff revision 1)
     
     
     
    Show all issues

    -is-hidden

    Can you fix up the quoting style of affected lines while you're in here?

  10. 
      
david
david
chipx86
  1. 
      
  2. reviewboard/static/rb/css/pages/admin-dashboard.less (Diff revision 3)
     
     
     
     
     
     
    Show all issues

    These should be defined in a Modifiers section, like:

    /**
     * ...
     *
     * Modifiers:
     *     -is-collapsable:
     *         description...
     *
     *     -is-hidden:
     *         description...
     */
    
  3. Show all issues

    Modifiers are standalone classes. They should be -is-large, rather than rb-c-admin-widget--is-large. Original BEM uses the latter form, but we're not (many other projects also don't, as it's not often necessary to be that strict).

    This applies to other modifier classes and the docs as well.

  4. 
      
david
chipx86
  1. 
      
  2. Show all issues

    Missing second backtick on the end of -is-small.

  3. 
      
david
Review request changed
Status:
Completed
Change Summary:
Pushed to release-4.0.x (d037d8f)