Alamantus
/
Lexiconga
mirror of https://github.com/Alamantus/Lexiconga.git
1
0
Fork 0
Code Issues Releases Activity

Improve styling of advanced form toggle

This commit is contained in:
Robbie Antenesse 2020-04-30 00:38:45 -06:00
parent 006f020424
commit 98cdd763f8
3 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/js/render/words.js
View File

@ -160,7 +160,9 @@ export function renderEditForm(wordId = false) {
<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>
</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;">
<label>Etymology / Root Words<br>
<input id="wordEtymology_${wordId}" maxlength="2500" placeholder="comma,separated,root,words" value="${word.hasOwnProperty('etymology') ? word.etymology : ''}">

4
src/js/wordManagement.js
View File

@ -160,10 +160,10 @@ export function expandAdvancedForm(id = false) {
const button = typeof id.target !== 'undefined' ? this : document.getElementById('expandAdvancedForm' + (!wordId ? '' : wordId)),
form = document.getElementById('advancedForm' + (!wordId ? '' : wordId));
if (form.style.display !== 'block') {
button.innerText = 'Hide Advanced';
button.innerText = 'Hide Advanced Fields';
form.style.display = 'block';
} else {
button.innerText = 'Show Advanced';
button.innerText = 'Show Advanced Fields';
form.style.display = 'none';
}
}

4
template-index.html
View File

@ -139,7 +139,9 @@
<label>Details<span class="red">*</span><a class="label-button maximize-button">Maximize</a><br>
<textarea id="wordDetails" placeholder="Markdown formatting allowed"></textarea>
</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;">
<label>Etymology / Root Words<br>
<input id="wordEtymology" maxlength="2500" placeholder="comma,separated,root,words">