inputmask.css 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. mark.im-caret {
  2. animation: 1s blink step-end infinite !important;
  3. }
  4. mark.im-caret-select {
  5. background-color: rgba(0, 0, 0, 0.25);
  6. }
  7. @keyframes blink {
  8. from, to {
  9. border-right-color: black;
  10. }
  11. 50% {
  12. border-right-color: transparent;
  13. }
  14. }
  15. span.im-static {
  16. color: grey;
  17. }
  18. div.im-colormask {
  19. display: inline-block;
  20. border-style: inset;
  21. border-width: 2px;
  22. appearance: textfield;
  23. cursor: text;
  24. }
  25. div.im-colormask > input, div.im-colormask > input:-webkit-autofill {
  26. position: absolute !important;
  27. display: inline-block;
  28. background-color: transparent;
  29. color: transparent;
  30. -webkit-text-fill-color: transparent;
  31. transition: background-color 5000s ease-in-out 0s;
  32. caret-color: transparent;
  33. appearance: caret;
  34. border-style: none;
  35. left: 0; /*calculated*/
  36. }
  37. div.im-colormask > input:focus {
  38. outline: none;
  39. }
  40. div.im-colormask > input::selection {
  41. background: none;
  42. }
  43. div.im-colormask > input::-moz-selection {
  44. background: none;
  45. }
  46. div.im-colormask > input:-webkit-autofill ~ div {
  47. background-color: rgb(250, 255, 189);
  48. }
  49. div.im-colormask > div {
  50. color: black;
  51. display: inline-block;
  52. width: 100px; /*calculated*/
  53. }