Bug 1369585 - Explicitly identify the row and columns in cell infobar. r?gl
MozReview-Commit-ID: F4oKtM3IEbg
--- a/devtools/client/locales/en-US/layout.properties
+++ b/devtools/client/locales/en-US/layout.properties
@@ -37,8 +37,12 @@ layout.noGrids=No grids
# LOCALIZATION NOTE (layout.overlayMultipleGrids): The header for the list of grid
# container elements that can be highlighted in the CSS Grid pane.
layout.overlayMultipleGrids=Overlay Multiple Grids
# LOCALIZATION NOTE (layout.overlayGrid): Alternate header for the list of grid container
# elements if only one item can be selected.
layout.overlayGrid=Overlay Grid
+
+# LOCALIZATION NOTE (rowColumnPositions):
+# The row and column position of a grid cell.
+layout.rowColumnPositions=Row %S \/ Column %S
--- a/devtools/server/actors/highlighters/css-grid.js
+++ b/devtools/server/actors/highlighters/css-grid.js
@@ -25,16 +25,20 @@ const {
apply,
translate,
multiply,
scale,
getNodeTransformationMatrix,
getNodeTransformOrigin
} = require("devtools/shared/layout/dom-matrix-2d");
const { stringifyGridFragments } = require("devtools/server/actors/utils/css-grid-utils");
+const { LocalizationHelper } = require("devtools/shared/l10n");
+
+const LAYOUT_STRINGS_URI = "devtools/client/locales/layout.properties";
+const LAYOUT_L10N = new LocalizationHelper(LAYOUT_STRINGS_URI);
const CSS_GRID_ENABLED_PREF = "layout.css.grid.enabled";
const DEFAULT_GRID_COLOR = "#4B0082";
const COLUMNS = "cols";
const ROWS = "rows";
@@ -824,17 +828,18 @@ CssGridHighlighter.prototype = extend(Au
},
_updateGridCellInfobar(rowNumber, columnNumber, x1, x2, y1, y2) {
let width = x2 - x1;
let height = y2 - y1;
let dim = parseFloat(width.toPrecision(6)) +
" \u00D7 " +
parseFloat(height.toPrecision(6));
- let position = `${rowNumber}\/${columnNumber}`;
+ let position = LAYOUT_L10N.getFormatStr("layout.rowColumnPositions",
+ rowNumber, columnNumber);
this.getElement("cell-infobar-position").setTextContent(position);
this.getElement("cell-infobar-dimensions").setTextContent(dim);
let container = this.getElement("cell-infobar-container");
this._moveInfobar(container, x1, x2, y1, y2, {
position: "top",
hideIfOffscreen: true