Calendar

  
   
    <div class=" row">
   <div class="mb-3 mt-2 col-md-6">
   <label for="exampleFormControlInput1" class="form-label">Form Date</label>
   <div>
      <input class="form-control datepicker calendar" placeholder="YYYY/MM/DD HH:MM"  type="text" >
      
   </div>
</div>
<div class="mb-3 mt-2 col-md-6">
   <label for="exampleFormControlInput2" class="form-label"> Field Date</label>
   <div>
      <input class="form-control datepicker calendar" placeholder="YYYY/MM/DD HH:MM"  type="text" >
      
   </div>
</div>

   

    
</div>
        
             

  
   
      .flatpickr-input[readonly] {
         cursor: pointer;
     }
     .calendar {
         background: url(../img/calendar.svg) no-repeat left;
         background-position: 98%;
     }
     .form-control {
         color: #363431;
         font-size: 12px;
     }
     .form-control {
         display: block;
         width: 100%;
         padding: 0.375rem 0.75rem;
         font-size: 1rem;
         font-weight: 400;
         line-height: 1.5;
         color: #9D9D9B;
         background-color: #fff;
         background-clip: padding-box;
         border: 1.5px solid #DFE1E6;
         appearance: none;
         border-radius: 6px;
         transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
     }