Modernize Video Player Controls & Refactor Styles #192

Closed

qarqun wants to merge 0 commits from main into main

qarqun commented

2025-10-18 18:07:42 +00:00

(Migrated from github.com)

Overview

This PR improves the video player controls by modernizing their appearance and refactoring the styles into a dedicated stylesheet for better maintainability.

Visual Changes

Redesigned skip controls with rotating icons for better user feedback
Enhanced play/pause button with larger touch target and semi-transparent background
Improved visual hierarchy of player controls
Consistent button dimensions and spacing

Technical Improvements

Implemented proper flexbox layout for control positioning
Added semi-transparent backgrounds for better visibility over any video content
Optimized component structure with proper style organization

Testing

Tested skip functionality with both buttons
Verified play/pause button behavior
Confirmed proper layout on different screen sizes
Checked visual appearance over light and dark video content

## Overview This PR improves the video player controls by modernizing their appearance and refactoring the styles into a dedicated stylesheet for better maintainability. ### Visual Changes - Redesigned skip controls with rotating icons for better user feedback - Enhanced play/pause button with larger touch target and semi-transparent background - Improved visual hierarchy of player controls - Consistent button dimensions and spacing ### Technical Improvements - Implemented proper flexbox layout for control positioning - Added semi-transparent backgrounds for better visibility over any video content - Optimized component structure with proper style organization ### Testing - [x] Tested skip functionality with both buttons - [x] Verified play/pause button behavior - [x] Confirmed proper layout on different screen sizes - [x] Checked visual appearance over light and dark video content

gitguardian[bot] commented

2025-10-18 18:08:19 +00:00

(Migrated from github.com)

⚠️ GitGuardian has uncovered 1 secret following the scan of your pull request.

Please consider investigating the findings and remediating the incidents. Failure to do so may lead to compromising the associated services or software components.

Since your pull request originates from a forked repository, GitGuardian is not able to associate the secrets uncovered with secret incidents on your GitGuardian dashboard.
Skipping this check run and merging your pull request will create secret incidents on your GitGuardian dashboard.

🔎 Detected hardcoded secret in your pull request

GitGuardian id	GitGuardian status	Secret	Commit	Filename
20515118	Triggered	Generic High Entropy Secret	`f895428e3d`	src/components/metadata/TrailersSection.tsx	View secret

🛠 Guidelines to remediate hardcoded secrets

Understand the implications of revoking this secret by investigating where it is used in your code.
Replace and store your secret safely. Learn here the best practices.
Revoke and rotate this secret.
If possible, rewrite git history. Rewriting git history is not a trivial act. You might completely break other contributing developers' workflow and you risk accidentally deleting legitimate data.

To avoid such incidents in the future consider

following these best practices for managing and storing secrets including API keys and other credentials
install secret detection on pre-commit to catch secret before it leaves your machine and ease remediation.

^{🦉 GitGuardian detects secrets in your source code to help developers and security teams secure the modern development process. You are seeing this because you or someone else with access to this repository has authorized GitGuardian to scan your pull request.}

#### ⚠️ GitGuardian has uncovered 1 secret following the scan of your pull request. Please consider investigating the findings and remediating the incidents. Failure to do so may lead to compromising the associated services or software components. Since your pull request originates from a forked repository, GitGuardian is not able to associate the secrets uncovered with secret incidents on your GitGuardian dashboard. Skipping this check run and merging your pull request will create secret incidents on your GitGuardian dashboard. <details> <summary>🔎 Detected hardcoded secret in your pull request</summary> | GitGuardian id | GitGuardian status | Secret | Commit | Filename | | | -------------- | ------------------ | ------------------------------ | ---------------- | --------------- | -------------------- | | [20515118](https://dashboard.gitguardian.com/workspace/641164/incidents/20515118) | Triggered | Generic High Entropy Secret | f895428e3d083e061523ae912c61a3b2f3d8f05f | src/components/metadata/TrailersSection.tsx | [View secret](https://github.com/tapframe/NuvioStreaming/commit/f895428e3d083e061523ae912c61a3b2f3d8f05f#diff-cc7dee7a2fecfa9d0f4e729610094b620144eff62cf1c8147358edfb7aad6b6dR142) | </details> <details> <summary>🛠 Guidelines to remediate hardcoded secrets</summary> 1. Understand the implications of revoking this secret by investigating where it is used in your code. 2. Replace and store your secret safely. [Learn here](https://blog.gitguardian.com/secrets-api-management?utm_source=product&utm_medium=GitHub_checks&utm_campaign=check_run_comment) the best practices. 3. Revoke and [rotate this secret](https://docs.gitguardian.com/secrets-detection/secrets-detection-engine/detectors/generics/generic_high_entropy_secret#revoke-the-secret?utm_source=product&utm_medium=GitHub_checks&utm_campaign=check_run_comment). 4. If possible, [rewrite git history](https://blog.gitguardian.com/rewriting-git-history-cheatsheet?utm_source=product&utm_medium=GitHub_checks&utm_campaign=check_run_comment). Rewriting git history is not a trivial act. You might completely break other contributing developers' workflow and you risk accidentally deleting legitimate data. To avoid such incidents in the future consider - following these [best practices](https://blog.gitguardian.com/secrets-api-management/?utm_source=product&utm_medium=GitHub_checks&utm_campaign=check_run_comment) for managing and storing secrets including API keys and other credentials - install [secret detection on pre-commit](https://docs.gitguardian.com/ggshield-docs/integrations/git-hooks/pre-commit?utm_source=product&utm_medium=GitHub_checks&utm_campaign=check_run_comment) to catch secret before it leaves your machine and ease remediation. </details> --- 🦉 [GitGuardian](https://dashboard.gitguardian.com/auth/login/?utm_medium=checkruns&utm_source=github&utm_campaign=cr1) detects secrets in your source code to help developers and security teams secure the modern development process. You are seeing this because you or someone else with access to this repository has authorized GitGuardian to scan your pull request.