mdc.line-ripple.css 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. /**
  2. * @license
  3. * Copyright Google LLC All Rights Reserved.
  4. *
  5. * Use of this source code is governed by an MIT-style license that can be
  6. * found in the LICENSE file at https://github.com/material-components/material-components-web/blob/master/LICENSE
  7. */
  8. .mdc-line-ripple::before, .mdc-line-ripple::after {
  9. position: absolute;
  10. bottom: 0;
  11. left: 0;
  12. width: 100%;
  13. border-bottom-style: solid;
  14. content: "";
  15. }
  16. .mdc-line-ripple::before {
  17. z-index: 1;
  18. }
  19. .mdc-line-ripple::after {
  20. -webkit-transform: scaleX(0);
  21. transform: scaleX(0);
  22. opacity: 0;
  23. z-index: 2;
  24. }
  25. .mdc-line-ripple--active::after {
  26. -webkit-transform: scaleX(1);
  27. transform: scaleX(1);
  28. opacity: 1;
  29. }
  30. .mdc-line-ripple--deactivating::after {
  31. opacity: 0;
  32. }
  33. .mdc-line-ripple::before {
  34. border-bottom-width: 1px;
  35. }
  36. .mdc-line-ripple::after {
  37. border-bottom-width: 2px;
  38. }
  39. .mdc-line-ripple::after {
  40. transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
  41. transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
  42. transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
  43. }
  44. /*# sourceMappingURL=mdc.line-ripple.css.map*/