change icon tag

This commit is contained in:
Cristi Ciobanu 2018-05-24 21:20:23 +02:00
parent 25dc2848ca
commit 490c94b33a
3 changed files with 11 additions and 7 deletions

View file

@ -1694,23 +1694,27 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
right: 15px;
}
.password-container .reveal-password button {
.password-container .reveal-password span {
font: normal normal normal 14px/1 FontAwesome;
font-size: 16px;
color: #cdd3da;
padding: 10px;
width: 37px;
height: 37px;
display: flex;
justify-content: center;
align-items: center;
}
.password-container .reveal-password button:hover {
.password-container .reveal-password span:hover {
color: #79838c;
}
.password-container .reveal-password button::before {
.password-container .reveal-password span::before {
content: "\f06e"; /* https://fontawesome.com/icons/eye?style=solid */
transition: color 0.2s;
}
.password-container .reveal-password.visible button::before {
.password-container .reveal-password.visible span::before {
content: "\f070"; /* https://fontawesome.com/icons/eye-slash?style=solid */
color: #ff4136;
}

View file

@ -106,7 +106,7 @@ function togglePasswordField(elem) {
input.attr("type", input.attr("type") === "password" ? "text" : "password");
swapLabel($this);
swapLabel($this.find("button"));
swapLabel($this.find("span"));
$this.toggleClass("visible");
});
}

View file

@ -1,3 +1,3 @@
<span class="reveal-password tooltipped tooltipped-n tooltipped-no-delay" aria-label="Show password" data-alt-label="Hide password">
<button type="button" aria-label="Show password" data-alt-label="Hide password"></button>
<span type="button" aria-label="Show password" data-alt-label="Hide password"></span>
</span>