How to add collapse button in ion card header? I was trying:
<div class="list card">
<div class="item item-divider">Пошук
<i class="icon ion-chevron-right icon-accessory ion-star"></i>
</div>
<div class="item item-body">
<label class="item item-input item-select">
<div class="input-label">
Звіти
</div>
<select mobi_select_picker=true data-role="none">
<option value=''>Всі</option>
<option value='1'>Осаго</option>
<option value='2'>Каско</option>
</select>
</label>
</div>
</div>
i want something like that:
http://s18.postimg.org/d9si9ixjd/toggle_card.png
But it is not working. Any ideas?
You will have to add an anchor tag with icon inside the item-divider
div.
<a href="#" class="item-icon-right">
<i class="icon ion-minus"></i>
</a>
So now your HTML will look like:
<div class="list card">
<div class="item item-divider">Пошук
<a href="#" class="item-icon-right">
<i class="icon ion-minus"></i>
</a>
</div>
<div class="item item-body">
<label class="item item-input item-select">
<div class="input-label">
Звіти
</div>
<select mobi_select_picker=true data-role="none">
<option value=''>Всі</option>
<option value='1'>Осаго</option>
<option value='2'>Каско</option>
</select>
</label>
</div>
</div>
You can check this Codepen and tell me if that is what you wanted.