Reply To: info-button on smart -passord-text- box

[yavordashew]

Hi AURAGARD,
For this case again I have a neat solution with CSS, its using Font Awesome 5 icons, and you can change the icon by changing the unicode with the unicode for the icon you want.
Quick example: you can see what is the unicode for each icon by going to https://fontawesome.com/ choose an icon and then just copy the unicode for it and place it in the ‘content’ line.
One thing to note is that you need to include a CDN link for Font Awesome 5 in the head tag of your html file:
<link rel=”stylesheet” href=”https://use.fontawesome.com/releases/v5.13.0/css/all.css”&gt;
Also place this code in your CSS file, this snippet is already with info icon but you can replace it with any icon from Font Awesome.
.smart-password-text-box .smart-password-icon:before{
color:#000;
content: ‘\f05a’;   /* Change the unicode in this line to switch the icon, but replace the code after the ‘\’ sign */
font-family: ‘Font Awesome 5 Free’;
font-style: normal;
font-weight: 900;
position:absolute;
overflow: visible;
font-size:20px;
z-index: 9;
}
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/