Bug 1424880 - Size the font for grid area names after the smallest dimension; r=gl
MozReview-Commit-ID: 7dWo8Fw6gwf
--- a/devtools/server/actors/highlighters/css-grid.js
+++ b/devtools/server/actors/highlighters/css-grid.js
@@ -836,20 +836,21 @@ class CssGridHighlighter extends AutoRef
this.ctx.textBaseline = "middle";
// Draw the text for the grid area name.
for (let rowNumber = rowStart; rowNumber < rowEnd; rowNumber++) {
for (let columnNumber = columnStart; columnNumber < columnEnd; columnNumber++) {
let row = fragment.rows.tracks[rowNumber - 1];
let column = fragment.cols.tracks[columnNumber - 1];
- // Check if the font size is exceeds the bounds of the containing grid cell.
+ // If the font size exceeds the bounds of the containing grid cell, size it its
+ // row or column dimension, whichever is smallest.
if (fontSize > (column.breadth * displayPixelRatio) ||
fontSize > (row.breadth * displayPixelRatio)) {
- fontSize = (column.breadth + row.breadth) / 2;
+ fontSize = Math.min([column.breadth, row.breadth]);
this.ctx.font = fontSize + "px " + GRID_FONT_FAMILY;
}
let textWidth = this.ctx.measureText(area.name).width;
// The width of the character 'm' approximates the height of the text.
let textHeight = this.ctx.measureText("m").width;
// Padding in pixels for the line number text inside of the line number container.
let padding = 3 * displayPixelRatio;