feat: Update voice field visibility and enhance CSS for improved layout and accessibility

This commit is contained in:
JB
2025-10-06 11:59:44 -07:00
parent 323ab08f38
commit f3aaeda37b
2 changed files with 30 additions and 9 deletions
+17 -9
View File
@@ -58,10 +58,11 @@ const initDashboard = () => {
const isFormula = value === "__formula"; const isFormula = value === "__formula";
const isSavedProfile = !isStandard && !isFormula; const isSavedProfile = !isStandard && !isFormula;
const showVoiceField = isStandard;
if (voiceField) { if (voiceField) {
const showVoice = isStandard; voiceField.hidden = !showVoiceField;
voiceField.hidden = !showVoice; voiceField.setAttribute("aria-hidden", showVoiceField ? "false" : "true");
voiceField.setAttribute("aria-hidden", showVoice ? "false" : "true"); voiceField.dataset.state = showVoiceField ? "visible" : "hidden";
} }
if (voiceSelect) { if (voiceSelect) {
voiceSelect.disabled = !isStandard; voiceSelect.disabled = !isStandard;
@@ -77,20 +78,27 @@ const initDashboard = () => {
formulaInput.value = ""; formulaInput.value = "";
} }
const showFormulaField = isFormula;
if (formulaField) { if (formulaField) {
const showFormula = isFormula; const shouldShow = showFormulaField;
formulaField.hidden = !showFormula; formulaField.hidden = !shouldShow;
formulaField.setAttribute("aria-hidden", showFormula ? "false" : "true"); formulaField.setAttribute("aria-hidden", shouldShow ? "false" : "true");
formulaField.dataset.state = shouldShow ? "visible" : "hidden";
} }
if (formulaInput) { if (formulaInput) {
if (isFormula) { if (isFormula) {
formulaInput.disabled = false; formulaInput.disabled = false;
formulaInput.readOnly = false; formulaInput.readOnly = false;
formulaInput.dataset.state = "editable"; formulaInput.dataset.state = "editable";
} else { } else if (isSavedProfile) {
formulaInput.disabled = !isSavedProfile; formulaInput.disabled = false;
formulaInput.readOnly = true; formulaInput.readOnly = true;
formulaInput.dataset.state = isSavedProfile ? "locked" : "editable"; formulaInput.dataset.state = "locked";
} else {
formulaInput.disabled = true;
formulaInput.readOnly = true;
formulaInput.value = "";
formulaInput.dataset.state = "editable";
} }
} }
}; };
+13
View File
@@ -183,6 +183,11 @@ body {
gap: 0.4rem; gap: 0.4rem;
} }
.field[hidden],
.field[data-state="hidden"] {
display: none !important;
}
.field--full { .field--full {
max-width: none; max-width: none;
} }
@@ -224,6 +229,14 @@ body {
width: min(100%, 420px); width: min(100%, 420px);
} }
.field input[type="range"] {
max-width: 420px;
width: min(100%, 420px);
padding: 0;
margin-inline: 0;
align-self: flex-start;
}
.field input[type="number"] { .field input[type="number"] {
max-width: 200px; max-width: 200px;
} }