LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Resolve player icon hover conflict (#1637)

Browse source
This commit is contained in:
Rave | 図書館猫 2022-06-05 15:06:11 +02:00 committed by GitHub
parent e83d667b25
commit c146ccc432
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
ui/scss/component/_button.scss
View file

@ -179,8 +179,8 @@ a.button--alt {
order: 1;
background-repeat: no-repeat;
// background-position: center;
background-position: center 9.5px;
background-size: 28px;
background-position: center 12.5px;
background-size: 23px;
padding: 10px;
opacity: 0.8 !important;
margin-left: var(--spacing-xs);
@ -205,7 +205,7 @@ a.button--alt {
display: block;
background-repeat: no-repeat;
background-position: center;
background-size: 28px;
background-size: 23px;
&:focus:not(:focus-visible) {
display: block;
@ -214,7 +214,7 @@ a.button--alt {
}
@media (max-width: $breakpoint-small) {
background-size: 24px;
background-size: 26px;
}
}

18
ui/scss/component/_file-render.scss
View file

@ -541,8 +541,7 @@ $control-bar-height-mobile: 44px;
$control-bar-font-size: 0.9rem;
$control-bar-popup-font-size: 0.8rem;
// $control-bar-icon-size: 1.9rem;
$control-bar-icon-size: 36px;
$control-bar-icon-size-mobile: 30px;
$control-bar-icon-size: 30px;
.video-js-parent {
height: 100%;
@ -636,13 +635,12 @@ $control-bar-icon-size-mobile: 30px;
font-size: $control-bar-icon-size;
line-height: $control-bar-height;
@media (max-width: $breakpoint-small) {
font-size: $control-bar-icon-size-mobile !important;
line-height: $control-bar-height-mobile !important;
}
}
.vjs-quality-selector {
// margin-top: -6px;
margin-left: var(--spacing-xs);
.vjs-icon-placeholder {
font-size: $control-bar-font-size;
span {
@ -688,6 +686,8 @@ $control-bar-icon-size-mobile: 30px;
}
div.vjs-playback-rate {
margin-left: var(--spacing-xs);
margin-right: calc(var(--spacing-xs) * -1);
.vjs-playback-rate-value {
font-size: $control-bar-font-size;
line-height: $control-bar-height;
@ -732,8 +732,8 @@ $control-bar-icon-size-mobile: 30px;
margin-left: var(--spacing-xs);
margin-right: 2px;
.vjs-icon-placeholder {
$chromecast-icon-size: 30.5px;
margin-top: 1.5px;
$chromecast-icon-size: 25px;
margin-top: 3px;
width: $chromecast-icon-size;
height: $chromecast-icon-size;
}
@ -741,8 +741,8 @@ $control-bar-icon-size-mobile: 30px;
@media (max-width: $breakpoint-small) {
.vjs-icon-placeholder {
margin-top: 2px;
width: 23px;
height: 23px;
width: 26px;
height: 26px;
}
}
}
@ -772,7 +772,7 @@ $control-bar-icon-size-mobile: 30px;
.vjs-button--play-next,
.vjs-mute-control {
.vjs-icon-placeholder::before {
// font-size: 1.9rem;
font-size: 26px !important;
font-size: $control-bar-icon-size;
}
@media (max-width: $breakpoint-small) {

4
ui/scss/component/_videojs.scss
View file

@ -245,6 +245,10 @@ $control-bar-popup-font-size: 0.8rem;
}
}
.vjs-workinghover .vjs-menu-button-popup:hover .vjs-menu {
display: none;
}
.vjs-slider-horizontal {
background-color: #474747 !important;
}