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

Browse source
This commit is contained in:
Quantum 2020-06-15 23:01:39 -04:00
parent 94d9ca92e3
commit 019706414c
3 changed files with 15 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/app.scss
View file

@ -65,4 +65,13 @@ body {
#faq .card {
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>
<hr class="my-4">
<div class="input-group mb-3">
<input id="generated-password" class="form-control form-control-lg text-monospace" type="text"
placeholder="Click the Generate button to generate a new password" autocomplete="off" readonly>
<div id="generated-password" class="form-control form-control-lg text-monospace placeholder">
Click the Generate button to generate a new password</div>
<div class="input-group-append">
<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 }) %>
</button>
</div>

3
src/ui.js
View file

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