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.

_popup_menu.scss 2.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. /**
  2. * Initialize
  3. **/
  4. .popupmenu {
  5. text-align: left;
  6. padding: 0;
  7. white-space: nowrap;
  8. &__item {
  9. list-style-type: none;
  10. height: 35px;
  11. &:hover {
  12. background-color: rgba(9, 30, 66, 0.04);
  13. }
  14. }
  15. // Link Appearance
  16. &__link,
  17. &__contents {
  18. color: $modalTextColor;
  19. display: block;
  20. box-sizing: border-box;
  21. text-decoration: none;
  22. height: 100%;
  23. font-size: 9pt;
  24. width: 100%;
  25. cursor: pointer;
  26. padding: 0 5px;
  27. &.disabled {
  28. color: gray !important;
  29. pointer-events: none;
  30. }
  31. }
  32. &__text {
  33. display: inline-block;
  34. vertical-align: middle;
  35. }
  36. &__link {
  37. i {
  38. cursor: pointer;
  39. }
  40. }
  41. &__contents {
  42. display: flex;
  43. /**
  44. * Positioning styles on the slider and its container are used to make
  45. * the container fit the popup width, by removing the slider from the
  46. * page flow, and then making the slider fit the container.
  47. */
  48. .popupmenu__slider_container {
  49. position: relative;
  50. width: 100%;
  51. .popupmenu__slider {
  52. position: absolute;
  53. top: 50%;
  54. transform: translate(0, -50%);
  55. width: 100%;
  56. }
  57. }
  58. }
  59. &__icon {
  60. vertical-align: middle;
  61. position: relative;
  62. display: inline-block;
  63. min-width: 20px;
  64. height: 100%;
  65. > * {
  66. @include absoluteAligning();
  67. }
  68. }
  69. .icon-kick {
  70. font-size: 8pt;
  71. }
  72. }
  73. /**
  74. * Override reset css styling modifying all lists and set negative margin to
  75. * reduce the visibility of padding on AtlasKit
  76. * InlineDialogs.
  77. */
  78. ul.popupmenu {
  79. margin: -15px;
  80. }
  81. span.remotevideomenu:hover ul.popupmenu, ul.popupmenu:hover {
  82. display:block !important;
  83. }
  84. .remote-control-spinner {
  85. top: 6px;
  86. left: 2px;
  87. }