This topic is locked

Icon representing type of field in input via css

11/13/2023 5:29:13 AM
PHPRunner Tips and Tricks
mbintex author

Ever wanted an icon next to the input in fields?

img alt

Sadly PHPRunner does not have this kind of feature out of the box.

But it is relatively easy to have it via custom css:

:host::before{
content: "\20ac";
font-family: "Glyphicons Halflings";
font-size: 16px;
line-height: 1;
margin: 10px;
display: inline-block;
position: absolute;
margin-top: 29px;
padding: 10px;
margin-left: 12px;
color: var(--akzentfarbe);
background: var(--akzenthintergrund);
}
:host input{
text-indent: 30px;
}

This gives you a Euro Symbol in your input field.

Of course you can change the type of icon and switch to FontAwesome via font-family.

fhumanes 11/13/2023

Thank you. Congratulations