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.

_jitsi_popover.scss 2.2KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. .jitsipopover {
  2. position: absolute;
  3. top: 0;
  4. left: 0;
  5. z-index: $jitsipopoverZ;
  6. display: table;
  7. visibility: hidden;
  8. max-width: 300px;
  9. min-width: 100px;
  10. text-align: left;
  11. color: $popoverFontColor;
  12. background-color: $popoverBg;
  13. background-clip: padding-box;
  14. border-radius: $borderRadius;
  15. /*-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);*/
  16. /*box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4);*/
  17. white-space: normal;
  18. margin-top: -$popoverMenuPadding;
  19. &__menu-padding,
  20. &__menu-padding-top {
  21. position: absolute;
  22. width: 100px;
  23. }
  24. /**
  25. * Invisible padding is added to the bottom of the popover to extend its
  26. * height so it does not close when moving the mouse from the trigger
  27. * element towards the popover itself.
  28. */
  29. &__menu-padding {
  30. bottom: -$popoverMenuPadding;
  31. height: $popoverMenuPadding;
  32. }
  33. /**
  34. * Invisible padding is added to the top of the popover to extend its height
  35. * so it does not close automatically when its height is shrunk from showing
  36. * less video statistics.
  37. */
  38. &__menu-padding-top {
  39. height: 20px;
  40. top: -20px;
  41. }
  42. &__showmore {
  43. display: block;
  44. text-align: center;
  45. width: 90px;
  46. margin: 10px auto;
  47. }
  48. > .arrow {
  49. position: absolute;
  50. display: block;
  51. left: 50%;
  52. bottom: -5px;
  53. margin-left: -5px;
  54. width: 0;
  55. height: 0;
  56. border-color: transparent;
  57. border-top-color: $popoverBg;
  58. border-style: solid;
  59. border-width: 5px;
  60. border-bottom-width: 0;
  61. }
  62. /**
  63. * Override default "top" styles to support popovers appearing from the
  64. * left of the popover trigger element.
  65. */
  66. &.left {
  67. margin-left: -$popoverMenuPadding;
  68. margin-top: 0;
  69. .arrow {
  70. border-color: transparent transparent transparent $popoverBg;
  71. border-width: 5px 0px 5px 5px;
  72. margin-left: 0;
  73. margin-top: -5px;
  74. }
  75. .jitsipopover {
  76. &__menu-padding {
  77. bottom: 0;
  78. height: 100%;
  79. width: $popoverMenuPadding;
  80. }
  81. }
  82. }
  83. }