From 5692850aa240c53dfb316fb2ecfd059c2e921c4a Mon Sep 17 00:00:00 2001 From: Sapayth Hossain Date: Tue, 6 Feb 2024 14:51:26 +0600 Subject: [PATCH 1/2] enhance: eye icon inside password field eye icon inside the password field. image fix #1334 --- assets/css/frontend-forms.css | 6 +++ assets/js/frontend-form.js | 15 +++++++ assets/less/frontend-forms.less | 7 +++ includes/Frontend.php | 76 +++++++++++++++++---------------- templates/reset-pass-form.php | 12 ++++-- 5 files changed, 76 insertions(+), 40 deletions(-) diff --git a/assets/css/frontend-forms.css b/assets/css/frontend-forms.css index 036a963a1..939430a02 100644 --- a/assets/css/frontend-forms.css +++ b/assets/css/frontend-forms.css @@ -1833,3 +1833,9 @@ body .wpuf-attachment-upload-filelist + .moxie-shim { .iti--allow-dropdown input[type="text"] { padding-left: 52px !important; } +img.wpuf-eye { + position: absolute; + right: 5%; + top: 50%; + transform: translateY(-50%) translateX(-6%); +} diff --git a/assets/js/frontend-form.js b/assets/js/frontend-form.js index 94304b736..88b97d3ad 100644 --- a/assets/js/frontend-form.js +++ b/assets/js/frontend-form.js @@ -1492,4 +1492,19 @@ // Set name attribute for google map search field $(".wpuf-form-add #wpuf-map-add-location").attr("name", "find_address"); }); + + $(function($) { + // eye icon for password field + $(document).on('click', '.wpuf-eye', function () { + const input = $( this ).siblings( 'input' ); + + if ( input.attr("type") === "password" ) { + input.attr( "type", "text" ); + $( this ).attr( "src", wpuf_frontend.pro_asset_url + '/images/eye-close.svg' ); + } else { + input.attr( "type", "password" ); + $( this ).attr( "src", wpuf_frontend.pro_asset_url + '/images/eye.svg' ); + } + }); + }); })(jQuery, window); diff --git a/assets/less/frontend-forms.less b/assets/less/frontend-forms.less index 4711939cb..1b72b1963 100644 --- a/assets/less/frontend-forms.less +++ b/assets/less/frontend-forms.less @@ -2121,3 +2121,10 @@ ul.wpuf-form{ .iti--allow-dropdown input[type="text"] { padding-left: 52px !important; } + +img.wpuf-eye { + position: absolute; + right: 5%; + top: 50%; + transform: translateY(-50%) translateX(-6%); +} diff --git a/includes/Frontend.php b/includes/Frontend.php index 1d27c19aa..803304231 100644 --- a/includes/Frontend.php +++ b/includes/Frontend.php @@ -99,44 +99,46 @@ public function enqueue_scripts() { ], ] ); - wp_localize_script( - 'wpuf-frontend-form', 'wpuf_frontend', [ - 'ajaxurl' => admin_url( 'admin-ajax.php' ), - 'error_message' => __( 'Please fix the errors to proceed', 'wp-user-frontend' ), - 'nonce' => wp_create_nonce( 'wpuf_nonce' ), - 'word_limit' => __( 'Word limit reached', 'wp-user-frontend' ), - 'cancelSubMsg' => __( - 'Are you sure you want to cancel your current subscription ?', 'wp-user-frontend' - ), - 'delete_it' => __( 'Yes', 'wp-user-frontend' ), - 'cancel_it' => __( 'No', 'wp-user-frontend' ), - 'word_max_title' => __( - 'Maximum word limit reached. Please shorten your texts.', 'wp-user-frontend' - ), - 'word_max_details' => __( - 'This field supports a maximum of %number% words, and the limit is reached. Remove a few words to reach the acceptable limit of the field.', - 'wp-user-frontend' - ), - 'word_min_title' => __( 'Minimum word required.', 'wp-user-frontend' ), - 'word_min_details' => __( - 'This field requires minimum %number% words. Please add some more text.', 'wp-user-frontend' - ), - 'char_max_title' => __( - 'Maximum character limit reached. Please shorten your texts.', 'wp-user-frontend' - ), - 'char_max_details' => __( - 'This field supports a maximum of %number% characters, and the limit is reached. Remove a few characters to reach the acceptable limit of the field.', - 'wp-user-frontend' - ), - 'char_min_title' => __( 'Minimum character required.', 'wp-user-frontend' ), - 'char_min_details' => __( - 'This field requires minimum %number% characters. Please add some more character.', - 'wp-user-frontend' - ), - 'protected_shortcodes' => wpuf_get_protected_shortcodes(), - 'protected_shortcodes_message' => __( 'Using %shortcode% is restricted', 'wp-user-frontend' ), - ] + 'wpuf-frontend-form', 'wpuf_frontend', apply_filters( + 'wpuf_frontend_object', [ + 'asset_url' => WPUF_ASSET_URI, + 'ajaxurl' => admin_url( 'admin-ajax.php' ), + 'error_message' => __( 'Please fix the errors to proceed', 'wp-user-frontend' ), + 'nonce' => wp_create_nonce( 'wpuf_nonce' ), + 'word_limit' => __( 'Word limit reached', 'wp-user-frontend' ), + 'cancelSubMsg' => __( + 'Are you sure you want to cancel your current subscription ?', 'wp-user-frontend' + ), + 'delete_it' => __( 'Yes', 'wp-user-frontend' ), + 'cancel_it' => __( 'No', 'wp-user-frontend' ), + 'word_max_title' => __( + 'Maximum word limit reached. Please shorten your texts.', 'wp-user-frontend' + ), + 'word_max_details' => __( + 'This field supports a maximum of %number% words, and the limit is reached. Remove a few words to reach the acceptable limit of the field.', + 'wp-user-frontend' + ), + 'word_min_title' => __( 'Minimum word required.', 'wp-user-frontend' ), + 'word_min_details' => __( + 'This field requires minimum %number% words. Please add some more text.', 'wp-user-frontend' + ), + 'char_max_title' => __( + 'Maximum character limit reached. Please shorten your texts.', 'wp-user-frontend' + ), + 'char_max_details' => __( + 'This field supports a maximum of %number% characters, and the limit is reached. Remove a few characters to reach the acceptable limit of the field.', + 'wp-user-frontend' + ), + 'char_min_title' => __( 'Minimum character required.', 'wp-user-frontend' ), + 'char_min_details' => __( + 'This field requires minimum %number% characters. Please add some more character.', + 'wp-user-frontend' + ), + 'protected_shortcodes' => wpuf_get_protected_shortcodes(), + 'protected_shortcodes_message' => __( 'Using %shortcode% is restricted', 'wp-user-frontend' ), + ] + ) ); wp_localize_script( diff --git a/templates/reset-pass-form.php b/templates/reset-pass-form.php index 506e8f95e..4aba1f364 100644 --- a/templates/reset-pass-form.php +++ b/templates/reset-pass-form.php @@ -7,13 +7,19 @@ ?>
- show_errors(); ?> - show_messages(); ?> + show_errors(); + Simple_Login::init()->show_messages(); + $eye_icon_src = file_exists( WPUF_PRO_ROOT . '/assets/images/eye.svg' ) ? WPUF_PRO_ASSET_URI . '/images/eye.svg' : ''; + ?>

- +

+ + +

From 0025920cf800a1da6b4c8c2aa9c477150804b68c Mon Sep 17 00:00:00 2001 From: Sapayth Hossain Date: Tue, 6 Feb 2024 21:56:13 +0600 Subject: [PATCH 2/2] add eye icon to various templates --- assets/css/frontend-forms.css | 2 +- assets/images/eye-close.svg | 3 +++ assets/images/eye.svg | 3 +++ assets/js/frontend-form.js | 4 ++-- assets/less/frontend-forms.less | 2 +- templates/dashboard/edit-profile.php | 16 +++++++++++++--- templates/registration-form.php | 7 +++++-- templates/reset-pass-form.php | 9 ++++++--- 8 files changed, 34 insertions(+), 12 deletions(-) create mode 100644 assets/images/eye-close.svg create mode 100644 assets/images/eye.svg diff --git a/assets/css/frontend-forms.css b/assets/css/frontend-forms.css index 939430a02..6d14755f2 100644 --- a/assets/css/frontend-forms.css +++ b/assets/css/frontend-forms.css @@ -1835,7 +1835,7 @@ body .wpuf-attachment-upload-filelist + .moxie-shim { } img.wpuf-eye { position: absolute; - right: 5%; + right: 0; top: 50%; transform: translateY(-50%) translateX(-6%); } diff --git a/assets/images/eye-close.svg b/assets/images/eye-close.svg new file mode 100644 index 000000000..ab7400f68 --- /dev/null +++ b/assets/images/eye-close.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/eye.svg b/assets/images/eye.svg new file mode 100644 index 000000000..08958c07b --- /dev/null +++ b/assets/images/eye.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/js/frontend-form.js b/assets/js/frontend-form.js index 88b97d3ad..b22dc9624 100644 --- a/assets/js/frontend-form.js +++ b/assets/js/frontend-form.js @@ -1500,10 +1500,10 @@ if ( input.attr("type") === "password" ) { input.attr( "type", "text" ); - $( this ).attr( "src", wpuf_frontend.pro_asset_url + '/images/eye-close.svg' ); + $( this ).attr( "src", wpuf_frontend.asset_url + '/images/eye-close.svg' ); } else { input.attr( "type", "password" ); - $( this ).attr( "src", wpuf_frontend.pro_asset_url + '/images/eye.svg' ); + $( this ).attr( "src", wpuf_frontend.asset_url + '/images/eye.svg' ); } }); }); diff --git a/assets/less/frontend-forms.less b/assets/less/frontend-forms.less index 1b72b1963..06f637d1e 100644 --- a/assets/less/frontend-forms.less +++ b/assets/less/frontend-forms.less @@ -2124,7 +2124,7 @@ ul.wpuf-form{ img.wpuf-eye { position: absolute; - right: 5%; + right: 0; top: 50%; transform: translateY(-50%) translateX(-6%); } diff --git a/templates/dashboard/edit-profile.php b/templates/dashboard/edit-profile.php index 7829f8a32..19cbe0211 100644 --- a/templates/dashboard/edit-profile.php +++ b/templates/dashboard/edit-profile.php @@ -3,6 +3,7 @@ global $current_user; ob_start(); +$eye_icon_src = file_exists( WPUF_ROOT . '/assets/images/eye.svg' ) ? WPUF_ASSET_URI . '/images/eye.svg' : ''; ?> @@ -44,7 +45,10 @@

- +
+ + +
@@ -55,7 +59,10 @@
- +
+ + +
@@ -65,7 +72,10 @@
- +
+ + +
diff --git a/templates/registration-form.php b/templates/registration-form.php index 7014d2bd8..50a20d34a 100644 --- a/templates/registration-form.php +++ b/templates/registration-form.php @@ -22,6 +22,7 @@ frontend->registration->show_errors(); ?> frontend->registration->show_messages(); ?> + @@ -59,15 +60,17 @@
  • *
    -
    +
    +
  • *
    -
    +
    +
    • diff --git a/templates/reset-pass-form.php b/templates/reset-pass-form.php index 4aba1f364..366137edc 100644 --- a/templates/reset-pass-form.php +++ b/templates/reset-pass-form.php @@ -10,7 +10,7 @@ show_errors(); Simple_Login::init()->show_messages(); - $eye_icon_src = file_exists( WPUF_PRO_ROOT . '/assets/images/eye.svg' ) ? WPUF_PRO_ASSET_URI . '/images/eye.svg' : ''; + $eye_icon_src = file_exists( WPUF_ROOT . '/assets/images/eye.svg' ) ? WPUF_ASSET_URI . '/images/eye.svg' : ''; ?> @@ -18,13 +18,16 @@
    - +

    - +

    + + +