Contact Form 7 with icon font awesome 5

28 May 2020
0 Comments
                
                    
.ct-ss2{
  background-image: url("../img/bg-ct-ss2.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  form{
    input,textarea{
      border-radius: 5px;
      box-shadow: none;
    }
    input{
      height: 60px;
      padding-left: 50px;
    }
    textarea{
      height: 135px;
      padding-left: 50px;
    }
    span{
      &.wpcf7-form-control-wrap{
        &:before{
          font-family: "Font Awesome 5 Free";
          font-weight: bold;
          position: absolute;
          left: 20px;
          top: 18px;
        }
        &.your-name{
          &:before{
            content: "\f007";
          }
        }
        &.your-phone{
          &:before{
            content: "\f879";
          }
        }
        &.your-email{
          &:before{
            content: "\f0e0";
          }
        }
        &.your-message{
          &:before{
            content: "\f303";
            left: 20px;
            top: 13px;
          }
        }
      }
    }

  }
}
                
            

Leave a Reply

This site uses cookies to offer you a better browsing experience. By browsing this website, you agree to our use of cookies.