From 5e6b53612a564bd11373670312f28473eb4b861f Mon Sep 17 00:00:00 2001
From: mister-ben <1676039+mister-ben@users.noreply.github.com>
Date: Mon, 9 Sep 2024 21:07:11 +0200
Subject: [PATCH] feat: add class to normalise time control display (#8833)

## Description
Time controls continue to cause confusion as they are included by
default but hidden by default. e.g. #8534 Adding CSS to display them is
not intuitive.

## Specific Changes proposed
Changing the default styles would be problematic before a major version.
This PR proposes adding an optional `vjs-normalise-time-controls` class
a user can add to the player, as an opt in.

This will default all time controls to being shown, except when live
content is playing. Users would then have to remove the time controls in
player options, or with `hide()` or `dispose()`.

## Requirements Checklist
- [ ] Feature implemented / Bug fixed
- [ ] If necessary, more likely in a feature request than a bug fix
- [x] Change has been verified in an actual browser (Chrome, Firefox,
IE)
  - [ ] Unit Tests updated or fixed
  - [ ] Docs/guides updated
- [ ] Example created ([starter template on
JSBin](https://codepen.io/gkatsev/pen/GwZegv?editors=1000#0))
- [ ] Has no DOM changes which impact accessiblilty or trigger warnings
(e.g. Chrome issues tab)
  - [ ] Has no changes to JSDoc which cause `npm run docs:api` to error
- [ ] Reviewed by Two Core Contributors

Co-authored-by: Adam Waldron <acwald@gmail.com>
---
 src/css/components/_time.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/css/components/_time.scss b/src/css/components/_time.scss
index 79643fb2aa..cec3411c63 100644
--- a/src/css/components/_time.scss
+++ b/src/css/components/_time.scss
@@ -19,3 +19,7 @@
   display: none;
   line-height: 3em;
 }
+
+.vjs-normalise-time-controls:not(.vjs-live) .vjs-time-control {
+  display: flex;
+}