Important:
This support area is for Kalium 3 users only. Support for Kalium 4 has moved to our new platform at support.laborator.co. If you’re using Kalium 4, please create a new account there using your email and license key. A password will be sent to you automatically.

Okay
  Public Ticket #906767
Video Player Controls
Closed

Comments

  •  3
    artdsgpuc started the conversation
    September 29, 2016 at 9:58pm

    Hi there! 

    I need some help with changing the color of the video controls overlay. Specifically for the video under the "Como selecionar ou cadastrar uma atividade..." section. The video background is white, so the white controls blend into the background...

    Thanks in advance!

    Mateus

    {"wp":{"use":false,"adminUrl":"http://dad.puc-rio.br/graduacao/atividades-complementares/wp-admin","username":"","password":""},"ftp":{"use":false,"url":"","port":"","user":"","password":"","path":""}}

  •  1,561
    Laborator replied
    September 30, 2016 at 11:27am

    Hi there,

    Paste the following CSS in your Custom CSS area of that page to make them dark:

    .video-js.vjs-default-skin .vjs-big-play-button:after, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-fullscreen-control:before, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-play-control:before, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-volume-menu-button:before,  {
  color: #000 !important;
}

.video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-progress-control .vjs-slider {
  background-color: rgba(0,0,0,0.5) !important;
}

.video-js.vjs-default-skin .vjs-big-play-button:after, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-fullscreen-control:before, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-play-control:before, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-volume-menu-button:before {
  border-color: #000;
}

.video-js.vjs-default-skin .vjs-big-play-button:after, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-fullscreen-control:before, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-play-control:before, .video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-volume-menu-button:before {
  color: #000;
}

.video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-progress-control .vjs-play-progress.vjs-slider-bar {
  background: #000;
}

.video-js.vjs-minimal-skin .vjs-control-bar .vjs-control.vjs-volume-menu-button .vjs-menu .vjs-menu-content .vjs-volume-bar {
  background: rgba(0,0,0,.3);
}

.video-js .vjs-volume-level {
  background-color: #000 !important;
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  •  3
    artdsgpuc replied
    September 30, 2016 at 5:37pm

    Thank you so much, Art, that worked like a charm. One more thing, how could I make the video loop back to the beginning, without playing automatically, once it's played once? Like, play the video, it ends, the video current time returns to 0, with the video preview again, but the video does not play automatically until the play button is pressed.

    Right now, once the video ends it displays a black screen...

    Thanks in advance! - Matt

  •  1,561
    Laborator replied
    October 3, 2016 at 12:22pm

    Hi Matt,

    Unfortunately that's not possible, we have also had tickets before this one requesting the video-loop but that's not possible at the moment.

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group