مونو- قالب ریسپانسیو داشبورد مدیریت

مونو اجزای متنوعی از Mask Plugin را با کمی سفارشی‌سازی که با استانداردهای طراحی آن مطابقت دارد، ارائه می‌دهد. برای اطلاعات بیشتر، لطفاً به مستندات رسمی Mask Plugin مراجعه کنید.

ورودی های Masked


<!-- Data Input -->
<label class="text-dark font-weight-medium" for="">ورودی تاریخ</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-calendar" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" data-mask="00/00/0000">
</div>
<p style="font-size: 90%">حداکثر. 9999/99/99</p>

<!-- Phone input -->
<label class="text-dark font-weight-medium">ورودی شماره موبایل</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-phone" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" data-mask="(999) 999-9999">
</div>
<p style="font-size: 90%">حداکثر. (999) 999-9999</p>

<!-- Taxpayer Identification Numbers -->
<label class="text-dark font-weight-medium">شماره شناسایی مالیات دهندگان</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-currency-usd" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" data-mask="99-9999999">
</div>
<p style="font-size: 90%">حداکثر. 99-9999999</p>

<!-- Social Security Number -->
<label class="text-dark font-weight-medium">شماره تأمین اجتماعی</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-server-security" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" data-mask="999-99-9999">
</div>
<p style="font-size: 90%">حداکثر. 999-99-9999</p>

<!-- Eye Script -->
<label class="text-dark font-weight-medium">شماره چشم</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-settings" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" data-mask="~9.99 ~9.99 999">
</div>
<p style="font-size: 90%">حداکثر. ~9.99 ~9.99 999</p>

<!-- Credit Card Number -->
<label class="text-dark font-weight-medium">شماره کارت اعتباری</label>
<div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text mdi mdi-credit-card" id="basic-addon1"></span>
  </div>
  <input type="text" class="form-control" data-mask="9999 9999 9999 9999">
</div>
<p style="font-size: 90%">حداکثر. 9999 9999 9999 9999</p>

ورودی تاریخ

حداکثر. 9999/99/99

ورودی شماره موبایل

حداکثر. (999) 999-9999

شماره شناسایی مالیات دهندگان

حداکثر. 99-9999999

شماره تأمین اجتماعی

حداکثر. 999-99-9999

شماره چشم

حداکثر. ~9.99 ~9.99 999

شماره کارت اعتباری

حداکثر. 9999 9999 9999 9999

مونو یک کامپوننت Select 2 با کمی سفارشی‌سازی ارائه می‌دهد که با استانداردهای طراحی آن مطابقت دارد. برای اطلاعات بیشتر، لطفاً به مستندات رسمیSelect 2 مراجعه کنید.

انتخاب چندگانه


<!-- Multiple Select -->
<label class="text-dark font-weight-medium">انتخاب چندگانه</label>
<div class="form-group">
  <select class="js-example-basic-multiple form-control" name="states[]" multiple="multiple">
    <option value="AL">تهران</option>
    <option value="NY">البرز</option>
    <option value="VR">اصفهان</option>
    <option value="WA">فارس</option>
    <option value="CA">بوشهر</option>
    <option value="WY">کرمان</option>
  </select>
</div>

استان

ورودی های Masked

انتخاب چندگانه

مخاطبین