In the process of creating a teacher form, I am looking to allow users to select images from a gallery for their profile. The goal is to reposition and relabel the "choose image" button on the right side with the label "Choose Image," while having the label "please select profile picture" remain on the left side within the same input box. This project utilizes Angular and Bootstrap 4.
This code snippet represents HTML markup
<div class="form-group ">
<p class="input-group">
<i class="fa fa-camera fa-2x user-icon fa-fw" aria-hidden="true"></i>
<label for="file">Choose file to upload</label>
<input type="file" name="pic" accept="image/* " class="form-control">
</p>
</div>
This section pertains to CSS styling
.form-control{
background: #000;
color: beige;
}