I need to implement a icone
in :after
of this radio
field because I want it to look like the Iwasabletoinsertthecss
normalonlyIamnotabletoimplementtheiconthatwouldbeintheleftcornerofthescreenwhatIamdoingthewrongthingfollowsthecode:
<liclass="col-lg-3 col-xlg-2 ">
<label class="label-image">
<input class="input-image" type="radio" name="fb" value="small" />
<img src="assets/images/covers/cover-01.jpg" class="img-fluid" />
</label>
</li>
<li class="col-lg-3 col-xlg-2 ">
<label class="label-image">
<input class="input-image" type="radio" name="fb" value="small" />
<img src="assets/images/covers/cover-02.jpg" class="img-fluid" />
</label>
</li>
SCSS:
.label-image > .input-image {
visibility: hidden;
position: absolute;
+ img {
cursor: pointer;
border: 5px solid transparent;
}
&:checked + img {
border: 25px solid $white;
position: relative;
&:after{
content: "\f00c";
font-family: "Font Awesome 5 Brands";
position: absolute;
right: 0;
top: 0;
color: $white;
font-size: 30px;
background-color: $orange;
border-radius: 100px;
padding: 15px;
}
}
}