Greasy Fork is available in English.
Adjust video player to maintain 21:9 aspect ratio, filling screen minus sidebars and toolbars with minimal cropping, with dynamic full-screen adjustment
- // ==UserScript==// @name Ultrawide Fix for Kick// @namespace https://greasyfork.org/en/users/1200587-trilla-g// @version 1.16// @description Adjust video player to maintain 21:9 aspect ratio, filling screen minus sidebars and toolbars with minimal cropping, with dynamic full-screen adjustment// @match *://kick.com/*// @grant none// @license MIT// ==/UserScript==(function() {'use strict';// Function to adjust the video element considering sidebars and maintain 21:9 aspect ratiolet adjustVideoElement = () => {// Select the <video> elementlet videoElement = document.querySelector("video");if (videoElement) {// Sidebar and toolbar dimensions (only apply if not in full-screen mode)let leftSidebarWidth = 259;let rightSidebarWidth = 345;let topToolbarHeight = 77;// Check if the document is in full-screen modeif (document.fullscreenElement) {// Full-screen mode: fill entire screen with 21:9 aspect ratiovideoElement.style.width = '100vw';videoElement.style.height = 'calc(100vw / (21 / 9))';videoElement.style.position = 'fixed';videoElement.style.left = '0';videoElement.style.top = '0';} else {// Non-full-screen mode: adjust for sidebars and toolbarlet viewportWidth = window.innerWidth;let viewportHeight = window.innerHeight;let availableWidth = viewportWidth - (leftSidebarWidth + rightSidebarWidth);let desiredHeight = availableWidth / (21 / 9);videoElement.style.width = `${availableWidth}px`;videoElement.style.height = `${desiredHeight}px`;videoElement.style.position = 'fixed';videoElement.style.left = `${leftSidebarWidth}px`;videoElement.style.top = `${topToolbarHeight}px`;}// Ensure the video fits within the container without significant croppingvideoElement.style.objectFit = 'fill';}};// Adjust on full-screen change eventsdocument.addEventListener('fullscreenchange', adjustVideoElement);// Continuously adjust video element every 500mssetInterval(adjustVideoElement, 100);})();