Change KV inputs to textareas, also JSON > CODE

As the input field was used for KV's it looked like you couldn't save
multiline KV's. Changed to textarea so you can see the multilines.

Also, JSON is slightly misleading as clicking the toggle doesn't
necessarily mean 'I'm going to edit some JSON' it means I want the code
editor with syntax highlighting, so renamed the toggle to say 'Code'
This commit is contained in:
John Cowen 2018-05-24 13:08:08 +01:00
parent b9c23dee69
commit fddc36f02f
3 changed files with 10 additions and 5 deletions

View File

@ -14,8 +14,10 @@
display: block;
max-width: 100%;
min-width: 100%;
padding: 0.625em;
min-height: 70px;
padding: 0.625em 15px;
resize: vertical;
line-height: 1.5;
}
%form-element [type='text'],
%form-element [type='password'] {
@ -37,14 +39,16 @@
box-shadow: none;
border-radius: $radius-small;
}
.has-error > input {
.has-error > input,
.has-error > textarea {
border: 1px solid;
}
%form-element > span {
color: $text-gray;
}
%form-element [type='text'],
%form-element [type='password'] {
%form-element [type='password'],
%form-element textarea {
color: $user-text-gray;
}
%form-element [type='text'],

View File

@ -63,6 +63,7 @@ h2,
body,
pre code,
input,
textarea,
td {
font-size: $size-6;
}

View File

@ -11,14 +11,14 @@
<div>
<label class="type-toggle">
<input type="checkbox" name="json" checked={{if json 'checked' }} onchange={{action 'change'}} />
<span>JSON</span>
<span>Code</span>
</label>
<label class="type-text{{if item.error.Value ' has-error'}}">
<span>Value</span>
{{#if json}}
{{ code-editor value=(atob item.Value) onkeyup=(action 'change') }}
{{else}}
<input autofocus={{not create}} type="text" name="value" value={{atob item.Value}} onkeyup={{action 'change'}} />
<textarea autofocus={{not create}} name="value" onkeyup={{action 'change'}}>{{atob item.Value}}</textarea>
{{/if}}
</label>
</div>