Skip to main content

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