Эффекты при клике

Вы можете задать классы для элементов, которые добавят эффект расходящейся волны при клике на элемент. Данный эффект используется в Material Design.

Использование эффекта

Для включения данного эффекта вам необходимо добавить класс .wave для волны с затемнением и класс .wave-light для волны с осветлением.

волна
светлая волна
<div class="d-inline-block m-4 hr-4 wr-4 t-center bg-white shadow-2 hover:shadow-10 transition wave">
  <div class="align-middle c-text-secondary">волна</div>
</div>
<div class="d-inline-block m-4 hr-4 wr-4 t-center bg-blue-grey-700 c-white shadow-2 hover:shadow-10 transition wave-light">
  <div class="align-middle c-white">светлая волна</div>
</div>

Кнопки

Для кнопок данный эффект включен по умолчанию

<button type="button" class="btn btn-default">По умолчанию</button>	
<button type="button" class="btn btn-primary">Основной</button>
<button type="button" class="btn btn-secondary">Вторичный</button>
<button type="button" class="btn btn-success">Успех</button>
<button type="button" class="btn btn-info">Информация</button>
<button type="button" class="btn btn-warning">Предупреждение</button>
<button type="button" class="btn btn-danger">Опасность</button>