Fix display of code blocks in change descriptions (djblets version).
Review Request #8363 — Created Aug. 30, 2016 and submitted
The way full-width code blocks were shown in change descriptions was incorrect
(things were offset oddly to the left, and there was a big extra margin added
at the bottom).The fix involves changes to both djblets and Review Board. This change contains
the djblets side, which changes the default margin to just un-do the extra
spacing added by the padding and border. Additional overrides to this default
margin can happen on a case-by-case basis, for example, to account for specific
padding within an editor, or flush display within fields.
Verified the appearance of full-width code blocks in:
- Review request fields.
- The change description field in the review request draft header.
- The change description field in change description boxes.
- Field change diffs in change description boxes.
- Comments and headers in the review dialog.
- Comments and headers in reviews.
- Draft replies to reviews.
- Diff comment flag pop-ups.Checked that all affected text editors with full-width code blocks didn't have
any vertical jumps when opening or closing the editor.
| Description | From | Last Updated |
|---|---|---|
|
I don't think this is correct. I remember writing this logic, and doing so to fix rendering issues with code … |
 chipx86
|
-
-
I don't think this is correct. I remember writing this logic, and doing so to fix rendering issues with code blocks in places.
Your new logic is putting vertical margin values in the horizontal margin argument. It goes
margin: vert horiz. It's not rotated 90 degrees here at all. In fact, the original rule still looks correct to me, so I think you're seeing something else.To feel comfortable with any changes to this rule, I'd want to see testing and screenshots for:
- Change descriptions
- Review request fields
- Reviews
- Review dialog
- Tooltips for comment bubbles
- Description:
-
The way full-width code blocks were shown in change descriptions was incorrect
~ (the CSS rules were 90 degrees rotated from what they should have been, and ~ there was a big extra margin added for what was intended to be the bottom). ~ (things were offset oddly to the left, and there was a big extra margin added ~ at the bottom). The fix involves changes to both djblets and Review Board. This change contains
~ the djblets side. ~ the djblets side, which just removes the weird margins entirely. - Commit:
-
04e039958c9cbf1f00905f735fb2315add19bca683f8acd28ba161aa19588fc6076b060cfb34eae5
-
Tool: Pyflakes Ignored Files: djblets/static/djblets/css/mixins/markdown.less Tool: PEP8 Style Checker Ignored Files: djblets/static/djblets/css/mixins/markdown.less
- Description:
-
The way full-width code blocks were shown in change descriptions was incorrect
(things were offset oddly to the left, and there was a big extra margin added at the bottom). The fix involves changes to both djblets and Review Board. This change contains
~ the djblets side, which just removes the weird margins entirely. ~ the djblets side, which changes the default margin to just un-do the extra + spacing added by the padding and border. Additional overrides to this default + margin can happen on a case-by-case basis, for example, to account for specific + padding within an editor, or flush display within fields. - Testing Done:
-
~ Looked at a variety of full-width code blocks throughout the UI. Everything
~ looked correct now. ~ Verified the appearance of full-width code blocks in:
~ - Review request fields. + - The change description field in the review request draft header. + - The change description field in change description boxes. + - Field change diffs in change description boxes. + - Comments and headers in the review dialog. + - Comments and headers in reviews. + - Draft replies to reviews. + - Diff comment flag pop-ups. + + Checked that all affected text editors with full-width code blocks didn't have
+ any vertical jumps when opening or closing the editor. - Commit:
-
83f8acd28ba161aa19588fc6076b060cfb34eae5940a707db1a1f67b131f5b66485e21b7392935b2
Tool: PEP8 Style Checker Ignored Files: djblets/static/djblets/css/mixins/markdown.less Tool: Pyflakes Ignored Files: djblets/static/djblets/css/mixins/markdown.less