You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

_popover.scss 1.1KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. /**
  2. * Mousemove padding styles are used to add invisible elements to the popover
  3. * to allow mouse movement from the popover trigger to the popover itself
  4. * without triggering a mouseleave event.
  5. */
  6. .popover-mousemove-padding-bottom {
  7. bottom: -15px;
  8. height: 20px;
  9. position: absolute;
  10. right: 0;
  11. width: 100%;
  12. }
  13. %vertical-popover-padding {
  14. height: 100%;
  15. position: absolute;
  16. top: 0;
  17. width: 40px;
  18. }
  19. .popover-mousemove-padding-left {
  20. @extend %vertical-popover-padding;
  21. left: -20px;
  22. }
  23. .popover-mousemove-padding-right {
  24. @extend %vertical-popover-padding;
  25. right: -20px;
  26. }
  27. /**
  28. * An invisible element is added to the top of the popover to ensure the mouse
  29. * stays over the popover when the popover's height is shrunk, which would then
  30. * normally leave the mouse outside of the popover itself and cause a mouseleave
  31. * event.
  32. */
  33. .popover-mouse-padding-top {
  34. height: 30px;
  35. position: absolute;
  36. right: 0;
  37. top: -25px;
  38. width: 100%;
  39. }
  40. .popover {
  41. background-color: $popoverBg;
  42. border-radius: 3px;
  43. margin: -16px -24px;
  44. padding: 16px 24px;
  45. }