_guide.scss 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. .guide {
  2. position: relative;
  3. &:not(.floating-mode) {
  4. &.top {
  5. transform: translateY(-100%);
  6. }
  7. .bubble {
  8. --arrow-width: 14px;
  9. --arrow-height: 10px;
  10. --padding: 10px;
  11. --bottom-left: 20px;
  12. .bubble-layer {
  13. min-height: auto;
  14. min-width: auto;
  15. padding-right: 30px;
  16. .guide-close {
  17. position: absolute;
  18. right: 10px;
  19. top: 10px;
  20. // margin-top: 2px;
  21. font-size: 12px;
  22. }
  23. }
  24. }
  25. .guide-bubble {
  26. .default-msg {
  27. white-space: nowrap;
  28. }
  29. }
  30. }
  31. }
  32. .guide-floating {
  33. color: #fff;
  34. font-size: 14px;
  35. &.top {
  36. transform: translateY(-100%);
  37. }
  38. .bubble {
  39. --arrow-width: 14px;
  40. --arrow-height: 10px;
  41. --padding: 10px;
  42. --bottom-left: 20px;
  43. position: static;
  44. .bubble-layer {
  45. min-height: auto;
  46. min-width: auto;
  47. padding-right: 30px;
  48. .guide-close {
  49. position: absolute;
  50. right: 10px;
  51. top: 10px;
  52. // margin-top: 2px;
  53. font-size: 12px;
  54. }
  55. }
  56. }
  57. .guide-bubble {
  58. .default-msg {
  59. white-space: nowrap;
  60. }
  61. }
  62. }