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 %vertical-popover-padding { 7 height: 100%; 8 position: absolute; 9 top: 0; 10 width: 20px; 11 padding: 20px 0; 12 top: -20px; 13 } 14 15 %horizontal-popover-padding { 16 height: 25px; 17 position: absolute; 18 right: 0; 19 width: 100%; 20 padding: 0 35px; 21 left: -35px; 22 } 23 24 .popover-mousemove-padding-left { 25 @extend %vertical-popover-padding; 26 left: -35px; 27 } 28 29 .popover-mousemove-padding-right { 30 @extend %vertical-popover-padding; 31 right: -35px; 32 } 33 34 .popover-mousemove-padding-bottom { 35 @extend %horizontal-popover-padding; 36 bottom: -40px; 37 } 38 39 .popover-mousemove-padding-top { 40 @extend %horizontal-popover-padding; 41 top: -40px; 42 } 43 44 .popover { 45 margin: -16px -24px; 46 z-index: $popoverZ; 47 }