feat(popover): Make the popover menus customizable.

This commit is contained in:
Hristo Terezov 2019-03-11 11:43:33 +00:00
parent 81d4f694b7
commit f439ad2999
3 changed files with 34 additions and 9 deletions

View File

@ -41,3 +41,10 @@
top: -25px;
width: 100%;
}
.popover {
background-color: $popoverBg;
border-radius: 3px;
margin: -16px -24px;
padding: 16px 24px;
}

View File

@ -5,16 +5,13 @@
.popupmenu {
min-width: 75px;
text-align: left;
padding: 0;
padding: 0px;
width: 150px;
white-space: nowrap;
&__item {
list-style-type: none;
height: 35px;
&:hover {
background-color: rgba(9, 30, 66, 0.04);
}
}
// Link Appearance
@ -28,6 +25,12 @@
width: 100%;
cursor: pointer;
padding: 0 5px;
color: $popupMenuColor;
&:hover {
background-color: $popupMenuHoverBackground;
color: $popupMenuHoverColor;
}
&.disabled {
pointer-events: none;
@ -62,6 +65,18 @@
top: 50%;
transform: translate(0, -50%);
width: 100%;
&::-webkit-slider-runnable-track {
background-color: $popupSliderColor;
}
&::-moz-range-track {
background-color: $popupSliderColor;
}
&::-ms-fill-lower {
background-color: $popupSliderColor;
}
}
}
}
@ -91,7 +106,7 @@
* InlineDialogs.
*/
ul.popupmenu {
margin: -15px;
margin: -16px -24px;
}
span.remotevideomenu:hover ul.popupmenu, ul.popupmenu:hover {

View File

@ -80,9 +80,12 @@ $errorColor: #c61600;
$feedbackCancelFontColor: #333;
// Popover colors
$popoverBg: #000;
$popoverFontColor: #ffffff;
$popupMenuSelectedItemBackground: rgba(256, 256, 256, .2);
$popoverBg: initial;
$popoverFontColor: #ffffff !important;
$popupMenuColor: #ffffff !important;
$popupMenuHoverColor: #ffffff !important;
$popupMenuHoverBackground: rgba(255, 255, 255, 0.1);
$popupSliderColor: #0376da;
// Toolbar
$secondaryToolbarBg: rgba(0, 0, 0, 0.5);