Fix alignment and appearance of boxes in review requests.

Review Request #4364 — Created July 29, 2013 and submitted Aug. 2, 2013, 1:33 p.m.

Information
Owner:	david
Repository:	Review Board
Branch:	master
Bugs:
Depends On:
Reviewers
Groups:	reviewboard
People:

Description

Fix alignment and appearance of boxes in review requests.

We have a bunch of stacked boxes in our review request and diffviewer pages.
When we introduced the new look for diffs, it became apparent to me that we had
some alignment and bleeding issues in these pages:
- Diff boxes were 2px less wide than anything else.
- Diff boxes didn't have a shadow.
- The collapse buttons for reviews and change descriptions weren't vertically
  centered.
- Change descriptions have a kind of wacky structure where there are two
  different elements with the "changedesc" class. This meant that we had some
  bleeding of the background color outside of the border (which I only
  noticed when zoomed way in).

Testing Done

Files

Issues

Description	From	Last Updated
I prefer the old padding. This is too cramped.	chipx86	Aug. 2, 2013, 12:07 p.m.
Sprinkling 2px everywhere seems like an easy way to unintentionally make things more inconsistent in time. I don't think the …	chipx86	Aug. 2, 2013, 12:07 p.m.

This is a review from Review Bot.
  Tool: PEP8 Style Checker
  Processed Files:
  Ignored Files:
    reviewboard/static/rb/css/reviews.less

This is a review from Review Bot.
  Tool: Pyflakes
  Processed Files:
  Ignored Files:
    reviewboard/static/rb/css/reviews.less

Diff Viewer (new)

Show all issues

I prefer the old padding. This is too cramped.

reviewboard/static/rb/css/reviews.less (Diff revision 1)

Show all issues

Sprinkling 2px everywhere seems like an easy way to unintentionally make things more inconsistent in time.

I don't think the solution is to add 2px to everything else. I think the diff boxes should be made the correct width. Really, when I was wrapping up the new diff border, I just simply didn't finish polishing it, which is the reason it didn't have the shadow and correct width.

Description:

		Fix alignment and appearance of boxes in review requests.

		We have a bunch of stacked boxes in our review request and diffviewer pages.
		When we introduced the new look for diffs, it became apparent to me that we had
		some alignment and bleeding issues in these pages:
		- Diff boxes were 2px less wide than anything else.
~		- The collapse buttons for reviews and change descriptions were too far down.
~		- The old box shadows looked pretty jarring when compared with the new diff
~		boxes.
	~	- Diff boxes didn't have a shadow.
	~	- The collapse buttons for reviews and change descriptions weren't vertically
	~	centered.
		- Change descriptions have a kind of wacky structure where there are two
		different elements with the "changedesc" class. This meant that we had some
~		bleeding of the background color outside of the border (which I only noticed
~		when zoomed way in).
	~	bleeding of the background color outside of the border (which I only
	~	noticed when zoomed way in).

Diff:

Revision 2 (+8 -3)

Show changes

	reviewboard/static/rb/css/diffviewer.less
	reviewboard/static/rb/css/reviews.less

This is a review from Review Bot.
  Tool: PEP8 Style Checker
  Processed Files:
  Ignored Files:
    reviewboard/static/rb/css/reviews.less
    reviewboard/static/rb/css/diffviewer.less

This is a review from Review Bot.
  Tool: Pyflakes
  Processed Files:
  Ignored Files:
    reviewboard/static/rb/css/reviews.less
    reviewboard/static/rb/css/diffviewer.less

Ship it!

```
Ship It!
```

Status: Closed (submitted)

Change Summary:

Pushed to master (4800605).

You have a pending review.

Review Board 5.0.2 alpha 0 (dev)

Fix alignment and appearance of boxes in review requests.

Description:

Diff:

Status: Closed (submitted)

Change Summary: