Input

Text Input

By default artsy ui inputs are outline styled, to change to standard style input add class input-std to the input.
To mark a input as req just add class input-req to the div.

First Name

<div class="artsy-input" >
      <label class="input-label">First Name</label>
      <input  type="text"/>
  </div>
  <div class="artsy-input input-req" >
      <label class="input-label">First Name</label>
      <input type="text"/>
  </div>

  <div class="artsy-input" >
      <label class="input-label">First Name</label>
      <input class="input-std" type="text"/>
  </div>

Input with Icon

Add a icon and give class icon-input to the div.

<div class="artsy-input icon-input" >
      <label class="input-label">search</label>
      <i class="fas fa-search"></i>
      <input  type="text"/>
  </div>

Input with Validation

Add class input-err/input-success for validation inputs

username username not available

username username available

<div class="artsy-input input-req input-err" >
      <label class="input-label">username</label>
      <input class="input-outlined" type="text"/>
      <span class="input-desc">username not available</span>
  </div>
  <div class="artsy-input input-req input-success" >
      <label class="input-label">username</label>
      <input class="input-outlined" type="text"/>
      <span class="input-desc">username available</span>
  </div>

Textarea Input

comment

<div class="artsy-input " >
      <label class="input-label">comment</label>
      <textarea class="input-outlined" type="text"></textarea>
  </div>