quantum/correcthorsebatterystaple
1
0
Fork 0
mirror of https://github.com/quantum5/correcthorsebatterystaple.git synced 2025-04-24 10:11:57 -04:00
Code Issues Packages Projects Releases Wiki Activity

Improve display of generated password on mobile (#15)

Browse source
This commit is contained in:
Guanzhong Chen 2020-06-15 23:03:13 -04:00 committed by GitHub
parent 94d9ca92e3
commit 9cbf2f70dd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/app.scss
View file

@ -66,3 +66,12 @@ body {
#faq .card { #faq .card {
margin-bottom: $spacer; margin-bottom: $spacer;
} }
#generated-password {
height: auto;
&.placeholder {
color: $input-placeholder-color;
user-select: none;
}
}

6
src/index.ejs
View file

@ -40,11 +40,11 @@
<p class="lead">This is a truly secure password generator that generates easy-to-remember passwords.</p> <p class="lead">This is a truly secure password generator that generates easy-to-remember passwords.</p>
<hr class="my-4"> <hr class="my-4">
<div class="input-group mb-3"> <div class="input-group mb-3">
<input id="generated-password" class="form-control form-control-lg text-monospace" type="text" <div id="generated-password" class="form-control form-control-lg text-monospace placeholder">
placeholder="Click the Generate button to generate a new password" autocomplete="off" readonly> Click the Generate button to generate a new password</div>
<div class="input-group-append"> <div class="input-group-append">
<button class="btn btn-success copy" type="button" id="copy-password" <button class="btn btn-success copy" type="button" id="copy-password"
data-clipboard-target="#generated-password"> data-clipboard-target="#generated-password" disabled>
<%= require('octicons').clippy.toSVG({ height: 20 }) %> <%= require('octicons').clippy.toSVG({ height: 20 }) %>
</button> </button>
</div> </div>

3
src/ui.js
View file

@ -60,7 +60,8 @@ $(() => {
$('#run-generator').click(() => { $('#run-generator').click(() => {
const options = $options.serializeObject() const options = $options.serializeObject()
$output.val(generate(options)) $output.text(generate(options)).removeClass('placeholder')
$('#copy-password').prop('disabled', false)
return false return false
}) })