Form Control (+Babel)

Example

Normal

<input placeholder="چیزی بنویس..." className="form-control" />

Normal + Icon

<div className="input-group">

<span className="icon-search"></span>

<input placeholder="جستجوی پست‌ها" className="form-control input-normal" />

</div>

Quiet

<input placeholder="چیزی بنویس..." className="form-control input-quiet" />

Quiet + Icon

<div className="input-group quiet">

<span className="icon-search"></span>

<input placeholder="جستجوی پست‌ها" className="form-control input-quiet" />

</div>

Normal + Clear

<div class="input-group quiet">

<span class="icon-search"></span>

<input placeholder="جستجوی پست‌ها" class="form-control quiet" />

<span class="icon-cross"></span>

</div>

Quiet + Icon + Clear

<div class="input-group quiet">

<span class="icon-search"></span>

<input placeholder="جستجوی پست‌ها" class="form-control quiet" />

<span class="icon-cross"></span>

</div>

React

Normal (React Component)

<Input placeholder="یه چیزی بنویسید..." />

<Input placeholder="یه چیزی بنویسید..." clear />

<Input placeholder="یه چیزی بنویسید..." icon="search" />

<Input placeholder="یه چیزی بنویسید..." icon="search" clear />

<Input placeholder="یه چیزی بنویسید..." icon="search" clear fullWidth />

Quiet (React Component)

<Input placeholder="یه چیزی بنویسید..." quiet />

<Input placeholder="یه چیزی بنویسید..." clear quiet />

<Input placeholder="یه چیزی بنویسید..." icon="search" quiet />

<Input placeholder="یه چیزی بنویسید..." icon="search" clear quiet />

<Input placeholder="یه چیزی بنویسید..." icon="search" clear quiet fullWidth />