shinuwa/sokko-g
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Polish calculator large number readability v2
All checks were successful
Deploy Sokko G / deploy (push) Successful in 7s
Details

Browse source
This commit is contained in:
Shinuwa 2026-08-09 18:05:37 +02:00
parent e4803aa14f
commit 7140012a98
2 changed files with 10 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

11
website/src/features/toolboxes/modules/CalculatorModule.jsx
View file

@ -36,6 +36,13 @@ function getResultLengthClass(value) {
return ""; return "";
} }
function getEntryResultLengthClass(value) {
const length = formatResult(value).replace(/[^\d]/g, "").length;
if (length >= 21) return "is-compact";
if (length >= 18) return "is-long";
return "";
}
function getChildren(entries, parentId) { function getChildren(entries, parentId) {
return entries.filter((entry) => (entry.parentId || "") === parentId); return entries.filter((entry) => (entry.parentId || "") === parentId);
} }
@ -264,7 +271,7 @@ function CalculatorEntries({ entries, parentId, getScopedParentId, activeParentI
{entry.id === editingId ? ( {entry.id === editingId ? (
<> <>
<span className="tool-split-entry-value is-readonly" title={textContent.readonlyValueTitle || "Quantité non modifiable"}> <span className="tool-split-entry-value is-readonly" title={textContent.readonlyValueTitle || "Quantité non modifiable"}>
<strong className={getResultLengthClass(entry.value)} aria-label={formatDisplayResult(entry.value)}> <strong className={getEntryResultLengthClass(entry.value)} aria-label={formatDisplayResult(entry.value)}>
<FormattedCalculatorNumber value={entry.value} /> <FormattedCalculatorNumber value={entry.value} />
</strong> </strong>
</span> </span>
@ -273,7 +280,7 @@ function CalculatorEntries({ entries, parentId, getScopedParentId, activeParentI
) : ( ) : (
<button className="tool-split-entry-summary" type="button" onClick={() => onUse(entry)} title={textContent.useEntryTitle || "Utiliser comme base"}> <button className="tool-split-entry-summary" type="button" onClick={() => onUse(entry)} title={textContent.useEntryTitle || "Utiliser comme base"}>
<span> <span>
<strong className={getResultLengthClass(entry.value)} aria-label={formatDisplayResult(entry.value)}> <strong className={getEntryResultLengthClass(entry.value)} aria-label={formatDisplayResult(entry.value)}>
<FormattedCalculatorNumber value={entry.value} /> <FormattedCalculatorNumber value={entry.value} />
</strong> </strong>
{entry.label && <em>{entry.label}</em>} {entry.label && <em>{entry.label}</em>}

2
website/src/styles/_toolboxes.scss
View file

@ -5252,7 +5252,7 @@ button.combo-input-token.combo-value-grab .ui-icon {
.calculator-number-group.is-muted, .calculator-number-group.is-muted,
.calculator-number-separator { .calculator-number-separator {
color: rgba(180, 189, 211, 0.68); color: rgba(215, 221, 237, 0.84);
} }
.calculator-number-separator { .calculator-number-separator {