Skip to content

Commit

Permalink
Update to 0.4
Browse files Browse the repository at this point in the history 
Requires jQuery 3, Bootstrap 5, and Font Awesome 5 for best results.
  • Loading branch information
@jeremycaris
jeremycaris committed Aug 13, 2023
1 parent 693b8e0 commit 24f2d57
Show file tree
Hide file tree
Showing 9 changed files with 122 additions and 2,191 deletions.
134 changes: 105 additions & 29 deletions assets/css/style.css
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,133 @@
#passgrinder form {
width: 100%;
max-width: 400px;
margin: 0 auto;
text-align: center;
}

#passgrinder h1 {
text-align: center;
max-width: 428px;
}

#passgrinder small {
max-width: 94%;
margin: 4px auto 0;
line-height: 1em;
font-style: italic;
font-size: 0.8rem;
font-weight: 300;
max-width: 412px;
margin: 0 auto;
}

#passgrinder input[type="submit"], #passgrinder input[type="reset"] {
width: 100%;
max-width: 200px;
margin: 0 auto;
#passgrinder .toggle-password,
#passgrinder .toggle-copy {
cursor: pointer;
max-width: 44px;
}

#passgrinder #pg-message #success {
font-style: italic;
width: 100%;
text-align: center;
color: green;
#passgrinder #pg-result {
display: none;
}

#passgrinder #pg-message #fail {
#passgrinder #pg-message #success,
#passgrinder #pg-message #fail,
#passgrinder #pg-message #reset {
color: #fff;
font-style: italic;
width: 100%;
text-align: center;
color: red;
}

#passgrinder #pg-message #reset {
font-style: italic;
#passgrinder input[type=text],
#passgrinder input[type=password] {
font-family: 'Source Code Pro', monospace;
}

#passgrinder input[type="submit"],
#passgrinder input[type="reset"] {
width: 100%;
text-align: center;
color: grey;
max-width: 200px;
margin: 0 auto;
color: #000 !important;
}

#passgrinder .toggle-password, #passgrinder .toggle-copy {
#passgrinder input[type="submit"] {
background: #6eb981 !important;
border-color: #6eb981 !important;
}

#passgrinder input[type="reset"] {
background: #ccc !important;
border-color: #ccc !important;
}

#passgrinder .text-muted {
color: #ddd !important;
}

#passgrinder .form-text {
display: block;
}

#passgrinder .form-check {
padding-left: 0;
margin-bottom: 0;
min-height: auto;
}

#passgrinder .form-check-inline {
margin-right: 0.8rem;
}

#passgrinder .form-check-inline:last-of-type {
margin-right: 0;
}

#passgrinder [type="radio"]:checked,
#passgrinder [type="radio"]:not(:checked) {
position: absolute;
left: -9999px;
}

#passgrinder [type="radio"]:checked + label,
#passgrinder [type="radio"]:not(:checked) + label {
position: relative;
padding-left: 28px;
cursor: pointer;
line-height: 20px;
display: inline-block;
}

#passgrinder #pg-result {
display: none;
#passgrinder [type="radio"]:checked + label:before,
#passgrinder [type="radio"]:not(:checked) + label:before {
content: '';
position: absolute;
left: 0;
top: 0px;
width: 18px;
height: 18px;
border: 1px solid #fff;
border-radius: 100%;
background: #fff;
}

#passgrinder [type="radio"]:checked + label:after,
#passgrinder [type="radio"]:not(:checked) + label:after {
content: '';
width: 18px;
height: 18px;
background: #6eb981;
position: absolute;
top: 0px;
left: 0px;
border-radius: 100%;
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
}

#passgrinder [type="radio"]:not(:checked) + label:after {
opacity: 0;
-webkit-transform: scale(0);
transform: scale(0);
}

@media all and (max-width: 767px) {
#passgrinder #pg-message #success {
display: none;
}
#passgrinder [type="radio"]:checked + label:after {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
Binary file removed assets/images/passgrinder-fb.jpg
View file
Binary file not shown.
Binary file removed assets/images/passgrinder-full.png
View file
Binary file not shown.
Binary file removed assets/images/passgrinder-icon.png
View file
Binary file not shown.
2,091 changes: 0 additions & 2,091 deletions assets/images/passgrinder.ai
View file

This file was deleted.

48 changes: 1 addition & 47 deletions assets/js/script.js
View file
Original file line number Diff line number Diff line change
@@ -1,55 +1,9 @@
// Check for jQuery
if(typeof jQuery == 'undefined'){
document.write('<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></'+'script>');
} else {
console.log( "PassGrinder: jQuery loaded." );
}



// Check for font-awesome
// Variation based on https://codepen.io/AllThingsSmitty/pen/YqjBqW
jQuery( document ).ready( function($) {
function css(element, property) {
return window.getComputedStyle(element, null).getPropertyValue(property);
}

var span = document.createElement('span');

span.className = 'fa';
span.style.display = 'none';
document.body.insertBefore(span, document.body.firstChild);

if ((css(span, 'font-family')) !== 'FontAwesome') {
document.write('<link rel="stylesheet" id="fontawesome-css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.7.2/css/all.min.css" type="text/css" media="all" />');
} else {
console.log("PassGrinder: Font-Awesome loaded.");
}
document.body.removeChild(span);
});



// Check for Bootstrap
jQuery( document ).ready( function($) {
// Will be true if Bootstrap 3-4 is loaded, false if Bootstrap 2 or no Bootstrap
var bootstrap_enabled = (typeof $().emulateTransitionEnd == 'function');
if (bootstrap_enabled == 'false') {
document.write('<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></'+'script>');
document.write('<link rel="stylesheet" id="bootstrap-css href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/4.3.1/cerulean/bootstrap.min.css" type="text/css" />');
} else {
console.log( "PassGrinder: Bootstrap loaded." );
}
});



// Toggle password field visibility
jQuery( document ).ready( function($) {
$("body").on('click', '.toggle-password', function() {
$("i", this).toggleClass("fa-eye-slash");

var input = $(this).parent().prev();
var input = $(this).prev();

if (input.attr("type") === "password") {
input.attr("type", "text");
Expand Down
Binary file removed icon.png
View file
Binary file not shown.
38 changes: 15 additions & 23 deletions inc/class-passgrinder.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,29 +81,23 @@ public function shortcode_form($atts) {
$content = '
<div id="passgrinder">
<h1>' . $title . '</h1>
<form method="post" id="passgrinder-form">
<!-- <label for="pg-password">Enter your single master password:</label> -->
<div id="pg-input1" class="form-group row">
<div class="input-group col">
<input id="pg-password" name="pg-password" type="password" class="form-control" placeholder="Master Password (Required)" required />
<div class="input-group-append">
<div class="input-group-text toggle-password"><i class="fa fa-eye"></i></div>
</div>
<form method="post" id="passgrinder-form" autocomplete="off">
<div id="pg-input1" class="pt-2">
<div class="input-group flex-nowrap">
<input id="pg-password" name="pg-password" type="password" class="form-control" placeholder="Master Password (Required)" autocomplete="off" required />
<div class="input-group-text toggle-password"><i class="fa fa-eye"></i></div>
</div>
</div>
<!-- <label for="pg-salt">Enter a unique phrase:</label> -->
<div id="pg-input2" class="form-group row">
<div class="input-group col">
<input id="pg-salt" name="pg-salt" type="password" class="form-control" placeholder="Unique Phrase (Optional)" />
<div class="input-group-append">
<div class="input-group-text toggle-password"><i class="fa fa-eye"></i></div>
</div>
<div id="pg-input2" class="py-2">
<div class="input-group flex-nowrap">
<input id="pg-salt" name="pg-salt" type="password" class="form-control" placeholder="Unique Phrase (Optional)" autocomplete="off" />
<div class="input-group-text toggle-password"><i class="fa fa-eye"></i></div>
</div>
<small id="pg-salt-help" class="form-text text-muted">It is recommended to use the website URL, domain name, or app name where this password will be used to grind your master password into something more unique.</small>
<small id="pg-salt-help" class="form-text mt-2 text-muted">It is recommended to use the website URL, domain name, or app name where this password will be used to grind your master password into something more unique.</small>
</div>
<div id="pg-variations" class="form-group">
<div id="pg-variations" class="form-group pt-2">
<div class="form-check form-check-inline">
<input class="form-check-input" type="radio" name="pg-variation" id="default" value="0" checked>
<label class="form-check-label" for="default">
Expand Down Expand Up @@ -131,7 +125,7 @@ public function shortcode_form($atts) {
<small id="pg-variations-help" class="form-text text-muted">You may want to use a variation if you are required to change your password without needing to change your master password or unique phrase.</small>
</div>
<div id="pg-variations" class="form-group row">
<div id="pg-variations" class="form-group row pt-3">
<div class="input-group col">
<input id="pg-submit" type="submit" value="Submit" class="btn btn-primary" />
</div>
Expand All @@ -140,12 +134,10 @@ public function shortcode_form($atts) {
</div>
</div>
<div id="pg-result" class="form-group row">
<div class="input-group col">
<div id="pg-result" class="form-group row pt-3">
<div class="input-group flex-nowrap">
<input type="text" id="pg-result-pass" name="pg-result-pass" class="form-control" value="" placeholder="Your Generated Password" />
<div class="input-group-append">
<div class="input-group-text toggle-copy" data-clipboard-target="#pg-result-pass"><i class="fa fa-copy"></i></div>
</div>
<div class="input-group-text toggle-copy" data-clipboard-target="#pg-result-pass"><i class="fa fa-copy"></i></div>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion passgrinder.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
Description:
Author: Jeremy Caris
Author URI: https://passgrinder.com/
Version: 0.3
Version: 0.4
Category: utility
*/
Expand Down

0 comments on commit 24f2d57

Please sign in to comment.