index.module.less 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. .container {
  2. svg {
  3. overflow: visible;
  4. }
  5. :global(#custom-cursor-hint) {
  6. background-color: var(--cursor-background-color);
  7. }
  8. :global(#custom-cursor-bg-hint) {
  9. background-color: var(--section-background-color);
  10. }
  11. img {
  12. // display: inline-block !important;
  13. min-height: calc(80PX * var(--osdm-zoom));
  14. margin: auto;
  15. aspect-ratio: unset;
  16. margin-top: calc(-20PX * var(--osdm-zoom));
  17. content: url('data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7');
  18. background-color: var(--cursor-background-color);
  19. background-repeat: repeat-y;
  20. background-position-x: calc(15PX * var(--osdm-zoom));
  21. width: calc(10PX * var(--osdm-zoom));
  22. transform: translateX(calc(10PX * var(--osdm-zoom)));
  23. border-radius: calc(4PX * var(--osdm-zoom));
  24. overflow: hidden;
  25. }
  26. }
  27. :global(.hideCursor) {
  28. .container{
  29. img{
  30. opacity: 0;
  31. }
  32. }
  33. }
  34. :global(.eyeProtection) {
  35. .container {
  36. :global(#custom-cursor-hint) {
  37. background-color: var(--eye-cursor-background-color) !important;
  38. }
  39. :global(#custom-cursor-bg-hint) {
  40. background-color: var(--eye-section-background-color) !important;
  41. }
  42. img {
  43. background-color: var(--eye-cursor-background-color);
  44. }
  45. }
  46. }
  47. .container.eyeProtection {
  48. background-color: #fff0d6;
  49. }