<div class="mb-50">
  <p class="fw-bold  mb-50">Type</p>
  <div class="form-check form-check-inline">
    <label class="form-check-label" for="inlineSlider">Slider</label>
    <input class="form-check-input" type="radio" name="layoutType" id="inlineSlider" value="slider" v-model="layoutType">
  </div>
  <div class="form-check form-check-inline">
    <input class="form-check-input" type="radio" name="layoutType" id="inlineGrid" value="grid" v-model="layoutType">
    <label class="form-check-label" for="inlineGrid">Grid</label>
  </div>
 <!--  <div class="form-check form-check-inline">
    <input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio3" value="list" v-model="layoutType">
    <label class="form-check-label" for="inlineRadio3">List</label>
  </div> -->
</div>
<div class="mb-50">
  <div class="row g-3 align-items-center">
    <div class="col-6">
        <label for="views" class="col-form-label">Views</label>
        <input type="number" id="views" class="form-control"  max="3" v-model="layoutView"  @change="changeViews">
    </div>
     
  </div>
</div>


