Add htmlFor and help text to EditDictionaryForm fields

This commit is contained in:
Robbie Antenesse 2017-08-20 14:48:04 -06:00
parent 6a1773b996
commit acb64dec56
1 changed files with 18 additions and 6 deletions

View File

@ -10,9 +10,11 @@ export const EditDictionaryForm = ({
return (
<div className='form'>
<div className='field'>
<label className='label'>Name</label>
<label className='label' htmlFor='editName'>
Name
</label>
<div className='control'>
<input className='input' type='text'
<input className='input' id='editName' type='text'
placeholder={ `${ specification || 'Dictionary' } Name` }
value={ name }
onInput={ (event) => {
@ -26,9 +28,14 @@ export const EditDictionaryForm = ({
</div>
<div className='field'>
<label className='label'>Specification</label>
<label className='label' htmlFor='editSpecification'>
Specification
</label>
<p className='help'>
What this collection of words should be referred to as, i.e. "Dictionary," "Word List", etc.
</p>
<div className='control'>
<input className='input' type='text'
<input className='input' id='editSpecification' type='text'
placeholder='Dictionary'
value={ specification }
onInput={ (event) => {
@ -42,9 +49,14 @@ export const EditDictionaryForm = ({
</div>
<div className='field'>
<label className='label' htmlFor='dictionaryDescription'>Description</label>
<label className='label' htmlFor='editDescription'>
Description
</label>
<p className='help'>
A description of your dictionary, <a href='MARKDOWN_LINK' target='_blank'>Markdown</a> enabled
</p>
<div className='control'>
<textarea className='textarea' id='dictionaryDescription'
<textarea className='textarea' id='editDescription'
placeholder={ `A description of your ${ specification }` }
value={ description }
onInput={ (event) => {