captcha.scss 642 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. .cl-captcha {
  2. position: relative;
  3. width: 100%;
  4. overflow: hidden;
  5. &__input {
  6. position: absolute;
  7. left: -100%;
  8. height: 100%;
  9. width: 200%;
  10. opacity: 0;
  11. }
  12. &__code {
  13. display: flex;
  14. width: 100%;
  15. }
  16. &__item {
  17. display: flex;
  18. justify-content: center;
  19. align-items: center;
  20. flex: 1;
  21. background-color: #ebecee;
  22. border-radius: 10rpx;
  23. }
  24. &__value {
  25. font-size: 40rpx;
  26. font-weight: 500;
  27. }
  28. &__cursor {
  29. height: 40rpx;
  30. width: 4rpx;
  31. background-color: #000;
  32. animation: flash 1s infinite ease;
  33. }
  34. @keyframes flash {
  35. 0% {
  36. opacity: 0.2;
  37. }
  38. 50% {
  39. opacity: 0.5;
  40. }
  41. 100% {
  42. opacity: 0.2;
  43. }
  44. }
  45. }