index.less 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. @import "../styles/mixins/index.less";
  2. @import "../styles/themes/index.less";
  3. .@{wux-prefix}-qrcode {
  4. display: flex;
  5. justify-content: center;
  6. align-items: center;
  7. position: relative;
  8. width: 100%;
  9. height: 100%;
  10. overflow: hidden;
  11. &__canvas {
  12. position: absolute;
  13. left: -9999em;
  14. top: -9999em;
  15. // (fix) canvasToTempFilePath:fail no image found
  16. // display: none;
  17. opacity: 0;
  18. visibility: hidden;
  19. }
  20. &__image {
  21. display: flex;
  22. width: 100%;
  23. height: 100%;
  24. }
  25. &__mask {
  26. position: absolute;
  27. z-index: 10;
  28. display: flex;
  29. flex-direction: column;
  30. justify-content: center;
  31. align-items: center;
  32. width: 100%;
  33. height: 100%;
  34. color: @heading-color;
  35. background: fade(@white, 85%);
  36. text-align: center;
  37. font-size: @font-size-base;
  38. line-height: @line-height-base;
  39. }
  40. &__expired {
  41. color: @heading-color;
  42. }
  43. &__refresh {
  44. position: relative;
  45. display: flex;
  46. align-items: center;
  47. font-weight: 400;
  48. white-space: nowrap;
  49. text-align: center;
  50. height: 32px;
  51. padding: 4px 15px;
  52. box-sizing: border-box;
  53. color: @spin-color;
  54. }
  55. &__icon {
  56. display: inline-flex;
  57. vertical-align: middle;
  58. font-size: 0;
  59. margin-right: @margin-component-base;
  60. }
  61. }