aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--main.js4
-rw-r--r--style.css14
2 files changed, 14 insertions, 4 deletions
diff --git a/main.js b/main.js
index 8169ff5..cbde618 100644
--- a/main.js
+++ b/main.js
@@ -3792,7 +3792,9 @@ const infoMetadataAccordions = [];
value.nodeValue = formatters[1].format(v/10_000);
} else {
unit.nodeValue = 'km²';
- value.nodeValue = formatters[1].format(v/1_000_000);
+ v /= 1_000_000;
+ const i = v < 1_000_000 ? 1 : 0; /* ≥10⁶ km² overflows the box with 2 decimals */
+ value.nodeValue = formatters[i].format(v);
}
};
})();
diff --git a/style.css b/style.css
index 8800c8b..da48ebb 100644
--- a/style.css
+++ b/style.css
@@ -506,28 +506,36 @@ body.inprogress {
#measure-panel .measure-value {
font-family: Inter;
font-variant-numeric: tabular-nums;
- text-align: right;
--measure-value-padding: .75rem;
--measure-value-border-width: 3px;
+ --measure-value-font-size: calc(var(--bs-body-font-size) * 1.5);
--bs-border-opacity: .75;
border-width: var(--measure-value-border-width);
border-style: solid;
background: rgb(from var(--bs-secondary-bg-subtle) r g b / calc(alpha*.30));
- height: calc(var(--bs-body-line-height) * 1.25rem + 2*var(--measure-value-padding) + 2*var(--measure-value-border-width));
+ height: calc(var(--bs-body-line-height) * var(--bs-body-font-size) * var(--measure-value-font-size)
+ + 2*var(--measure-value-padding) + 2*var(--measure-value-border-width));
padding: var(--measure-value-padding) var(--measure-value-padding);
margin: calc(var(--measure-value-padding)*1.5) 0;
+ display: flex;
+ justify-content: flex-end; /* overflow on the left */
overflow: hidden;
-webkit-user-select: text;
-moz-user-select: text;
user-select: text; /* eslint-disable-line css/use-baseline */
}
#measure-panel .measure-value :not(.measure-unit) {
- font-size: 125%;
+ font-size: var(--measure-value-font-size);
font-weight: 400;
}
#measure-panel .measure-value .measure-unit:before {
+ font-size: calc(.5*(var(--measure-value-font-size) + var(--bs-body-font-size)));
content: '\00A0'; /* U+00A0 NO-BREAK SPACE */
}
+#measure-panel .measure-value .measure-unit {
+ font-size: var(--bs-body-font-size);
+ line-height: calc(var(--bs-body-line-height) * var(--measure-value-font-size));
+}
#measure-panel .btn-group {
width: 100%;
}