Visão geral do Web Components Ripple
O componente Ondulação Ignite UI for Web Components cria uma animação em resposta a um toque ou clique do mouse.
Web Components Ripple Example
Usage
Primeiro, você precisa instalar o Ignite UI for Web Components executando o seguinte comando:
npm install igniteui-webcomponents
Antes de usar o IgcRippleComponent, você precisa registrá-lo da seguinte forma:
import { defineComponents, IgcRippleComponent } from "igniteui-webcomponents";
import 'igniteui-webcomponents/themes/light/bootstrap.css';
defineComponents(IgcRippleComponent);
Para uma introdução completa ao Ignite UI for Web Components, leia o tópico Introdução.
A maneira mais simples de começar a usar o IgcRippleComponent é a seguinte:
<igc-button>
<igc-ripple></igc-ripple>
Ripple Button
</igc-button>
Você pode adicionar o IgcRippleComponent componente a qualquer elemento da web, desde que sua propriedade CSS position esteja definida como qualquer outro valor que static;
Examples
Color
Você pode alterar a cor da ondulação definindo a propriedade CSS--color para qualquer cor CSS válida:
igc-ripple {
--color: olive;
}