34 lines
653 B
SCSS
34 lines
653 B
SCSS
.component-volume-control {
|
|
display: flex;
|
|
line-height: inherit;
|
|
align-items: center;
|
|
position: relative;
|
|
overflow: visible;
|
|
top: 3px;
|
|
input {
|
|
max-width: 5.5em;
|
|
height: 4px;
|
|
}
|
|
&.expandable {
|
|
.popup {
|
|
background-color: #1B1C1D;
|
|
position: absolute;
|
|
left: -4em;
|
|
top: -7em;
|
|
transform: rotate(-90deg);
|
|
display: flex;
|
|
align-items: center;
|
|
height: 2.5em;
|
|
padding: 0 0.5em;
|
|
box-shadow: 1px 1px 3px rgba(125, 125, 125, 0.5);
|
|
}
|
|
input {
|
|
max-width: 8.5em;
|
|
padding: 1em 0em;
|
|
}
|
|
&:not(:hover):not(.expanded) .popup {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|