diff --git a/src/css/components/_close-button.scss b/src/css/components/_close-button.scss index 2ebfcd9c3..07193e7b3 100644 --- a/src/css/components/_close-button.scss +++ b/src/css/components/_close-button.scss @@ -1,12 +1,12 @@ .video-js .vjs-control.vjs-close-button { - & .vjs-icon-placeholder { - @extend .vjs-icon-cancel; - } - cursor: pointer; height: 3em; position: absolute; right: 0; top: 0.5em; z-index: 2; + + & .vjs-icon-placeholder { + @extend .vjs-icon-cancel; + } } diff --git a/src/css/components/_layout.scss b/src/css/components/_layout.scss index 5e48b45e9..fdf9d2551 100644 --- a/src/css/components/_layout.scss +++ b/src/css/components/_layout.scss @@ -21,6 +21,9 @@ // Avoiding helvetica: issue #376 font-family: $text-font-family; + // reset word-break inside the player div + word-break: initial; + // Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when // checking fullScreenEnabled. &:-moz-full-screen { position: absolute; } @@ -29,9 +32,6 @@ width: 100% !important; height: 100% !important; } - - // reset word-break inside the player div - word-break: initial; } .video-js[tabindex="-1"] { diff --git a/src/css/components/_volume.scss b/src/css/components/_volume.scss index 904ec90a0..b86de7377 100644 --- a/src/css/components/_volume.scss +++ b/src/css/components/_volume.scss @@ -35,27 +35,30 @@ } .video-js .vjs-volume-panel { + @include transition(width 1s); + &.vjs-hover .vjs-volume-control, &:active .vjs-volume-control, &:focus .vjs-volume-control, & .vjs-volume-control:active, &.vjs-hover .vjs-mute-control ~ .vjs-volume-control, & .vjs-volume-control.vjs-slider-active { + visibility: visible; + opacity: 1; + position: relative; + $transition-property: visibility 0.1s, opacity 0.1s, height 0.1s, width 0.1s, left 0s, top 0s; + @include transition($transition-property); + &.vjs-volume-horizontal { width: 5em; height: 3em; margin-right: 0; } - visibility: visible; - opacity: 1; - position: relative; &.vjs-volume-vertical { left: -3.5em; @include transition(left 0s); } - $transition-property: visibility 0.1s, opacity 0.1s, height 0.1s, width 0.1s, left 0s, top 0s; - @include transition($transition-property); } &.vjs-volume-panel-horizontal { @@ -70,8 +73,6 @@ width: 4em; } } - - @include transition(width 1s); } .video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical {