Plex: Larger edit window, and larger match/fix-match dialog with reduced font-size

larger_edit_window_in_plex.user.js

// ==UserScript==
// @name         Larger edit windows in Plex
// @version      0.1.19
// @date         2025-07-21
// @author       planetrocky
// @match        *://app.plex.tv/desktop*
// @grant        none
// @downloadURL  https://gist.github.com/planetrocky/64db17e51c846b205e382098c65ac2c0/raw/larger_edit_window_in_plex.user.js
// @updateURL    https://gist.github.com/planetrocky/64db17e51c846b205e382098c65ac2c0/raw/larger_edit_window_in_plex.user.js
// @source       https://gist.github.com/planetrocky/64db17e51c846b205e382098c65ac2c0/raw/larger_edit_window_in_plex.user.js
// ==/UserScript==

(function() {
    'use strict';

    const PADDING_TOP_BOTTOM = 40;

    // ## Properties dialog
    // Reduce dialog header/footer padding from 70->40
    // Increase properties dialogue to 75% vertical height

    const heightAdjust = 132 + 2 * PADDING_TOP_BOTTOM;

    let styleOverride = `
        :root {
            --dialog-max-height: calc(90vh - ${heightAdjust}px);
        }
        @supports selector(::-webkit-scrollbar) {
            .modal-dialog .dark-scrollbar::-webkit-scrollbar {
                width: 3em;
                color: #cc7b19;
            }
            .modal-dialog .dark-scrollbar::-webkit-scrollbar-thumb {
                background: #cc7b19;
            }
            .modal-dialog .dark-scrollbar::-webkit-scrollbar-button {
                background: #cc7b19;
            }
        }
        @supports (scrollbar-color: auto) {
            .modal-dialog .dark-scrollbar {
                scrollbar-arrow-color: #cc7b19;
                scrollbar-color: #cc7b19 #000000; /* thumb of the scrollbar, track of the scrollbar */
                scrollbar-width: auto; /* thin, auto, or none */
            }
        }
        .modal-dialog {
            padding-top: ${PADDING_TOP_BOTTOM}px;
            padding-bottom: ${PADDING_TOP_BOTTOM}px;
            max-width: 95%;
            width: 85vw !important;
        }
        .modal-body-scroll {
            max-height: var(--dialog-max-height) !important;
            height: auto;
        }
        .modal-body-with-panes .modal-body-pane {
            min-height: 400px; /* 400px was the static height previously. Make it the min height now */
            height: auto;
            max-height: var(--dialog-max-height) !important;
        }
        .match-result-list-item>.match-result {
            font-family: Verdana, sans-serif !important;
            font-size: 13px !important;
            padding: 1px;
        }
        .match-result-list-item>.match-result .match-name {
            color: #eee;
            font-weight: 300 !important;
        }
        .fix-incorrect-match-modal .modal-body-scroll {
            max-height: var(--dialog-max-height) !important;
            height: auto;
        }
        .fix-incorrect-match-modal .modal-body {
            min-height: 400px;
            min-height: 55vh;
            height: auto;
            max-height: var(--dialog-max-height) !important;
        }
        .col-xs-3 {
            width: 18%
        }
        .col-xs-9 {
            width: 82%;
        }
    `;

    const elementOverride = document.createElement('STYLE');
    elementOverride.innerText = styleOverride;
    document.body.appendChild(elementOverride);

})();