انتخابگر
Huro سبک های پیش فرض را برای عنصر اصلی select Html ارائه می دهد. یک لفاف اضافی برای اعمال درست استایل ها وجود دارد. لطفاً برای جزئیات بیشتر در مورد استفاده به مثال کد مراجعه کنید.
<div class="field">
<div class="select">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
انتخابگر گرد
انتخاب Huro می تواند لبه های گرد داشته باشد. مانند سایر کنترل ها، به سادگی کلاس is-rounded را به عنصر wrapper select اضافه کنید. لطفاً برای جزئیات بیشتر در مورد استفاده به مثال کد مراجعه کنید.
<div class="field">
<div class="select is-rounded">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>
Font Awesome
انتخاب‌های Huro می‌توانند آیکون‌هایی به آنها متصل شوند. آنها به خوبی با نمادهای Font Awesome کار می کنند. می توانید یک عنصر نماد را در داخل انتخاب اضافه کنید. لطفاً برای جزئیات بیشتر در مورد استفاده به مثال کد مراجعه کنید.
<div class="field">
<div class="control has-icons-left">
<div class="select">
<select>
<option selected>کشور</option>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="icon is-small is-left">
<i class="fas fa-globe"></i>
</div>
</div>
</div>
Line Icons
انتخاب‌های Huro می‌توانند آیکون‌هایی به آنها متصل شوند. آنها به خوبی با نمادهای Feather کار می کنند. می توانید یک عنصر نماد را در داخل انتخاب اضافه کنید. لطفاً برای جزئیات بیشتر در مورد استفاده به مثال کد مراجعه کنید.
<div class="field">
<div class="control has-icons-left">
<div class="select">
<select>
<option selected>کشور</option>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="icon is-small is-left">
<i class="lnil lnil-basketball"></i>
</div>
</div>
</div>
Feather Icons
انتخاب‌های Huro می‌توانند آیکون‌هایی به آنها متصل شوند. آنها به خوبی با Line Icons کار می کنند. می توانید یک عنصر نماد را در داخل انتخاب اضافه کنید. لطفاً برای جزئیات بیشتر در مورد استفاده به مثال کد مراجعه کنید.
<div class="field">
<div class="control has-icons-left">
<div class="select">
<select>
<option selected>کشور</option>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
<div class="icon is-small is-left">
<i data-feather="globe"></i>
</div>
</div>
</div>
درحال لود
انتخاب های huro را می توان در حالت بارگذاری نشان داد. برای اعمال آن سبک، به سادگی کلاس is-loading را به عنصر wrapping انتخاب کنید. لطفاً برای جزئیات بیشتر در مورد استفاده به مثال کد مراجعه کنید.
<div class="field">
<div class="select is-loading">
<select>
<option>Select dropdown</option>
<option>With options</option>
</select>
</div>
</div>