| | |
| | | .video-react .video-react-volume-menu-button, .video-react .video-react-play-control, .video-react .video-react-play-progress, .video-react .video-react-big-play-button { |
| | | /* use !important to prevent issues with browser extensions that change fonts */ |
| | | font-family: "video-react" !important; |
| | | speak: none; |
| | | // speak: none; |
| | | font-style: normal; |
| | | font-weight: normal; |
| | | font-variant: normal; |
| | |
| | | ginormous. If you'd like to enable the current time tooltip all the time, this should be disabled |
| | | to avoid a weird hitch when you roll off the hover. */ |
| | | .video-react .video-react-progress-control:hover .video-react-time-tooltip, |
| | | .video-react .video-react-progress-control:hover .video-react-mouse-display:after, |
| | | .video-react .video-react-progress-control:hover .video-react-play-progress:after { |
| | | .video-react .video-react-progress-control:hover .video-react-mouse-display:after { |
| | | visibility: visible; |
| | | font-size: 0.6em; |
| | | } |
| | |
| | | } |
| | | .video-react .video-react-play-progress:before { |
| | | position: absolute; |
| | | top: -0.3333333333em; |
| | | top: -4px; |
| | | right: -0.5em; |
| | | font-size: 0.9em; |
| | | } |
| | | |
| | | .video-react .video-react-time-tooltip, |
| | | .video-react .video-react-mouse-display:after, |
| | | .video-react .video-react-play-progress:after { |
| | | .video-react .video-react-mouse-display:after { |
| | | visibility: hidden; |
| | | pointer-events: none; |
| | | position: absolute; |
| | |
| | | } |
| | | |
| | | .video-react .video-react-time-tooltip, |
| | | .video-react .video-react-play-progress:before, |
| | | .video-react .video-react-play-progress:after { |
| | | .video-react .video-react-play-progress:before { |
| | | z-index: 1; |
| | | } |
| | | |
| | |
| | | } |
| | | .video-react .video-react-slider-vertical .video-react-volume-level:before { |
| | | top: -0.5em; |
| | | left: -0.3em; |
| | | left: -4px; |
| | | } |
| | | .video-react .video-react-slider-horizontal .video-react-volume-level { |
| | | height: 0.3em; |
| | | } |
| | | .video-react .video-react-slider-horizontal .video-react-volume-level:before { |
| | | top: -0.3em; |
| | | top: -4px; |
| | | right: -0.5em; |
| | | } |
| | | .video-react .video-react-menu-button-popup.video-react-volume-menu-button .video-react-menu { |
| | |
| | | .video-react video::-webkit-media-text-track-container { |
| | | -webkit-transform: translateY(-30px); |
| | | transform: translateY(-30px); |
| | | } |
| | | |
| | | .video-react .video-react-play-progress:after { |
| | | display: none; |
| | | } |
| | | |
| | | .video-react .video-react-current-time { |
| | | padding-left: 0px; |
| | | padding-right: 4px; |
| | | } |
| | | .video-react .video-react-duration { |
| | | padding-left: 4px; |
| | | padding-right: 10px; |
| | | } |