Chip Wasson
aba378ab44
All checks were successful
Gitea Actions Demo / build (push) Successful in 2m9s
129 lines
3.6 KiB
Handlebars
129 lines
3.6 KiB
Handlebars
<form action='/baby-names' method='post'>
|
|
{{#if message}}
|
|
<div>
|
|
<i>{{message}}</i>
|
|
</div>
|
|
{{/if}}
|
|
<div>
|
|
<label for='key'>Your key:</label>
|
|
<input type='text' name='key' value='{{key}}' required />
|
|
</div>
|
|
<div>
|
|
<h1>{{name}} <span style='color:gray'>{{lastName}}</span></h1>
|
|
</div>
|
|
<div>
|
|
<h3>{{synonyms}}</h3>
|
|
</div>
|
|
<input type='hidden' name='name' value='{{name}}' />
|
|
<input type='hidden' name='nameindex' value='{{index}}' />
|
|
<div
|
|
style='display: flex; flex-direction: column; gap: 1em; margin-bottom: 1em;'
|
|
>
|
|
{{! Opinion }}
|
|
<div>
|
|
<label for='opinion'>How do you feel about this name?</label>
|
|
<div style='width: 300px;'>
|
|
<input
|
|
type='range'
|
|
id='opinion'
|
|
name='opinion'
|
|
min='-2'
|
|
max='2'
|
|
step='1'
|
|
list='opinion-ticks'
|
|
style='width: 100%;'
|
|
required
|
|
/>
|
|
<datalist id='opinion-ticks'>
|
|
<option value='-2' label='Hate it'></option>
|
|
<option value='-1' label='Dislike it'></option>
|
|
<option value='0' label='Neutral'></option>
|
|
<option value='1' label='Like it'></option>
|
|
<option value='2' label='Love it'></option>
|
|
</datalist>
|
|
<div
|
|
style='display: flex; justify-content: space-between; font-size: 0.9em; margin-top: 0.2em;'
|
|
>
|
|
<span>Hate it</span>
|
|
<span>Dislike it</span>
|
|
<span>Neutral</span>
|
|
<span>Like it</span>
|
|
<span>Love it</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{! Pronunciation }}
|
|
<div>
|
|
<label for='pronunciation'>Is this pronounceable?</label>
|
|
<div style='width: 300px;'>
|
|
<input
|
|
type='range'
|
|
id='pronunciation'
|
|
name='pronunciation'
|
|
min='-2'
|
|
max='2'
|
|
step='1'
|
|
list='pronunciation-ticks'
|
|
style='width: 100%;'
|
|
required
|
|
/>
|
|
<datalist id='pronunciation-ticks'>
|
|
<option value='-2' label='Very Hard'></option>
|
|
<option value='0' label='Normal'></option>
|
|
<option value='2' label='Very Easy'></option>
|
|
</datalist>
|
|
<div
|
|
style='display: flex; justify-content: space-between; font-size: 0.9em; margin-top: 0.2em;'
|
|
>
|
|
<span>Very Hard</span>
|
|
<span></span>
|
|
<span>Normal</span>
|
|
<span></span>
|
|
<span>Very Easy</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{! Spelling }}
|
|
<div>
|
|
<label for='spelling'>How easy is this to spell?</label>
|
|
<div style='width: 300px;'>
|
|
<input
|
|
type='range'
|
|
id='spelling'
|
|
name='spelling'
|
|
min='-2'
|
|
max='2'
|
|
step='1'
|
|
list='spelling-ticks'
|
|
style='width: 100%;'
|
|
required
|
|
/>
|
|
<datalist id='spelling-ticks'>
|
|
<option value='-2' label='Very Hard'></option>
|
|
<option value='0' label='Normal'></option>
|
|
<option value='2' label='Very Easy'></option>
|
|
</datalist>
|
|
<div
|
|
style='display: flex; justify-content: space-between; font-size: 0.9em; margin-top: 0.2em;'
|
|
>
|
|
<span>Very Hard</span>
|
|
<span></span>
|
|
<span>Normal</span>
|
|
<span></span>
|
|
<span>Very Easy</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
</div>
|
|
<div>
|
|
<textarea
|
|
name='comment'
|
|
rows='4'
|
|
cols='50'
|
|
placeholder='Any additional comments?'
|
|
></textarea>
|
|
</div>
|
|
</div>
|
|
<button type='submit'>Submit Opinion</button>
|
|
</form> |