Improve styling of advanced form toggle
This commit is contained in:
parent
006f020424
commit
98cdd763f8
|
@ -160,7 +160,9 @@ export function renderEditForm(wordId = false) {
|
||||||
<label>Details<span class="red">*</span><a class="label-button maximize-button">Maximize</a><br>
|
<label>Details<span class="red">*</span><a class="label-button maximize-button">Maximize</a><br>
|
||||||
<textarea id="wordDetails_${wordId}" placeholder="Markdown formatting allowed">${word.details}</textarea>
|
<textarea id="wordDetails_${wordId}" placeholder="Markdown formatting allowed">${word.details}</textarea>
|
||||||
</label>
|
</label>
|
||||||
<a id="expandAdvancedForm_${wordId}" class="expand-advanced-form">Show Advanced</a>
|
<label>
|
||||||
|
<a id="expandAdvancedForm_${wordId}" class="small button expand-advanced-form">Show Advanced Fields</a>
|
||||||
|
</label>
|
||||||
<div id="advancedForm_${wordId}" class="advanced-word-form" style="display:none;">
|
<div id="advancedForm_${wordId}" class="advanced-word-form" style="display:none;">
|
||||||
<label>Etymology / Root Words<br>
|
<label>Etymology / Root Words<br>
|
||||||
<input id="wordEtymology_${wordId}" maxlength="2500" placeholder="comma,separated,root,words" value="${word.hasOwnProperty('etymology') ? word.etymology : ''}">
|
<input id="wordEtymology_${wordId}" maxlength="2500" placeholder="comma,separated,root,words" value="${word.hasOwnProperty('etymology') ? word.etymology : ''}">
|
||||||
|
|
|
@ -160,10 +160,10 @@ export function expandAdvancedForm(id = false) {
|
||||||
const button = typeof id.target !== 'undefined' ? this : document.getElementById('expandAdvancedForm' + (!wordId ? '' : wordId)),
|
const button = typeof id.target !== 'undefined' ? this : document.getElementById('expandAdvancedForm' + (!wordId ? '' : wordId)),
|
||||||
form = document.getElementById('advancedForm' + (!wordId ? '' : wordId));
|
form = document.getElementById('advancedForm' + (!wordId ? '' : wordId));
|
||||||
if (form.style.display !== 'block') {
|
if (form.style.display !== 'block') {
|
||||||
button.innerText = 'Hide Advanced';
|
button.innerText = 'Hide Advanced Fields';
|
||||||
form.style.display = 'block';
|
form.style.display = 'block';
|
||||||
} else {
|
} else {
|
||||||
button.innerText = 'Show Advanced';
|
button.innerText = 'Show Advanced Fields';
|
||||||
form.style.display = 'none';
|
form.style.display = 'none';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -139,7 +139,9 @@
|
||||||
<label>Details<span class="red">*</span><a class="label-button maximize-button">Maximize</a><br>
|
<label>Details<span class="red">*</span><a class="label-button maximize-button">Maximize</a><br>
|
||||||
<textarea id="wordDetails" placeholder="Markdown formatting allowed"></textarea>
|
<textarea id="wordDetails" placeholder="Markdown formatting allowed"></textarea>
|
||||||
</label>
|
</label>
|
||||||
<a id="expandAdvancedForm" class="expand-advanced-form">+ Advanced</a>
|
<label>
|
||||||
|
<a id="expandAdvancedForm" class="small button expand-advanced-form">Show Advanced Fields</a>
|
||||||
|
</label>
|
||||||
<div id="advancedForm" style="display:none;">
|
<div id="advancedForm" style="display:none;">
|
||||||
<label>Etymology / Root Words<br>
|
<label>Etymology / Root Words<br>
|
||||||
<input id="wordEtymology" maxlength="2500" placeholder="comma,separated,root,words">
|
<input id="wordEtymology" maxlength="2500" placeholder="comma,separated,root,words">
|
||||||
|
|
Loading…
Reference in New Issue