bubble.styl 948 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. themeName = 'bubble'
  2. activeColor = #fff
  3. borderColor = #777
  4. backgroundColor = #444
  5. inactiveColor = #ccc
  6. shadowColor = #ddd
  7. textColor = #fff
  8. @import './core'
  9. @import './base'
  10. @import './bubble/*'
  11. .ql-container.ql-bubble:not(.ql-disabled)
  12. a
  13. position: relative
  14. white-space: nowrap
  15. a::before
  16. background-color: #444
  17. border-radius: 15px
  18. top: -5px
  19. font-size: 12px
  20. color: #fff
  21. content: attr(href)
  22. font-weight: normal
  23. overflow: hidden
  24. padding: 5px 15px
  25. text-decoration: none
  26. z-index: 1
  27. a::after
  28. border-top: 6px solid #444
  29. border-left: 6px solid transparent
  30. border-right: 6px solid transparent
  31. top: 0
  32. content: " "
  33. height: 0
  34. width: 0
  35. a::before, a::after
  36. left: 0
  37. margin-left: 50%
  38. position: absolute
  39. transform: translate(-50%, -100%)
  40. transition: visibility 0s ease 200ms
  41. visibility: hidden
  42. a:hover::before, a:hover::after
  43. visibility: visible