diff --git a/assets/css/player.css b/assets/css/player.css index e730924a..80437d90 100644 --- a/assets/css/player.css +++ b/assets/css/player.css @@ -60,10 +60,8 @@ Styles copied from video-js.min.css, definition of .vjs-big-play-centered .vjs-big-play-button */ - top: 50%; - left: 50%; - /*margin-top: -0.81666em; - margin-left: -1.5em;*/ + top: calc(50% - 1.5em); + left: calc(50% - 1.5em); } .video-js.player-style-youtube .vjs-menu-button-popup .vjs-menu { @@ -398,24 +396,7 @@ video#player_html5_api { a:not([data-id]) > .icon, .pure-u-lg-1-5 > .h-box > a[href^="/watch?"], .playlist-restricted > ol > li > a { color: #c0c0c0; } -/* -.video-js.vjs-fullscreen .vjs-control-bar::before { - content: ''; - display: block !important; - visibility: visible !important; - opacity: 1 !important; - width: calc(16.3vw * 0.75); - height: calc(8.645833vw * 0.75); - border: solid 3px rgb(230,230,230); - position: relative; - bottom: calc(6px + 8.645833vw * 0.75); - background-image: url(../CMovie.svg), url(../Wasser.png); - background-repeat: no-repeat; - background-position-y: calc(8.645833vw * 0.75 * 0.22), 0; - box-shadow: 0.3em 0.3em 0.5em rgba(0,0,0,0.8); - z-index: 100; -} -*/ + .video-js .vjs-vtt-thumbnail-display{ box-shadow: 0.3em 0.3em 0.5em rgba(0,0,0,1) !important; border-radius: 7px !important; @@ -428,6 +409,27 @@ a:not([data-id]) > .icon, .pure-u-lg-1-5 > .h-box > a[href^="/watch?"], .playlis text-shadow: 0.2em 0.2em 0.5em rgb(0 0 0 / 75%), 0 0 0.2em #000000; } +.vjs-loading-spinner { + display: none; + box-sizing: border-box; + position: absolute; + top: calc(50% - 1.5em); + left: calc(50% - 1.5em); + height: 80px; + width: 80px; + margin: auto; + cursor: pointer; + border: 0.7vmin solid var(--colorBlueDrk); + color: #cccccc; + background-color: transparent; + aspect-ratio: 1 / 1 !important; + -webkit-aspect-ratio: 1 / 1 !important; + box-shadow: 5px 5px 9px rgba(0,0,0,0.8), 0em 0em 0.5em rgba(0, 0, 0,0.5); + border-radius: 50%; + opacity: 0.85; + visibility: hidden; +} + @media screen and (max-width: 700px) { .video-js .vjs-share { justify-content: unset;