feat(popover): Make the popover menus customizable.
This commit is contained in:
parent
81d4f694b7
commit
f439ad2999
|
@ -41,3 +41,10 @@
|
||||||
top: -25px;
|
top: -25px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.popover {
|
||||||
|
background-color: $popoverBg;
|
||||||
|
border-radius: 3px;
|
||||||
|
margin: -16px -24px;
|
||||||
|
padding: 16px 24px;
|
||||||
|
}
|
||||||
|
|
|
@ -5,16 +5,13 @@
|
||||||
.popupmenu {
|
.popupmenu {
|
||||||
min-width: 75px;
|
min-width: 75px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
padding: 0;
|
padding: 0px;
|
||||||
|
width: 150px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
|
||||||
&__item {
|
&__item {
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
height: 35px;
|
height: 35px;
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: rgba(9, 30, 66, 0.04);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Link Appearance
|
// Link Appearance
|
||||||
|
@ -28,6 +25,12 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
|
color: $popupMenuColor;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: $popupMenuHoverBackground;
|
||||||
|
color: $popupMenuHoverColor;
|
||||||
|
}
|
||||||
|
|
||||||
&.disabled {
|
&.disabled {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
@ -62,6 +65,18 @@
|
||||||
top: 50%;
|
top: 50%;
|
||||||
transform: translate(0, -50%);
|
transform: translate(0, -50%);
|
||||||
width: 100%;
|
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.
|
* InlineDialogs.
|
||||||
*/
|
*/
|
||||||
ul.popupmenu {
|
ul.popupmenu {
|
||||||
margin: -15px;
|
margin: -16px -24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
span.remotevideomenu:hover ul.popupmenu, ul.popupmenu:hover {
|
span.remotevideomenu:hover ul.popupmenu, ul.popupmenu:hover {
|
||||||
|
|
|
@ -80,9 +80,12 @@ $errorColor: #c61600;
|
||||||
$feedbackCancelFontColor: #333;
|
$feedbackCancelFontColor: #333;
|
||||||
|
|
||||||
// Popover colors
|
// Popover colors
|
||||||
$popoverBg: #000;
|
$popoverBg: initial;
|
||||||
$popoverFontColor: #ffffff;
|
$popoverFontColor: #ffffff !important;
|
||||||
$popupMenuSelectedItemBackground: rgba(256, 256, 256, .2);
|
$popupMenuColor: #ffffff !important;
|
||||||
|
$popupMenuHoverColor: #ffffff !important;
|
||||||
|
$popupMenuHoverBackground: rgba(255, 255, 255, 0.1);
|
||||||
|
$popupSliderColor: #0376da;
|
||||||
|
|
||||||
// Toolbar
|
// Toolbar
|
||||||
$secondaryToolbarBg: rgba(0, 0, 0, 0.5);
|
$secondaryToolbarBg: rgba(0, 0, 0, 0.5);
|
||||||
|
|
Loading…
Reference in New Issue