Bug 1253323 - Fix direction of heap-tree-number in RTL. r=ntim
MozReview-Commit-ID: EIJIFopbvm
--- a/devtools/client/themes/memory.css
+++ b/devtools/client/themes/memory.css
@@ -431,17 +431,18 @@ html, body, #app, #memory-tool {
.heap-tree-item-count,
.heap-tree-item-total-bytes,
.heap-tree-item-total-count {
/**
* Flex: contains several subcolumns, which need to be laid out horizontally.
* These subcolumns may have specific widths or need to flex.
*/
display: flex;
- text-align: end;
+ /* Make sure units/decimals/... are always vertically aligned to right in both LTR and RTL locales */
+ text-align: right;
border-inline-end: var(--cell-border-color) 1px solid;
}
.heap-tree-item-count,
.heap-tree-item-total-count,
.heap-tree-item-bytes,
.heap-tree-item-total-bytes {
width: 10%;
@@ -481,34 +482,33 @@ html, body, #app, #memory-tool {
.heap-tree-number,
.heap-tree-percent,
.heap-tree-item-name {
white-space: nowrap;
}
.heap-tree-number {
- padding-inline-start: 3px;
+ padding: 0 3px;
+ flex: 1;
+ color: var(--theme-content-color3);
+ /* Make sure number doesn't appear backwards on RTL locales */
+ direction: ltr;
}
.heap-tree-percent {
padding-inline-start: 3px;
padding-inline-end: 3px;
}
.heap-tree-number,
.heap-tree-percent {
font-family: var(--monospace-font-family);
}
-.heap-tree-number {
- flex: 1;
- color: var(--theme-content-color3);
-}
-
.heap-tree-percent {
width: 4ch;
}
.heap-tree-item.focused .heap-tree-number,
.heap-tree-item.focused .heap-tree-percent {
color: inherit;
}