I am using a theme from bootstrap hunter for my project which has a profile page, link below.
Now the profile page has picture. I have written the code that if anybody clicks on the image, it will open up a modal to upload a new picture but now I want that the image is clickable and on hover shows a camera icon from the font awesome library, but I can't seem to accomplish this.
I add anchor tag around the img tab but then the styling would mess up, I think because the CSS in the theme works on the child img of the div.profile-pic and when I wrap the img tag inside the anchor, it messes it.
Other than that I tried this for the icon:
img#photo:hover:before{
font-family: 'FontAwesome';
content: '\f01a';
}
The icon code might not be for camera but none the less nothing shows up. I don't know why. How do I place the camera icon on the picture and make it clickable?