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 />