| @@ -62,8 +62,67 @@ | ||
| 62 | 62 | height: 18px; |
| 63 | 63 | display: block; |
| 64 | 64 | margin-right: 10px; |
| 65 | 65 | } |
| 66 | + | |
| 67 | + .__tagembed__password_wrap { | |
| 68 | + position: relative; | |
| 69 | + } | |
| 70 | + | |
| 71 | + .__tagembed__password_wrap input { | |
| 72 | + padding-right: 38px !important; | |
| 73 | + } | |
| 74 | + | |
| 75 | + .__tagembed__password_wrap input::-ms-reveal, | |
| 76 | + .__tagembed__password_wrap input::-ms-clear { | |
| 77 | + display: none; | |
| 78 | + } | |
| 79 | + | |
| 80 | + .__tagembed__password_toggle { | |
| 81 | + position: absolute; | |
| 82 | + top: 0; | |
| 83 | + right: 0; | |
| 84 | + bottom: 0; | |
| 85 | + display: flex; | |
| 86 | + align-items: center; | |
| 87 | + justify-content: center; | |
| 88 | + width: 36px; | |
| 89 | + padding: 0; | |
| 90 | + margin: 0; | |
| 91 | + background: transparent; | |
| 92 | + border: 0; | |
| 93 | + color: #8c8f94; | |
| 94 | + cursor: pointer; | |
| 95 | + } | |
| 96 | + | |
| 97 | + .__tagembed__password_toggle:hover, | |
| 98 | + .__tagembed__password_toggle:focus { | |
| 99 | + color: #2271b1; | |
| 100 | + } | |
| 101 | + | |
| 102 | + .__tagembed__password_toggle:focus { | |
| 103 | + outline: none; | |
| 104 | + box-shadow: none; | |
| 105 | + } | |
| 106 | + | |
| 107 | + .__tagembed__password_toggle:focus-visible { | |
| 108 | + outline: 1px solid #2271b1; | |
| 109 | + } | |
| 110 | + | |
| 111 | + .__tagembed__password_toggle svg { | |
| 112 | + width: 18px; | |
| 113 | + height: 18px; | |
| 114 | + display: block; | |
| 115 | + } | |
| 116 | + | |
| 117 | + .__tagembed__password_toggle .__tagembed__eye_off, | |
| 118 | + .__tagembed__password_toggle.__tagembed__visible .__tagembed__eye { | |
| 119 | + display: none; | |
| 120 | + } | |
| 121 | + | |
| 122 | + .__tagembed__password_toggle.__tagembed__visible .__tagembed__eye_off { | |
| 123 | + display: block; | |
| 124 | + } | |
| 66 | 125 | </style> |
| 67 | 126 | <div id="__tagembed__other_plugin_popup" class="__tagembed__other_plugin_popup"></div> |
| 68 | 127 | <!--End-- Other Plugin Popup--> |
| 69 | 128 | |
| @@ -89,9 +148,23 @@ | ||
| 89 | 148 | <input type="email" name="emailId" value="" placeholder="Email" required autofocus> |
| 90 | 149 | <span id="__tagembed__login_email_id_error"></span> |
| 91 | 150 | </div> |
| 92 | 151 | <div class="__tagembed__form_row"> |
| 93 | - <input type="password" name="password" value="" placeholder="Password" required> | |
| 152 | + <div class="__tagembed__password_wrap"> | |
| 153 | + <input type="password" name="password" value="" placeholder="Password" required> | |
| 154 | + <button type="button" class="__tagembed__password_toggle" aria-label="Show password" aria-pressed="false" title="Show password"> | |
| 155 | + <svg class="__tagembed__eye" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"> | |
| 156 | + <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" /> | |
| 157 | + <circle cx="12" cy="12" r="3" /> | |
| 158 | + </svg> | |
| 159 | + <svg class="__tagembed__eye_off" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"> | |
| 160 | + <path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94" /> | |
| 161 | + <path d="M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19" /> | |
| 162 | + <path d="M14.12 14.12a3 3 0 1 1-4.24-4.24" /> | |
| 163 | + <line x1="1" y1="1" x2="23" y2="23" /> | |
| 164 | + </svg> | |
| 165 | + </button> | |
| 166 | + </div> | |
| 94 | 167 | <span id="__tagembed__login_password_error"></span> |
| 95 | 168 | </div> |
| 96 | 169 | <div class="__tagembed__submit_sec"> |
| 97 | 170 | <a href="https://app.tagembed.com/accounts/forgotpassword/" target="_blank">Forgot Password</a> |
| @@ -126,9 +199,11 @@ | ||
| 126 | 199 | <input type="email" name="emailId" value="" placeholder="Email" required> |
| 127 | 200 | <span id="__tagembed__register_email_id_error"></span> |
| 128 | 201 | </div> |
| 129 | 202 | <div class="__tagembed__form_row"> |
| 130 | - <select id="__tagembed__callingCode" name="calling_code" style="padding: 0 8px;line-height: 2; min-height: 30px;width: 100%;border-radius: 0; border: 1px solid #999;background-color: #fff;color: #2c3338;"></select> | |
| 203 | + <select id="__tagembed__callingCode" name="calling_code" style="padding: 0 8px;line-height: 2; min-height: 30px;width: 100%;border-radius: 0; border: 1px solid #999;background-color: #fff;color: #2c3338;"> | |
| 204 | + <option value="" selected>Select Country Code</option> | |
| 205 | + </select> | |
| 131 | 206 | <span id="__tagembed__register_calling_code_error"></span> |
| 132 | 207 | </div> |
| 133 | 208 | <div class="__tagembed__form_row"> |
| 134 | 209 | <input type="number" name="contact_no" value="" placeholder="Contact Number"> |
| @@ -134,9 +209,23 @@ | ||
| 134 | 209 | <input type="number" name="contact_no" value="" placeholder="Contact Number"> |
| 135 | 210 | <span id="__tagembed__register_contact_no_error"></span> |
| 136 | 211 | </div> |
| 137 | 212 | <div class="__tagembed__form_row"> |
| 138 | - <input type="password" name="password" value="" placeholder="Password" required> | |
| 213 | + <div class="__tagembed__password_wrap"> | |
| 214 | + <input type="password" name="password" value="" placeholder="Password" required> | |
| 215 | + <button type="button" class="__tagembed__password_toggle" aria-label="Show password" aria-pressed="false" title="Show password"> | |
| 216 | + <svg class="__tagembed__eye" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"> | |
| 217 | + <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" /> | |
| 218 | + <circle cx="12" cy="12" r="3" /> | |
| 219 | + </svg> | |
| 220 | + <svg class="__tagembed__eye_off" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"> | |
| 221 | + <path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94" /> | |
| 222 | + <path d="M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19" /> | |
| 223 | + <path d="M14.12 14.12a3 3 0 1 1-4.24-4.24" /> | |
| 224 | + <line x1="1" y1="1" x2="23" y2="23" /> | |
| 225 | + </svg> | |
| 226 | + </button> | |
| 227 | + </div> | |
| 139 | 228 | <span id="__tagembed__register_password_error"></span> |
| 140 | 229 | <p style="font-size: 12px;color: #b5b5c3;font-weight: 400;max-width: 300px;margin-top: 10px;line-height: normal;">By clicking Create Account, you agree to our <a href="https://tagembed.com/terms-of-service/" target="_blank" style="cursor: pointer;">Terms of Service</a> and <a href="https://tagembed.com/privacy-policy/" target="_blank" style="cursor: pointer;">Privacy Policy</a></p> |
| 141 | 230 | </div> |
| 142 | 231 | <div class="__tagembed__submit_sec __tagembed__flexend"> |
